forked from
pds.ls/pdsls
atproto explorer
restyle account manager
+26
-19
+1
-2
src/components/account.tsx
+1
-2
src/components/account.tsx
···
69
69
<>
70
70
<Modal open={openManager()} onClose={() => setOpenManager(false)}>
71
71
<div class="dark:bg-dark-300 dark:shadow-dark-800 absolute top-16 left-[50%] w-[22rem] -translate-x-1/2 rounded-lg border-[0.5px] border-neutral-300 bg-neutral-50 p-4 shadow-md transition-opacity duration-200 dark:border-neutral-700 starting:opacity-0">
72
-
<div class="mb-2 flex items-center gap-1 px-1 font-semibold">
73
-
<span class="iconify lucide--user-round"></span>
72
+
<div class="mb-2 px-1 font-semibold">
74
73
<span>Manage accounts</span>
75
74
</div>
76
75
<div class="mb-3 max-h-[20rem] overflow-y-auto md:max-h-[25rem]">
+20
-12
src/components/login.tsx
+20
-12
src/components/login.tsx
···
12
12
type Session,
13
13
} from "@atcute/oauth-browser-client";
14
14
import { createSignal, Show } from "solid-js";
15
-
import { TextInput } from "./text-input";
16
15
17
16
configureOAuth({
18
17
metadata: {
···
29
28
30
29
const login = async (handle: string) => {
31
30
try {
31
+
setNotice("");
32
32
if (!handle) return;
33
33
let resolved;
34
34
if (!isHandle(handle)) {
···
58
58
return (
59
59
<form class="flex flex-col gap-y-2 px-1" onsubmit={(e) => e.preventDefault()}>
60
60
<div class="flex items-center gap-1">
61
-
<label for="handle" class="mr-1 flex items-center">
62
-
<span class="iconify lucide--user-round-plus text-lg"></span>
61
+
<label for="handle" class="hidden">
62
+
Add account
63
63
</label>
64
-
<TextInput
65
-
id="handle"
66
-
placeholder="user.bsky.social"
67
-
onInput={(e) => setLoginInput(e.currentTarget.value)}
68
-
class="grow"
69
-
/>
64
+
<div class="dark:bg-dark-100 dark:shadow-dark-800 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-700 dark:focus-within:outline-neutral-400">
65
+
<label
66
+
for="handle"
67
+
class="iconify lucide--user-round-plus text-neutral-500 dark:text-neutral-400"
68
+
></label>
69
+
<input
70
+
type="text"
71
+
spellcheck={false}
72
+
placeholder="user.bsky.social"
73
+
id="handle"
74
+
class="grow py-1 select-none placeholder:text-sm focus:outline-none"
75
+
onInput={(e) => setLoginInput(e.currentTarget.value)}
76
+
/>
77
+
</div>
70
78
<button
71
79
onclick={() => login(loginInput())}
72
-
class="flex items-center rounded-lg p-1 hover:bg-neutral-200 active:bg-neutral-300 dark:hover:bg-neutral-700 dark:active:bg-neutral-600"
80
+
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"
73
81
>
74
-
<span class="iconify lucide--log-in text-lg"></span>
82
+
<span class="iconify lucide--log-in"></span>
75
83
</button>
76
84
</div>
77
85
<Show when={notice()}>
78
-
<div>{notice()}</div>
86
+
<div class="text-sm">{notice()}</div>
79
87
</Show>
80
88
</form>
81
89
);
+5
-5
src/components/search.tsx
+5
-5
src/components/search.tsx
···
99
99
<label for="input" class="hidden">
100
100
PDS URL, AT URI, or handle
101
101
</label>
102
-
<div class="dark:bg-dark-100 dark:shadow-dark-800 flex items-center gap-2 rounded-lg border-[0.5px] border-neutral-300 bg-white px-2 py-1 shadow-xs focus-within:outline-[1px] focus-within:outline-neutral-600 dark:border-neutral-700 dark:focus-within:outline-neutral-400">
103
-
<span
102
+
<div class="dark:bg-dark-100 dark:shadow-dark-800 flex 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-700 dark:focus-within:outline-neutral-400">
103
+
<label
104
+
for="input"
104
105
class="iconify lucide--search text-neutral-500 dark:text-neutral-400"
105
-
onClick={() => searchInput.focus()}
106
-
></span>
106
+
></label>
107
107
<input
108
108
type="text"
109
109
spellcheck={false}
110
110
placeholder="PDS URL, AT URI, DID, or handle"
111
111
ref={searchInput}
112
112
id="input"
113
-
class="grow select-none placeholder:text-sm focus:outline-none"
113
+
class="grow py-1 select-none placeholder:text-sm focus:outline-none"
114
114
value={input() ?? ""}
115
115
onInput={(e) => setInput(e.currentTarget.value)}
116
116
/>