feat: add self-hosted Alegreya, Plantin, and Redaction font families and move Google Fonts links

app/assets/css/fonts.css

@@ -0,0 +1,239 @@
+@font-face {
+    font-family: 'SohneBuch';
+    src:
+        url('~/assets/fonts/Sohne/Sohne-Buch.woff') format('woff'),
+        url('~/assets/fonts/Sohne/Sohne-Buch.ttf') format('truetype');
+    font-display: swap;
+}
+
+/* Plantin MT Pro */
+@font-face {
+    font-family: 'Plantin MT Pro';
+    src: url('~/assets/fonts/Plantin MT Pro/PlantinMTProRg.TTF')
+        format('truetype');
+    font-weight: 400;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Plantin MT Pro';
+    src: url('~/assets/fonts/Plantin MT Pro/PlantinMTProRgIt.TTF')
+        format('truetype');
+    font-weight: 400;
+    font-style: italic;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Plantin MT Pro';
+    src: url('~/assets/fonts/Plantin MT Pro/PlantinMTProBold.TTF')
+        format('truetype');
+    font-weight: 700;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Plantin MT Pro';
+    src: url('~/assets/fonts/Plantin MT Pro/PlantinMTProBoldIt.TTF')
+        format('truetype');
+    font-weight: 700;
+    font-style: italic;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Plantin MT Pro';
+    src: url('~/assets/fonts/Plantin MT Pro/PlantinMTProLight.TTF')
+        format('truetype');
+    font-weight: 300;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Plantin MT Pro';
+    src: url('~/assets/fonts/Plantin MT Pro/PlantinMTProLightIt.TTF')
+        format('truetype');
+    font-weight: 300;
+    font-style: italic;
+    font-display: swap;
+}
+
+/* Redaction */
+@font-face {
+    font-family: 'Redaction';
+    src: url('~/assets/fonts/Redaction/Redaction-Regular.woff2') format('woff2');
+    font-weight: 400;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction';
+    src: url('~/assets/fonts/Redaction/Redaction-Bold.woff2') format('woff2');
+    font-weight: 700;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction';
+    src: url('~/assets/fonts/Redaction/Redaction-Italic.woff2') format('woff2');
+    font-weight: 400;
+    font-style: italic;
+    font-display: swap;
+}
+
+/* Redaction 10 */
+@font-face {
+    font-family: 'Redaction 10';
+    src: url('~/assets/fonts/Redaction/Redaction_10-Regular.woff2')
+        format('woff2');
+    font-weight: 400;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction 10';
+    src: url('~/assets/fonts/Redaction/Redaction_10-Bold.woff2') format('woff2');
+    font-weight: 700;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction 10';
+    src: url('~/assets/fonts/Redaction/Redaction_10-Italic.woff2')
+        format('woff2');
+    font-weight: 400;
+    font-style: italic;
+    font-display: swap;
+}
+
+/* Redaction 20 */
+@font-face {
+    font-family: 'Redaction 20';
+    src: url('~/assets/fonts/Redaction/Redaction_20-Regular.woff2')
+        format('woff2');
+    font-weight: 400;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction 20';
+    src: url('~/assets/fonts/Redaction/Redaction_20-Bold.woff2') format('woff2');
+    font-weight: 700;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction 20';
+    src: url('~/assets/fonts/Redaction/Redaction_20-Italic.woff2')
+        format('woff2');
+    font-weight: 400;
+    font-style: italic;
+    font-display: swap;
+}
+
+/* Redaction 35 */
+@font-face {
+    font-family: 'Redaction 35';
+    src: url('~/assets/fonts/Redaction/Redaction_35-Regular.woff2')
+        format('woff2');
+    font-weight: 400;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction 35';
+    src: url('~/assets/fonts/Redaction/Redaction_35-Bold.woff2') format('woff2');
+    font-weight: 700;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction 35';
+    src: url('~/assets/fonts/Redaction/Redaction_35-Italic.woff2')
+        format('woff2');
+    font-weight: 400;
+    font-style: italic;
+    font-display: swap;
+}
+
+/* Redaction 50 */
+@font-face {
+    font-family: 'Redaction 50';
+    src: url('~/assets/fonts/Redaction/Redaction_50-Regular.woff2')
+        format('woff2');
+    font-weight: 400;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction 50';
+    src: url('~/assets/fonts/Redaction/Redaction_50-Bold.woff2') format('woff2');
+    font-weight: 700;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction 50';
+    src: url('~/assets/fonts/Redaction/Redaction_50-Italic.woff2')
+        format('woff2');
+    font-weight: 400;
+    font-style: italic;
+    font-display: swap;
+}
+
+/* Redaction 70 */
+@font-face {
+    font-family: 'Redaction 70';
+    src: url('~/assets/fonts/Redaction/Redaction_70-Regular.woff2')
+        format('woff2');
+    font-weight: 400;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction 70';
+    src: url('~/assets/fonts/Redaction/Redaction_70-Bold.woff2') format('woff2');
+    font-weight: 700;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction 70';
+    src: url('~/assets/fonts/Redaction/Redaction_70-Italic.woff2')
+        format('woff2');
+    font-weight: 400;
+    font-style: italic;
+    font-display: swap;
+}
+
+/* Redaction 100 */
+@font-face {
+    font-family: 'Redaction 100';
+    src: url('~/assets/fonts/Redaction/Redaction_100-Regular.woff2')
+        format('woff2');
+    font-weight: 400;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction 100';
+    src: url('~/assets/fonts/Redaction/Redaction_100-Bold.woff2')
+        format('woff2');
+    font-weight: 700;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Redaction 100';
+    src: url('~/assets/fonts/Redaction/Redaction_100-Italic.woff2')
+        format('woff2');
+    font-weight: 400;
+    font-style: italic;
+    font-display: swap;
+}
+
+@import url('https://fonts.googleapis.com/css2?family=Young+Serif&display=swap');
+

app/assets/css/main.css

@@ -1,15 +1,14 @@
-
-@font-face {
-    font-family: 'SohneBuch';
-    src:
-        url('~/assets/fonts/Sohne/Sohne-Buch.woff') format('woff'),
-        url('~/assets/fonts/Sohne/Sohne-Buch.ttf') format('truetype');
-}
+@import './fonts.css';
 
 :root {
     /* --font: 'Baskervville', serif; */
-    --font: 'EB Garamond', serif;
+    /* --font: 'EB Garamond', serif; */
+    /* --font: 'Plantin MT Pro', serif; */
+    --font: 'Redaction', serif;
+    /* --font: 'Young Serif', serif; */
     /* --font: "SohneBuch", sans-serif; */
+    --font-hover: 'Redaction 70', serif;
+    /* --font-hover: var(--font); */
     --text: #333;
     --muted: #666;
     --bg: #fbfbf7;
@@ -73,7 +72,6 @@ body {
     mix-blend-mode: screen;
 }
 
-
 .punch-link:hover {
     background-size: 100% 100%;
     background-image: linear-gradient(#fff, #fff);
@@ -96,4 +94,4 @@ body {
 
 .back-link:hover .arrow {
     transform: translateX(-4px);
-}
+}