retr0.id
forked from
pds.ls/pdsls
atproto explorer
restyle login input
juli.ee
+17
-19
src/components/login.tsx
+17
-19
src/components/login.tsx
···
64
64
65
65
return (
66
66
<form class="flex flex-col gap-y-2 px-1" onsubmit={(e) => e.preventDefault()}>
67
-
<div class="flex items-center gap-1">
68
-
<label for="handle" class="hidden">
69
-
Add account
70
-
</label>
71
-
<div class="dark:bg-dark-100 dark:shadow-dark-700 flex grow items-center gap-2 rounded-lg border-[0.5px] border-neutral-300 bg-white px-2 shadow-xs focus-within:outline-[1px] focus-within:outline-neutral-600 dark:border-neutral-600 dark:focus-within:outline-neutral-400">
72
-
<label
73
-
for="handle"
74
-
class="iconify lucide--user-round-plus text-neutral-500 dark:text-neutral-400"
75
-
></label>
76
-
<input
77
-
type="text"
78
-
spellcheck={false}
79
-
placeholder="user.bsky.social"
80
-
id="handle"
81
-
class="grow py-1 select-none placeholder:text-sm focus:outline-none"
82
-
onInput={(e) => setLoginInput(e.currentTarget.value)}
83
-
/>
84
-
</div>
67
+
<label for="handle" class="hidden">
68
+
Add account
69
+
</label>
70
+
<div class="dark:bg-dark-100 dark:shadow-dark-700 flex grow items-center gap-2 rounded-lg border-[0.5px] border-neutral-300 bg-white px-2 shadow-xs focus-within:outline-[1px] focus-within:outline-neutral-600 dark:border-neutral-600 dark:focus-within:outline-neutral-400">
71
+
<label
72
+
for="handle"
73
+
class="iconify lucide--user-round-plus text-neutral-500 dark:text-neutral-400"
74
+
></label>
75
+
<input
76
+
type="text"
77
+
spellcheck={false}
78
+
placeholder="user.bsky.social"
79
+
id="handle"
80
+
class="grow py-1 select-none placeholder:text-sm focus:outline-none"
81
+
onInput={(e) => setLoginInput(e.currentTarget.value)}
82
+
/>
85
83
<button
86
84
onclick={() => login(loginInput())}
87
-
class="flex items-center rounded-lg p-1.5 hover:bg-neutral-200 active:bg-neutral-300 dark:hover:bg-neutral-700 dark:active:bg-neutral-600"
85
+
class="flex items-center rounded-lg p-1 hover:bg-neutral-100 active:bg-neutral-200 dark:hover:bg-neutral-600 dark:active:bg-neutral-500"
88
86
>
89
87
<span class="iconify lucide--log-in"></span>
90
88
</button>