Skip to content

Commit 284de43

Browse files
EhespEhesp
committed
-
1 parent 9053935 commit 284de43

File tree

10 files changed

+6940
-390
lines changed

10 files changed

+6940
-390
lines changed

‎package-lock.json

Lines changed: 90 additions & 43 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎website-v3/package.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,11 @@
1313
"dependencies": {
1414
"@astrojs/node": "^3.1.0",
1515
"@astrojs/tailwind": "^2.1.3",
16+
"@docsearch/js": "^3.3.0",
1617
"astro": "^1.6.14",
1718
"classnames": "^2.3.2",
1819
"color": "^4.2.3",
20+
"cookie": "^0.5.0",
1921
"lodash.get": "^4.4.2",
2022
"mdx-bundler": "^9.0.1",
2123
"nanostores": "^0.7.1",

‎website-v3/src/components/Links.astro

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,3 +24,8 @@ const { config } = context.get();
2424
<!-- TODO: {config.experimentalCodehike && (
2525
<link slot="head" data-testid="codehike-styles" rel="stylesheet" href={codeHikeStyles} />
2626
)} -->
27+
{
28+
!!config.docsearch && (
29+
<link rel="preconnect" href={`https://${config.docsearch.appId}-dsn.algolia.net`} crossorigin />
30+
)
31+
}

‎website-v3/src/components/Scripts.astro

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,4 +42,4 @@ const { domain, config } = context.get();
4242
config.plausibleAnalytics && domain && (
4343
<script slot="head" defer data-domain={domain} src="https://plausible.io/js/plausible.js" />
4444
)
45-
}
45+
}

‎website-v3/src/components/Search.astro

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
---
2+
import '@docsearch/css';
3+
---
4+
5+
<div id="#docsearch"></div>
6+
<script>
7+
import docsearch from '@docsearch/js';
8+
9+
docsearch({
10+
container: '#docsearch',
11+
appId: 'R2IYF7ETH7',
12+
apiKey: '599cec31baffa4868cae4e79f180729b',
13+
indexName: 'docsearch',
14+
});
15+
</script>

‎website-v3/src/layouts/Header.astro

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
import Link from '@components/Link';
3-
import cx from 'classnames';
3+
import Search from '@components/Search.astro';
44
import context from 'src/context';
55
import { getImagePath } from 'src/utils';
66
@@ -12,7 +12,7 @@ const logoDark = getImagePath(config.logoDark);
1212
---
1313

1414
<header class="sticky top-0 border-b border-slate-800/80 bg:white z-10 backdrop-blur">
15-
<div class="absolute inset-0 z-0 dark:bg-zinc-900/90 dark:text-white" />
15+
<div class="absolute inset-0 z-0 dark:bg-zinc-900/90 dark:text-white"></div>
1616
<div class="max-w-8xl mx-auto relative z-10">
1717
<div class="h-16 px-4 lg:px-8 mx-4 lg:mx-0 flex items-center">
1818
<div class="flex-1">
@@ -33,7 +33,9 @@ const logoDark = getImagePath(config.logoDark);
3333
}
3434
</Link>
3535
</div>
36-
<div>Search</div>
36+
<div>
37+
{!!config.docsearch && <Search />}
38+
</div>
3739
<div class="flex-1 flex items-center justify-end">Menu</div>
3840
</div>
3941
</div>

‎website-v3/src/layouts/Navigation.astro

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,4 +17,6 @@ const headings = context.get().headings || [];
1717
))
1818
}
1919
</ul>
20-
<script></script>
20+
<script>
21+
// TODO - scrollspy
22+
</script>

‎website-v3/src/layouts/Root.astro

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,14 @@ export interface Props {
99
}
1010
1111
const { title = '', description = '', image = '', author = '' } = Astro.props;
12+
const theme = Astro.cookies.get('theme').value;
1213
---
1314

14-
<html>
15+
<html
16+
class:list={{
17+
dark: !!theme && theme === 'dark',
18+
}}
19+
>
1520
<head>
1621
<meta charset="utf-8" />
1722
<meta name="viewport" content="width=device-width, initial-scale=1" />
@@ -52,14 +57,10 @@ const { title = '', description = '', image = '', author = '' } = Astro.props;
5257
<meta name="twitter:creator" content={`@${author}`} />
5358
</head>
5459
<body class="font-inter overflow-x-hidden overflow-y-scroll dark:bg-zinc-900 dark:text-white">
55-
<script is:inline>
56-
if (
57-
localStorage.theme === 'dark' ||
58-
(!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)
59-
) {
60+
<script is:inline define:vars={{ theme }}>
61+
// Only check users preference if they haven't already set a theme
62+
if (!theme && window.matchMedia('(prefers-color-scheme: dark)').matches) {
6063
document.documentElement.classList.add('dark');
61-
} else {
62-
document.documentElement.classList.remove('dark');
6364
}
6465
</script>
6566
<slot />

‎website-v3/src/pages/api/theme.ts

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import type { APIRoute } from 'astro';
2+
import { z } from 'zod';
3+
import cookie from 'cookie';
4+
5+
const $Request = z.object({
6+
owner: z.string(),
7+
repository: z.string(),
8+
domain: z.string().optional(),
9+
theme: z.enum(['dark', 'light']),
10+
});
11+
12+
export const post: APIRoute = async function ({ request }) {
13+
try {
14+
const { owner, repository, domain, theme } = $Request.parse(await request.json());
15+
16+
// Set an expiry for 10 years
17+
const expires = new Date();
18+
expires.setFullYear(expires.getFullYear() + 10);
19+
20+
return new Response(null, {
21+
status: 200,
22+
headers: new Headers({
23+
'Set-Cookie': cookie.serialize('theme', theme, {
24+
expires: expires,
25+
// If its a domain, set the cookie to the root path, otherwise set it to the owner/repository
26+
path: domain ? '/' : `/${owner}/${repository}`,
27+
}),
28+
}),
29+
});
30+
} catch {
31+
return new Response(null, {
32+
status: 400,
33+
});
34+
}
35+
};

0 commit comments

Comments
 (0)