feat(website): init dark mode

This commit is contained in:
Darius Cepulis
2025-10-22 10:32:35 -07:00
parent 99afc51e94
commit 4502fe43ad
31 changed files with 280 additions and 92 deletions
+6 -1
View File
@@ -1,12 +1,15 @@
---
import type { ImageMetadata } from 'astro';
import { Font } from 'astro:assets';
import { SITE_TITLE } from '@/consts';
import '@/styles/globals.css';
import FooterEasterEgg from '@/components/FooterEasterEgg.astro';
import Posthog from '@/components/Posthog.astro';
import ThemeInit from '@/components/ThemeInit.astro';
interface Props {
title: string | string[];
@@ -69,11 +72,13 @@ const fullTitle = Array.isArray(title)
{/* Analytics */}
<Posthog />
<ThemeInit />
</head>
<body
class:list={[
'relative',
'bg-light-80 text-dark-100',
'bg-light-80 dark:bg-dark-100 text-dark-100 dark:text-light-80',
'font-sans antialiased text-pretty text-base',
'min-w-80',
'[--nav-h:calc(var(--spacing)*13)] sm:[--nav-h:calc(var(--spacing)*14)]',
+1 -1
View File
@@ -34,7 +34,7 @@ const docTitles = new Map(allDocs.map((d) => [d.id, d.data.title]));
<DocsSidebar slot="mobile-nav" framework={framework} style={style} docTitles={docTitles} />
</NavBar>
<aside
class="hidden lg:block lg:border-r border-light-40 sticky overflow-y-scroll"
class="hidden lg:block lg:border-r border-light-40 dark:border-dark-80 sticky overflow-y-scroll"
style="top: var(--nav-h); max-height: calc(100vh - var(--nav-h));"
>
<DocsSidebar framework={framework} style={style} docTitles={docTitles}>