Add custom fonts

public/fonts/styrene/Befonts-License.txt

@@ -0,0 +1,2 @@
+License:  Free for Personal Use
+Link: https://befonts.com/styrene-font-family.html

public/fonts/tiempos/Befonts-License.txt

@@ -0,0 +1,2 @@
+License:  Free for Personal Use
+Link: https://befonts.com/tiempos-font-family.html

src/content/blog/nixos-with-ext4-and-luks/index.md

@@ -131,6 +131,6 @@ reboot
 
 ## Change of encryption password
 
-To make this step as easy as possible, I recommend using [GNOME Disks](https://apps.gnome.org/DiskUtility).
+To make this step as easy as possible, I `console.log("hello world")` recommend using [GNOME Disks](https://apps.gnome.org/DiskUtility).
 
 ![Linux disk management window showing a 2TB Samsung SSD with partition details and management options](./change-of-encryption-password.png)

src/styles/global.css

@@ -1,10 +1,535 @@
 @import "tailwindcss";
-@import "@fontsource-variable/roboto";
-
 @plugin "@tailwindcss/typography";
-
 @custom-variant dark (&:where(.dark, .dark *));
 
-@theme {
-  --font-sans: "Roboto Variable", "sans-serif";
+@layer base {
+  body {
+    font-family: "Tiempos Text", serif;
+  }
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    font-family: "Styrene A", sans-serif;
+  }
+
+  code,
+  kbd,
+  samp,
+  pre,
+  pre code {
+    font-family: "Styrene B", monospace;
+  }
+}
+
+/* Styrene A Font Family */
+@font-face {
+  font-family: "Styrene A";
+  src: url("/fonts/styrene/StyreneA-Thin-Trial-BF63f6cbd91263f.otf")
+    format("opentype");
+  font-weight: 100;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene A";
+  src: url("/fonts/styrene/StyreneA-ThinItalic-Trial-BF63f6cbd95634b.otf")
+    format("opentype");
+  font-weight: 100;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene A";
+  src: url("/fonts/styrene/StyreneA-Light-Trial-BF63f6cbd99dc3e.otf")
+    format("opentype");
+  font-weight: 300;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene A";
+  src: url("/fonts/styrene/StyreneA-LightItalic-Trial-BF63f6cbd9cb933.otf")
+    format("opentype");
+  font-weight: 300;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene A";
+  src: url("/fonts/styrene/StyreneA-Regular-Trial-BF63f6cbd970ee9.otf")
+    format("opentype");
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene A";
+  src: url("/fonts/styrene/StyreneA-RegularItalic-Trial-BF63f6cbd94325f.otf")
+    format("opentype");
+  font-weight: 400;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene A";
+  src: url("/fonts/styrene/StyreneA-Medium-Trial-BF63f6cdb24b6d.otf")
+    format("opentype");
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene A";
+  src: url("/fonts/styrene/StyreneA-MediumItalic-Trial-BF63f6cbd925a68.otf")
+    format("opentype");
+  font-weight: 500;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene A";
+  src: url("/fonts/styrene/StyreneA-Bold-Trial-BF63f6cbda1877f.otf")
+    format("opentype");
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene A";
+  src: url("/fonts/styrene/StyreneA-BoldItalic-Trial-BF63f6cbd9bec08.otf")
+    format("opentype");
+  font-weight: 700;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene A";
+  src: url("/fonts/styrene/StyreneA-Black-Trial-BF63f6cbd9da245.otf")
+    format("opentype");
+  font-weight: 900;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene A";
+  src: url("/fonts/styrene/StyreneA-BlackItalic-Trial-BF63f6cbd7cb688.otf")
+    format("opentype");
+  font-weight: 900;
+  font-style: italic;
+  font-display: swap;
+}
+
+/* Styrene B Font Family */
+@font-face {
+  font-family: "Styrene B";
+  src: url("/fonts/styrene/StyreneB-Thin-Trial-BF63f6cc84a4246.otf")
+    format("opentype");
+  font-weight: 100;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene B";
+  src: url("/fonts/styrene/StyreneB-ThinItalic-Trial-BF63f6cbe8d3333.otf")
+    format("opentype");
+  font-weight: 100;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene B";
+  src: url("/fonts/styrene/StyreneB-Light-Trial-BF63f6cbe64b47b.otf")
+    format("opentype");
+  font-weight: 300;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene B";
+  src: url("/fonts/styrene/StyreneB-LightItalic-Trial-BF63f6cbe9d67d1.otf")
+    format("opentype");
+  font-weight: 300;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene B";
+  src: url("/fonts/styrene/StyreneB-Regular-Trial-BF63f6cbe9db1d5.otf")
+    format("opentype");
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene B";
+  src: url("/fonts/styrene/StyreneB-RegularItalic-Trial-BF63f6cbe5c1942.otf")
+    format("opentype");
+  font-weight: 400;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene B";
+  src: url("/fonts/styrene/StyreneB-Medium-Trial-BF63f6cc85760c2.otf")
+    format("opentype");
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene B";
+  src: url("/fonts/styrene/StyreneB-MediumItalic-Trial-BF63f6cc84a421a.otf")
+    format("opentype");
+  font-weight: 500;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene B";
+  src: url("/fonts/styrene/StyreneB-Bold-Trial-BF63f6cbe9f13bb.otf")
+    format("opentype");
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene B";
+  src: url("/fonts/styrene/StyreneB-BoldItalic-Trial-BF63f6cbe6863e6.otf")
+    format("opentype");
+  font-weight: 700;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene B";
+  src: url("/fonts/styrene/StyreneB-Black-Trial-BF63f6cbe3dc69b.otf")
+    format("opentype");
+  font-weight: 900;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Styrene B";
+  src: url("/fonts/styrene/StyreneB-BlackItalic-Trial-BF63f6cbe2d985b.otf")
+    format("opentype");
+  font-weight: 900;
+  font-style: italic;
+  font-display: swap;
+}
+
+/* Tiempos Fine Font Family */
+@font-face {
+  font-family: "Tiempos Fine";
+  src: url("/fonts/tiempos/TestTiemposFine-Light-BF66457a5102792.otf")
+    format("opentype");
+  font-weight: 300;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Fine";
+  src: url("/fonts/tiempos/TestTiemposFine-LightItalic-BF66457a50eb132.otf")
+    format("opentype");
+  font-weight: 300;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Fine";
+  src: url("/fonts/tiempos/TestTiemposFine-Regular-BF66457a50e8bc9.otf")
+    format("opentype");
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Fine";
+  src: url("/fonts/tiempos/TestTiemposFine-RegularItalic-BF66457a50e36f9.otf")
+    format("opentype");
+  font-weight: 400;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Fine";
+  src: url("/fonts/tiempos/TestTiemposFine-Medium-BF66457a50e62cd.otf")
+    format("opentype");
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Fine";
+  src: url("/fonts/tiempos/TestTiemposFine-MediumItalic-BF66457a511be83.otf")
+    format("opentype");
+  font-weight: 500;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Fine";
+  src: url("/fonts/tiempos/TestTiemposFine-Semibold-BF66457a50f016a.otf")
+    format("opentype");
+  font-weight: 600;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Fine";
+  src: url("/fonts/tiempos/TestTiemposFine-SemiboldItalic-BF66457a50b0e18.otf")
+    format("opentype");
+  font-weight: 600;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Fine";
+  src: url("/fonts/tiempos/TestTiemposFine-Bold-BF66457a510211b.otf")
+    format("opentype");
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Fine";
+  src: url("/fonts/tiempos/TestTiemposFine-BoldItalic-BF66457a50b8568.otf")
+    format("opentype");
+  font-weight: 700;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Fine";
+  src: url("/fonts/tiempos/TestTiemposFine-Black-BF66457a508fe8f.otf")
+    format("opentype");
+  font-weight: 900;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Fine";
+  src: url("/fonts/tiempos/TestTiemposFine-BlackItalic-BF66457a510424a.otf")
+    format("opentype");
+  font-weight: 900;
+  font-style: italic;
+  font-display: swap;
+}
+
+/* Tiempos Headline Font Family */
+@font-face {
+  font-family: "Tiempos Headline";
+  src: url("/fonts/tiempos/TestTiemposHeadline-Light-BF66457a50df5a0.otf")
+    format("opentype");
+  font-weight: 300;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Headline";
+  src: url("/fonts/tiempos/TestTiemposHeadline-LightItalic-BF66457a5088153.otf")
+    format("opentype");
+  font-weight: 300;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Headline";
+  src: url("/fonts/tiempos/TestTiemposHeadline-Regular-BF66457a508e31a.otf")
+    format("opentype");
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Headline";
+  src: url("/fonts/tiempos/TestTiemposHeadline-RegularItalic-BF66457a5091d70.otf")
+    format("opentype");
+  font-weight: 400;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Headline";
+  src: url("/fonts/tiempos/TestTiemposHeadline-Medium-BF66457a509b4ec.otf")
+    format("opentype");
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Headline";
+  src: url("/fonts/tiempos/TestTiemposHeadline-MediumItalic-BF66457a50b4260.otf")
+    format("opentype");
+  font-weight: 500;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Headline";
+  src: url("/fonts/tiempos/TestTiemposHeadline-Semibold-BF66457a509040b.otf")
+    format("opentype");
+  font-weight: 600;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Headline";
+  src: url("/fonts/tiempos/TestTiemposHeadline-SemiboldItalic-BF66457a510c462.otf")
+    format("opentype");
+  font-weight: 600;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Headline";
+  src: url("/fonts/tiempos/TestTiemposHeadline-Bold-BF66457a5113d17.otf")
+    format("opentype");
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Headline";
+  src: url("/fonts/tiempos/TestTiemposHeadline-BoldItalic-BF66457a5072af7.otf")
+    format("opentype");
+  font-weight: 700;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Headline";
+  src: url("/fonts/tiempos/TestTiemposHeadline-Black-BF66457a50e385b.otf")
+    format("opentype");
+  font-weight: 900;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Headline";
+  src: url("/fonts/tiempos/TestTiemposHeadline-BlackItalic-BF66457a505495d.otf")
+    format("opentype");
+  font-weight: 900;
+  font-style: italic;
+  font-display: swap;
+}
+
+/* Tiempos Text Font Family */
+@font-face {
+  font-family: "Tiempos Text";
+  src: url("/fonts/tiempos/TestTiemposText-Regular-BF66457a50cd521.otf")
+    format("opentype");
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Text";
+  src: url("/fonts/tiempos/TestTiemposText-RegularItalic-BF66457a50421c2.otf")
+    format("opentype");
+  font-weight: 400;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Text";
+  src: url("/fonts/tiempos/TestTiemposText-Medium-BF66457a508489a.otf")
+    format("opentype");
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Text";
+  src: url("/fonts/tiempos/TestTiemposText-MediumItalic-BF66457a508d6d9.otf")
+    format("opentype");
+  font-weight: 500;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Text";
+  src: url("/fonts/tiempos/TestTiemposText-Semibold-BF66457a4fed201.otf")
+    format("opentype");
+  font-weight: 600;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Text";
+  src: url("/fonts/tiempos/TestTiemposText-SemiboldItalic-BF66457a505477c.otf")
+    format("opentype");
+  font-weight: 600;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Text";
+  src: url("/fonts/tiempos/TestTiemposText-Bold-BF66457a4f03c40.otf")
+    format("opentype");
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Tiempos Text";
+  src: url("/fonts/tiempos/TestTiemposText-BoldItalic-BF66457a50155b4.otf")
+    format("opentype");
+  font-weight: 700;
+  font-style: italic;
+  font-display: swap;
 }