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

fontsource -> next/font

This commit is contained in:
2022-10-28 09:26:01 -04:00
parent 840e73b49a
commit 6520e6fa2e
11 changed files with 45 additions and 232 deletions

View File

@ -1,7 +1,6 @@
import { Html, Head, Main, NextScript } from "next/document";
import ThemeScript from "../components/ThemeScript";
import { getCssText, themeClassNames, themeStorageKey } from "../lib/styles/stitches.config";
import { Inter, RobotoMono } from "../lib/styles/fonts";
import * as config from "../lib/config";
// https://nextjs.org/docs/advanced-features/custom-document
@ -12,11 +11,6 @@ const Document = () => {
{/* inject a small script to set/restore the user's theme ASAP */}
<ThemeScript id="restore-theme" {...{ themeClassNames, themeStorageKey }} />
{/* preload highest priority fonts defined in ../lib/styles/fonts/ */}
{[...Inter.preloads, ...RobotoMono.preloads].map(({ href, type }) => (
<link key={href} rel="preload" as="font" {...{ type, href }} crossOrigin="anonymous" />
))}
<style id="stitches" dangerouslySetInnerHTML={{ __html: getCssText() }} />
</Head>
<body>

View File

@ -1,4 +1,5 @@
import { NextSeo } from "next-seo";
import { Comic_Neue } from "@next/font/google";
import Layout from "../components/Layout";
import Content from "../components/Content";
import PageTitle from "../components/PageTitle";
@ -8,8 +9,7 @@ import IFrame from "../components/IFrame";
import CodeInline from "../components/CodeInline";
import HorizontalRule from "../components/HorizontalRule";
import { Windows95Logo } from "../components/Icons";
import { styled, theme, globalCss } from "../lib/styles/stitches.config";
import { ComicNeue } from "../lib/styles/fonts";
import { styled, theme } from "../lib/styles/stitches.config";
import type { ReactElement } from "react";
import img_wayback from "../public/static/images/previously/wayback.png";
@ -182,20 +182,22 @@ const Previously = () => {
);
};
const comicNeue = Comic_Neue({
weight: "700",
display: "swap",
fallback: ["'Comic Sans MS'", "'Comic Sans'"],
adjustFontFallback: false,
preload: false,
});
// a complete sh*tshow of "global" overrides, mainly to compensate for font change
Previously.getLayout = (page: ReactElement) => {
// only declare Comic Neue typeface if/when this page is loaded.
// note: other "global" styles for this page are declared via the `css={{...}}` prop below instead, so they don't
// persist when navigating away to a different page.
globalCss({
"@font-face": [...ComicNeue.family],
})();
return (
<Layout
css={{
fontFamily: `"${ComicNeue.name.regular}", "Comic Sans MS", "Comic Sans", ${theme.fonts.sans.value}`,
fontWeight: 600,
// only declare Comic Neue typeface if/when this page is loaded.
fontFamily: `${comicNeue.style.fontFamily}, ${theme.fonts.sans.value}`,
fontWeight: 700,
// classic windows 9x cursor easter egg
cursor: `url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAZklEQVR4AWIAgn/uBT6A9uoAAwAQiIJo97/0Rgy0ANoJH8MPeEgtqwPQEACqCoQHAKECQKgAECoAhAoAoQJAqAAQxh1oPQfcW3kJpxHtL1AAHAwEwwdYiH8BIEgBTBRAAAEEEEAAG7mRt30hEhoLAAAAAElFTkSuQmCC") 2 1, auto`,