oppi.li
juli.ee
+18
-14
src/components/search.tsx
+18
-14
src/components/search.tsx
···
72
72
</label>
73
73
</div>
74
74
<div class="flex w-full items-center gap-2">
75
-
<TextInput
76
-
ref={searchInput}
77
-
id="input"
78
-
placeholder={isTouchDevice ? "" : "Type / to search"}
79
-
class="grow"
80
-
/>
81
-
<Show when={loading()}>
82
-
<div class="i-lucide-loader-circle animate-spin text-xl" />
83
-
</Show>
84
-
<Show when={!loading()}>
85
-
<button type="submit" onclick={() => processInput(searchInput.value)}>
86
-
<div class="i-lucide-arrow-right text-xl" />
87
-
</button>
88
-
</Show>
75
+
<div class="dark:bg-dark-100 bg-light-100 border-1.5 flex grow items-center gap-2 rounded-lg border-neutral-300 px-2 py-1 focus-within:border-blue-500 dark:border-neutral-500">
76
+
<input
77
+
type="text"
78
+
spellcheck={false}
79
+
ref={searchInput}
80
+
id="input"
81
+
placeholder={isTouchDevice ? "" : "Type / to search"}
82
+
class="grow focus:outline-none"
83
+
/>
84
+
<Show when={loading()}>
85
+
<div class="i-lucide-loader-circle animate-spin text-xl" />
86
+
</Show>
87
+
<Show when={!loading()}>
88
+
<button type="submit" onclick={() => processInput(searchInput.value)}>
89
+
<div class="i-lucide-search text-xl text-neutral-500 dark:text-neutral-400" />
90
+
</button>
91
+
</Show>
92
+
</div>
89
93
<Show when={loginState()}>
90
94
<Tooltip
91
95
text="Repository"