kamil/libnovel
1
1
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 162 Wiki Activity

fix: remove redundant X icons from SearchModal search input

Browse Source 
Removed the custom clear button (shown when query is non-empty) and
suppressed the browser-native webkit search cancel button via CSS.
Only the single Cancel button remains, avoiding the double/triple X
clutter on wider screens.
This commit is contained in:
root
2026-04-12 22:24:58 +05:00
parent 14388e8186
commit 6af5a4966f
1 changed files with 1 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
ui/src/lib/components/SearchModal.svelte
View File

@@ -223,26 +223,13 @@
bind:value={query} bind:value={query}
type="search" type="search"
placeholder="Search books, authors, genres…" placeholder="Search books, authors, genres…"
class="flex-1 bg-transparent text-(--color-text) placeholder:text-(--color-muted) text-base focus:outline-none min-w-0" class="flex-1 bg-transparent text-(--color-text) placeholder:text-(--color-muted) text-base focus:outline-none min-w-0 [&::-webkit-search-cancel-button]:hidden [&::-webkit-search-decoration]:hidden"
onkeydown={(e) => { if (e.key === 'Enter') { e.preventDefault(); submitQuery(); } }} onkeydown={(e) => { if (e.key === 'Enter') { e.preventDefault(); submitQuery(); } }}
autocomplete="off" autocomplete="off"
autocorrect="off" autocorrect="off"
spellcheck={false} spellcheck={false}
/> />
{#if query}
<button
type="button"
onclick={() => { query = ''; inputEl?.focus(); }}
class="shrink-0 p-1 rounded-full text-(--color-muted) hover:text-(--color-text) hover:bg-(--color-surface-2) transition-colors"
aria-label="Clear search"
>
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
</svg>
</button>
{/if}
<button <button
type="button" type="button"
onclick={onclose} onclick={onclose}