Update webfont & header

colepeters · Nov 23, 2023 · 3dc2262 · 3dc2262
1 parent f649d86
commit 3dc2262
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 10 deletions.
diff --git a/app/elements/site-header.mjs b/app/elements/site-header.mjs
@@ -16,6 +16,12 @@ export default function SiteHeader ({ html }) {
         inset-inline-start: -1.75em;
       }
 
+      @media (prefers-color-scheme: dark) {
+        h1:after {
+          filter: invert();
+        }
+      }
+
     </style>
     <header>
       <a href='/' class='no-underline'>

diff --git a/app/head.mjs b/app/head.mjs
@@ -35,15 +35,15 @@ export default function Head(state) {
         <link href='https://instagram.com/titledspheres' rel='me' />
         <style>
           @font-face {
-            font-family: EB Garamond;
-            src: url('/_public/fonts/EBGaramond12-Regular.woff2') format('woff2');
-            font-weight: 400;
+            font-family: Newsreader;
+            src: url('/_public/fonts/newsreader.woff2') format('woff2');
+            font-weight: 100 900;
           }
           
           @font-face {
-            font-family: EB Garamond;
-            src: url('/_public/fonts/EBGaramond12-Italic.woff2') format('woff2');
-            font-weight: 400;
+            font-family: Newsreader;
+            src: url('/_public/fonts/newsreader-italic.woff2') format('woff2');
+            font-weight: 100 900;
             font-style: italic;
           }
         </style>

diff --git a/public/fonts/newsreader-italic.woff2 b/public/fonts/newsreader-italic.woff2
diff --git a/public/fonts/newsreader.woff2 b/public/fonts/newsreader.woff2
diff --git a/theme.json b/theme.json
@@ -1,8 +1,8 @@
 {
   "typeScale": {
     "steps": 8,
-    "baseMin": 18,
-    "baseMax": 24,
+    "baseMin": 20,
+    "baseMax": 28,
     "viewportMin": 320,
     "viewportMax": 1500,
     "scaleMin": 1.2,
@@ -21,8 +21,8 @@
     "align-heading": "start",
     "color-dark": "hsl(200deg 5% 15%)",
     "color-light": "hsl(24deg 10% 97.5%)",
-    "font-body": "EB Garamond, Georgia, Times New Roman, serif",
-    "font-heading": "EB Garamond, Georgia, Times New Roman, serif"
+    "font-body": "Newsreader, Georgia, Times New Roman, serif",
+    "font-heading": "Newsreader, Georgia, Times New Roman, serif"
   },
   "queries": {
     "lg": "48em"