samantha's personal website!~ ✨
samanthanguyen.me
dark mode!
+17
-5
+2
src/app.css
+2
src/app.css
+15
-5
src/routes/+page.svelte
+15
-5
src/routes/+page.svelte
···
3
3
import { twJoin, twMerge } from 'tailwind-merge'
4
4
</script>
5
5
6
-
<section class="flex flex-col gap-6 lg:gap-8 selection:bg-pink-200 selection:text-pink-800">
6
+
<section class={twJoin(
7
+
"flex flex-col gap-6 lg:gap-8",
8
+
"selection:bg-pink-200 selection:text-pink-800",
9
+
"dark:selection:bg-yellow-400 selection:text-zinc-950"
10
+
)}>
7
11
<header class="flex flex-col gap-2">
8
12
<h1 class={twMerge(
9
13
"pt-12 flex items-end",
···
12
16
samanthanguyen.me
13
17
</h1>
14
18
<span class={twJoin(
15
-
"text-sm lg:text-base",
19
+
"text-sm lg:text-base dark:text-zinc-500",
16
20
"font-domine",
17
21
)}>
18
22
she / her. artist, software engineer, aspiring computer scientist
···
46
50
</main>
47
51
<footer class={twJoin(
48
52
"mt-[-1rem] lg:mt-0 pt-4 flex flex-row gap-4 justify-end",
49
-
"border-0 lg:border-t border-zinc-300",
53
+
"border-0 lg:border-t border-zinc-300 dark:border-zinc-800",
50
54
)}>
51
55
<a href="https://bsky.app/profile/samanthanguyen.me" title="@samanthanguyen.me on Bluesky">
52
-
<IconBrandBluesky size={32} stroke={1} class="text-zinc-950 hover:fill-zinc-950" />
56
+
<IconBrandBluesky
57
+
size={32}
58
+
stroke={1}
59
+
class={twJoin("text-zinc-950 hover:fill-zinc-950", "dark:text-gray-50 hover:fill-gray-50")} />
53
60
</a>
54
61
<a href="https://github.com/neoncitylights" title="@neoncitylights on GitHub">
55
-
<IconBrandGithub size={32} stroke={1} class="text-zinc-950 hover:fill-zinc-950" />
62
+
<IconBrandGithub
63
+
size={32}
64
+
stroke={1}
65
+
class={twJoin("text-zinc-950 hover:fill-zinc-950", "dark:text-gray-50 hover:fill-gray-50")} />
56
66
</a>
57
67
</footer>
58
68
</section>