remove css reset as a dependency

app/contact/form.tsx

@@ -100,7 +100,7 @@ const ContactForm = () => {
         <Link href="https://jarv.is" plain>
           links
         </Link>
-        ](https://jarv.is), and <code style={{ fontFamily: "var(--fonts-mono)" }}>`code`</code>.
+        ](https://jarv.is), and <code>`code`</code>.
       </div>
 
       <div style={{ margin: "1em 0" }}>

app/contact/page.tsx

@@ -32,7 +32,6 @@ const Page = () => {
         <Link href="https://jrvs.io/pgp" title="My Public Key">
           <code
             style={{
-              fontFamily: "var(--fonts-mono)",
               fontSize: "0.925em",
               letterSpacing: "0.075em",
               wordSpacing: "-0.3em",

app/global.css

@@ -0,0 +1,64 @@
+/*! Adapted from modern-normalize.css | MIT License | https://github.com/sindresorhus/modern-normalize */
+*,
+::before,
+::after {
+  box-sizing: border-box;
+}
+
+html {
+  line-height: 1.15;
+  tab-size: 4;
+  /* stylelint-disable-next-line property-no-vendor-prefix */
+  -webkit-text-size-adjust: 100%;
+}
+
+body {
+  margin: 0;
+  font-family: var(--fonts-sans);
+}
+
+code,
+kbd,
+samp,
+pre {
+  font-size: 1em;
+  font-family: var(--fonts-mono);
+}
+
+small {
+  font-size: 80%;
+}
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+button,
+input,
+select,
+textarea {
+  font-family: inherit;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+}
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+  /* stylelint-disable-next-line property-no-vendor-prefix */
+  -webkit-appearance: button;
+}

app/layout.module.css

@@ -1,5 +1,4 @@
 .body {
-  font-family: var(--fonts-sans);
   background-color: var(--colors-background-inner);
 }
 

app/layout.tsx

@@ -12,7 +12,7 @@ import type { Metadata } from "next";
 import type { Person, WebSite } from "schema-dts";
 
 import { GeistMono, GeistSans } from "./fonts";
-import "modern-normalize/modern-normalize.css"; // https://github.com/sindresorhus/modern-normalize/blob/main/modern-normalize.css
+import "./global.css";
 import "./themes.css";
 
 import styles from "./layout.module.css";

app/manifest.ts

@@ -1,8 +1,6 @@
 import * as config from "../lib/config";
 import type { MetadataRoute } from "next";
 
-export const dynamic = "force-static";
-
 const manifest = (): MetadataRoute.Manifest => {
   return {
     name: config.siteName,

app/notes/[slug]/opengraph-image.tsx

@@ -14,7 +14,6 @@ export const size = {
 };
 
 // generate and cache these images at build-time for each slug, since doing this on-demand is mega slow...
-export const dynamic = "force-static";
 export const dynamicParams = false;
 
 export const generateStaticParams = async () => {

app/notes/[slug]/page.module.css

@@ -20,7 +20,7 @@
   display: inline-block;
   width: 1.2em;
   height: 1.2em;
-  vertical-align: -0.25em;
+  vertical-align: -0.225em;
   margin-right: 0.6em;
 }
 

app/notes/page.module.css

@@ -35,7 +35,7 @@
   margin-bottom: 0;
 }
 
-.postDate {
+.date {
   width: 5.25em;
   flex-shrink: 0;
   color: var(--colors-medium);

app/notes/page.tsx

@@ -38,7 +38,7 @@ const Page = async () => {
         <ul className={styles.list}>
           {posts.map(({ slug, date, title, htmlTitle }) => (
             <li className={styles.post} key={slug}>
-              <Time date={date} format="MMM d" className={styles.postDate} />
+              <Time date={date} format="MMM d" className={styles.date} />
               <span>
                 <Link href={`/${POSTS_DIR}/${slug}`} dangerouslySetInnerHTML={{ __html: htmlTitle || title }} />
               </span>

app/page.module.css

@@ -1,28 +1,28 @@
-.page h1 {
+.index h1 {
   margin: 0 0 0.5em -1px; /* misaligned left margin, super nitpicky */
   font-size: 1.925em;
   font-weight: 500;
   line-height: 1.2;
 }
 
-.page h2 {
+.index h2 {
   margin: 0.5em 0 0.5em -1px;
   font-size: 1.3em;
   font-weight: 400;
   line-height: 1.5;
 }
 
-.page p {
+.index p {
   margin: 0.85em 0;
   font-size: 1.05em;
   line-height: 1.7;
 }
 
-.page p:last-of-type {
+.index p:last-of-type {
   margin-bottom: 0;
 }
 
-.page sup {
+.index sup {
   margin: 0 0.1em;
   font-size: 0.6em;
 }
@@ -70,15 +70,15 @@
 }
 
 @media (max-width: 768px) {
-  .page h1 {
+  .index h1 {
     font-size: 1.8em;
   }
 
-  .page h2 {
+  .index h2 {
     font-size: 1.3em;
   }
 
-  .page p {
+  .index p {
     font-size: 1em;
     line-height: 1.9;
   }

app/page.tsx

@@ -28,7 +28,7 @@ const Link = ({
           // workaround to have react combine all of these inline styles into a single <style> tag up top, see:
           // https://react.dev/reference/react-dom/components/style#rendering-an-inline-css-stylesheet
           href={uniqueId}
-          precedence={styles.page}
+          precedence={styles.index}
         >
           {`.t_${uniqueId}{--colors-link:${lightColor};--colors-link-underline:${rgba(lightColor, 0.4)}}[data-theme="dark"] .t_${uniqueId}{--colors-link:${darkColor};--colors-link-underline:${rgba(darkColor, 0.4)}}`}
         </style>
@@ -45,7 +45,7 @@ const Link = ({
 
 const Page = () => {
   return (
-    <div className={styles.page}>
+    <div className={styles.index}>
       <h1>
         Hi there! I&rsquo;m Jake. <span className={styles.wave}>👋</span>
       </h1>
@@ -276,16 +276,15 @@ const Page = () => {
             plain
           >
             <LockIcon size="1.25em" style={{ verticalAlign: "-0.25em" }} />{" "}
-            <span
+            <code
               style={{
                 margin: "0 0.15em",
-                fontFamily: "var(--fonts-mono)",
                 letterSpacing: "0.075em",
                 wordSpacing: "-0.4em",
               }}
             >
               2B0C 9CF2 51E6 9A39
-            </span>
+            </code>
           </Link>
         </sup>
         ,{" "}

app/previously/page.mdx

@@ -81,7 +81,7 @@ _Previously on the [Cringey Chronicles™](https://web.archive.org/web/20010
 
 ---
 
-🚨 Trigger warning: excessive marquees, animated GIFs, Comic Sans, popups, <code style={{ fontFamily: "var(--fonts-mono)", fontWeight: "normal", fontSize: "0.9em" }}>color: <span style={{ color: "#32cd32" }}>limegreen</span></code> ahead...
+🚨 Trigger warning: excessive marquees, animated GIFs, Comic Sans, popups, <code style={{ fontWeight: "normal", fontSize: "0.9em" }}>color: <span style={{ color: "#32cd32" }}>limegreen</span></code> ahead...
 
 [<WindowsLogo /> Click here for the _full_ experience anyway.](https://y2k.pages.dev)
 

app/robots.ts

@@ -1,8 +1,6 @@
 import { BASE_URL } from "../lib/config/constants";
 import type { MetadataRoute } from "next";
 
-export const dynamic = "force-static";
-
 const robots = (): MetadataRoute.Robots => ({
   rules: [
     {

app/sitemap.ts

@@ -4,8 +4,6 @@ import { getFrontMatter } from "../lib/helpers/posts";
 import { BASE_URL } from "../lib/config/constants";
 import type { MetadataRoute } from "next";
 
-export const dynamic = "force-static";
-
 const sitemap = async (): Promise<MetadataRoute.Sitemap> => {
   // start with manual routes
   const routes: MetadataRoute.Sitemap = [

app/zip/page.tsx

@@ -32,7 +32,6 @@ const Page = () => {
           overflowX: "auto",
           padding: "1em",
           fontSize: "0.9em",
-          fontFamily: "var(--fonts-mono)",
           tabSize: 2,
           border: "1px solid var(--colors-kinda-light)",
           borderRadius: "0.6em",