add epilogue

Author: thilobillerbeck

core/src/components/Footer.astro

@@ -12,9 +12,7 @@ import logoWHite from '@NixOS/branding/artifacts/internal/nixos-logomark-white-f
 ---
 
 <footer>
-  <div
-    class="bg-secondary-afghani-blue-25 text-primary-white-95 clear-both font-light"
-  >
+  <div class="bg-secondary-afghani-blue-25 text-primary-white-95 clear-both">
     <Container>
       <div
         class="flex flex-col flex-wrap gap-x-4 gap-y-8 pt-12 pb-10 sm:flex-row"
@@ -25,7 +23,7 @@ import logoWHite from '@NixOS/branding/artifacts/internal/nixos-logomark-white-f
               <h4 class="font-heading text-secondary-afghani-blue-85 mb-2 text-xl font-bold">
                 {menu.name}
               </h4>
-              <ul class="font-extralight">
+              <ul class="font-light">
                 {menu.items.map((item) => (
                   <li class="border-secondary-afghani-blue-55 border-b-1 last:border-b-0">
                     <Link

core/src/components/Header.astro

@@ -20,7 +20,7 @@ const navbarItemActiveStyle = `border-b-secondary-afghani-blue-85 bg-secondary-a
 
 <header
   role="banner"
-  class="text-primary-black bg-primary-white sticky top-0 z-50 font-extralight drop-shadow-md"
+  class="text-primary-black bg-primary-white sticky top-0 z-50 font-light drop-shadow-md"
 >
   {
     currentBanner && (

core/src/layouts/Layout.astro

@@ -86,13 +86,13 @@ const headFeedLinks = blogMenu.data.map((e) => {
       // Fonts
       import '@fontsource-variable/overpass';
       import '@fontsource-variable/fira-code';
-      import '@fontsource-variable/roboto-flex/wdth.css';
+      import '@fontsource-variable/epilogue';
       import '@/lib/client/scrollToTopHandler.js';
     </script>
 
     <style>
       @font-face {
-        font-family: 'Roboto Flex Variable';
+        font-family: 'Epilogue Variable';
       }
     </style>
   </body>

core/src/pages/index.astro

@@ -150,7 +150,7 @@ posts
           Choose from over 120 000 Packages
         </h2>
         <p
-          class="pb-2 text-center text-2xl leading-relaxed font-extralight md:w-5/6"
+          class="pb-2 text-center text-2xl leading-relaxed font-light md:w-5/6"
         >
           The Nix Packages collection (<a
             class="text-secondary-afghani-blue! font-bold"

core/src/styles/base.css

@@ -5,7 +5,7 @@
 @config '../../tailwind.config.cjs';
 
 @utility text-light-bold {
-  @apply font-extralight;
+  @apply font-light;
 
   & strong {
     @apply font-extrabold;
@@ -62,7 +62,7 @@
   }
 
   article {
-    @apply leading-7 font-light;
+    @apply leading-7;
   }
 
   article ol {

core/tailwind.config.cjs

@@ -53,7 +53,7 @@ module.exports = {
   ],
   theme: {
     fontFamily: {
-      sans: ['Roboto Flex Variable', ...defaultTheme.fontFamily.sans],
+      sans: ['Epilogue Variable', ...defaultTheme.fontFamily.sans],
       serif: ['Route159', ...defaultTheme.fontFamily.serif],
       heading: ['Route159', ...defaultTheme.fontFamily.sans],
       mono: ['Fira Code Variable', ...defaultTheme.fontFamily.mono],

package-lock.json

@@ -39,6 +39,7 @@
     "typescript-eslint": "^8.46.3"
   },
   "dependencies": {
+    "@fontsource-variable/epilogue": "^5.2.8",
     "chalk": "^5.6.2"
   }
 }