tangled
alpha
login
or
join now
ansxor.ca
/
pdsls
forked from
pds.ls/pdsls
0
fork
atom
atmosphere explorer
0
fork
atom
overview
issues
pulls
pipelines
favicon easter egg
handle.invalid
1 month ago
ac8bd1e6
fd8c32df
verified
This commit was signed with the committer's
known signature
.
handle.invalid
SSH Key Fingerprint:
SHA256:mBrT4x0JdzLpbVR95g1hjI1aaErfC02kmLRkPXwsYCk=
+42
-2
1 changed file
expand all
collapse all
unified
split
src
components
navbar.tsx
+42
-2
src/components/navbar.tsx
···
32
32
33
33
export const NavBar = (props: { params: Params }) => {
34
34
const [handle, setHandle] = createSignal(props.params.repo);
35
35
+
const [repoHovered, setRepoHovered] = createSignal(false);
36
36
+
const [hasHoveredRepo, setHasHoveredRepo] = createSignal(false);
37
37
+
const [faviconLoaded, setFaviconLoaded] = createSignal(false);
38
38
+
const isCustomDomain = () => handle() && !handle()!.endsWith(".bsky.social");
35
39
36
40
createEffect(() => {
37
41
if (pds() !== undefined && props.params.repo) {
···
41
45
?.split("at://")[1] ?? props.params.repo;
42
46
if (hdl !== handle()) setHandle(hdl);
43
47
}
48
48
+
});
49
49
+
50
50
+
createEffect(() => {
51
51
+
handle();
52
52
+
setHasHoveredRepo(false);
53
53
+
setFaviconLoaded(false);
44
54
});
45
55
46
56
const rkeyTimestamp = createMemo(() => {
···
95
105
<div class="flex flex-col">
96
106
<Show when={props.params.repo}>
97
107
{/* Repository Level */}
98
98
-
<div class="group relative flex items-center justify-between gap-1 rounded-md border-[0.5px] border-transparent bg-transparent px-2 transition-all duration-200 hover:border-neutral-300 hover:bg-neutral-50/40 dark:hover:border-neutral-600 dark:hover:bg-neutral-800/40">
108
108
+
<div
109
109
+
class="group relative flex items-center justify-between gap-1 rounded-md border-[0.5px] border-transparent bg-transparent px-2 transition-all duration-200 hover:border-neutral-300 hover:bg-neutral-50/40 dark:hover:border-neutral-600 dark:hover:bg-neutral-800/40"
110
110
+
onMouseEnter={() => {
111
111
+
setRepoHovered(true);
112
112
+
setHasHoveredRepo(true);
113
113
+
}}
114
114
+
onMouseLeave={() => setRepoHovered(false)}
115
115
+
>
99
116
<div class="flex min-w-0 basis-full items-center gap-2">
100
117
<Tooltip text="Repository">
101
101
-
<span class="iconify lucide--book-user shrink-0 text-neutral-500 transition-colors duration-200 group-hover:text-neutral-700 dark:text-neutral-400 dark:group-hover:text-neutral-200"></span>
118
118
+
<div class="relative flex h-5 w-4 shrink-0 items-center justify-center">
119
119
+
<span
120
120
+
class="iconify lucide--book-user absolute text-neutral-500 transition-colors duration-200 group-hover:text-neutral-700 dark:text-neutral-400 dark:group-hover:text-neutral-200"
121
121
+
classList={{
122
122
+
hidden:
123
123
+
(repoHovered() && isCustomDomain() && faviconLoaded()) ||
124
124
+
(repoHovered() && handle() === "jcsalterego.bsky.social"),
125
125
+
}}
126
126
+
></span>
127
127
+
<Show when={repoHovered() && handle() === "jcsalterego.bsky.social"}>
128
128
+
<div class="flex size-4 items-center justify-center rounded-full bg-blue-500">
129
129
+
<span class="iconify lucide--check size-2.5 text-white"></span>
130
130
+
</div>
131
131
+
</Show>
132
132
+
<Show when={hasHoveredRepo() && isCustomDomain()}>
133
133
+
<img
134
134
+
src={`https://${handle()}/favicon.ico`}
135
135
+
class="size-4 rounded-full"
136
136
+
classList={{ hidden: !repoHovered() || !faviconLoaded() }}
137
137
+
onLoad={() => setFaviconLoaded(true)}
138
138
+
onError={() => setFaviconLoaded(false)}
139
139
+
/>
140
140
+
</Show>
141
141
+
</div>
102
142
</Tooltip>
103
143
<Show
104
144
when={props.params.collection}