diff options
Diffstat (limited to 'themes/danix-xyz-hacker/layouts/partials/search-modal.html')
| -rw-r--r-- | themes/danix-xyz-hacker/layouts/partials/search-modal.html | 87 |
1 files changed, 0 insertions, 87 deletions
diff --git a/themes/danix-xyz-hacker/layouts/partials/search-modal.html b/themes/danix-xyz-hacker/layouts/partials/search-modal.html deleted file mode 100644 index 6b96b3a..0000000 --- a/themes/danix-xyz-hacker/layouts/partials/search-modal.html +++ /dev/null @@ -1,87 +0,0 @@ -<!-- Desktop Search Modal (hidden on mobile, shown via Alpine) --> -<div - x-cloak - x-data="searchOverlay()" - @keydown.escape.window="handleEscape($event)" - @open-search.window="open()" - class="fixed inset-0 z-50" - :class="{ 'flex items-center justify-center': isOpen, 'hidden': !isOpen }" - x-show="isOpen" -> - <!-- Overlay backdrop --> - <div - class="absolute inset-0 bg-black/50" - @click="close()" - aria-hidden="true" - ></div> - - <!-- Modal content --> - <div - class="relative bg-bg border-2 border-accent rounded-lg shadow-xl max-w-2xl mx-4 w-full" - role="dialog" - aria-labelledby="search-modal-title" - aria-modal="true" - > - <!-- Header with close button --> - <div class="flex items-center justify-between p-6 border-b border-border"> - <h2 id="search-modal-title" class="text-xl font-bold text-accent"> - {{ i18n "searchArticles" }} - </h2> - <button - @click="close()" - aria-label="Close search" - class="p-2 rounded hover:bg-surface transition-colors focus:outline-none focus:ring-2 focus:ring-accent" - > - <i data-feather="x" class="w-5 h-5" aria-hidden="true"></i> - </button> - </div> - - <!-- Search input --> - <div class="p-6 border-b border-border"> - <label for="search-input-desktop" class="sr-only"> - {{ i18n "searchPlaceholder" }} - </label> - <input - id="search-input-desktop" - type="text" - :value="searchQuery" - @input="filterArticles($el.value)" - placeholder="{{ i18n "searchPlaceholder" }}" - class="w-full px-4 py-3 border-2 border-border rounded focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent bg-bg text-text" - aria-describedby="search-results" - /> - </div> - - <!-- Results container --> - <div id="search-results" class="max-h-96 overflow-y-auto p-6"> - <!-- Results list --> - <div x-show="filteredArticles.length > 0" class="space-y-3" role="region" aria-live="polite"> - <template x-for="article in filteredArticles" :key="article.url"> - <div class="p-4 border-l-4 border-accent bg-bg/50 hover:bg-bg/70 transition-colors rounded"> - <a :href="article.url" class="block focus:outline-none focus:ring-2 focus:ring-accent rounded px-2 py-1"> - <h3 class="font-bold text-accent hover:underline" x-text="article.title"></h3> - <p class="text-sm text-text-dim mt-1" x-text="article.date"></p> - </a> - </div> - </template> - </div> - - <!-- Empty state --> - <div - x-show="searchQuery && filteredArticles.length === 0" - class="text-center py-8 text-text-dim" - role="status" - > - {{ i18n "noSearchResults" }} - </div> - - <!-- No query state --> - <div - x-show="!searchQuery" - class="text-center py-8 text-text-dim" - > - {{ i18n "searchPlaceholder" }} - </div> - </div> - </div> -</div> |
