1
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-07-03 14:46:37 -04:00

detatch theme provider from stitches logic

This commit is contained in:
2024-02-15 10:48:45 -05:00
parent b5f0f56702
commit 6f5c066525
11 changed files with 41 additions and 144 deletions

View File

@ -6,7 +6,7 @@ import { ThemeProvider } from "../contexts/ThemeContext";
import Layout from "../components/Layout";
import * as config from "../lib/config";
import { defaultSeo, socialProfileJsonLd } from "../lib/config/seo";
import { globalStyles, themeClassNames } from "../lib/styles/stitches.config";
import { globalStyles, classNames } from "../lib/styles/stitches.config";
import type { ReactElement, ReactNode } from "react";
import type { NextPage } from "next";
import type { AppProps as NextAppProps } from "next/app";
@ -72,7 +72,7 @@ const App = ({ Component, pageProps }: AppProps) => {
/>
<SocialProfileJsonLd {...socialProfileJsonLd} />
<ThemeProvider classNames={themeClassNames}>{getLayout(<Component {...pageProps} />)}</ThemeProvider>
<ThemeProvider classNames={classNames}>{getLayout(<Component {...pageProps} />)}</ThemeProvider>
</>
);
};

View File

@ -1,16 +1,12 @@
import { Html, Head, Main, NextScript } from "next/document";
import ThemeScript from "../components/ThemeScript";
import { getCssText, themeClassNames, themeStorageKey } from "../lib/styles/stitches.config";
import { getCssText, theme } from "../lib/styles/stitches.config";
import * as config from "../lib/config";
// https://nextjs.org/docs/advanced-features/custom-document
const Document = () => {
return (
<Html lang={config.siteLocale} className={themeClassNames["light"]}>
<Html lang={config.siteLocale} className={theme.className}>
<Head>
{/* inject this script (generated at build-time) to prioritize setting/restoring the user's theme. */}
<ThemeScript key="restore-theme-js" {...{ themeClassNames, themeStorageKey }} />
<style id="stitches" dangerouslySetInnerHTML={{ __html: getCssText() }} />
</Head>
<body>

View File

@ -97,6 +97,11 @@ const Sup = styled("sup", {
fontSize: "0.6em",
});
const PGPIcon = styled(GoLock, {
verticalAlign: "-0.25em",
strokeWidth: 0.5,
});
const PGPKey = styled("code", {
margin: "0 0.15em",
letterSpacing: "0.075em",
@ -335,8 +340,7 @@ const Index = () => {
underline={false}
openInNewTab
>
<GoLock size="1.25em" style={{ verticalAlign: "-0.25em", strokeWidth: 0.5 }} />{" "}
<PGPKey>2B0C 9CF2 51E6 9A39</PGPKey>
<PGPIcon size="1.25em" /> <PGPKey>2B0C 9CF2 51E6 9A39</PGPKey>
</ColorfulLink>
</Sup>
,{" "}