chore: more fonts refactoring

src/pages/index.astro

@@ -141,6 +141,17 @@ const galleryCollage = await Astro.glob('@/assets/gallery/*.jpg')
                     anni passati.
                 </p>
             </ProjectCard>
+            <ProjectCard
+                title="GGWP"
+                href="https://ggwp.phc.dm.unipi.it/"
+                style="--card-bg: rgb(255, 157, 65); --masonry-height: 2;"
+                imgSrc="https://ggwp.phc.dm.unipi.it/ggwp-icon.png"
+            >
+                <p>
+                    Sito per il tabellone del GGWP, utilizzato durante la gara di Novembre 2024 dagli
+                    organizzatori per inserire le risposte alla gara in tempo reale.
+                </p>
+            </ProjectCard>
         </div>
     </section>
     <section class="wanna-be-macchinista">

src/styles/components.scss

@@ -29,7 +29,7 @@
     }
 
     .title {
-        font-family: 'Iosevka', monospace;
+        font-family: var(--font-display);
         font-weight: 700;
         font-size: 28px;
     }

src/styles/controls.scss

@@ -35,7 +35,7 @@
             text-decoration: none;
             color: #222;
 
-            font-family: 'Source Sans Pro', sans-serif;
+            font-family: var(--font-secondary);
             font-weight: 600;
 
             cursor: pointer;

src/styles/main.scss

@@ -16,6 +16,11 @@ $screen-desktop-min: 1024px;
     --homepage-macchinisti-bg: #888;
 
     --project-card-bg: #a2d4f3;
+
+    --font-primary: 'Open Sans', sans-serif;
+    --font-display: 'Iosevka', monospace;
+    --font-mono: 'Source Code Pro', monospace;
+    --font-secondary: 'Source Sans Pro', sans-serif;
 }
 
 @layer common, typography, component, page;
@@ -41,7 +46,7 @@ $screen-desktop-min: 1024px;
         min-height: 100%;
         margin: 0;
 
-        font-family: 'Open Sans', sans-serif;
+        font-family: var(--font-primary);
         font-size: 18px;
         color: #222;
     }
@@ -112,7 +117,7 @@ body {
             padding: 0 1.5rem;
 
             a {
-                font-family: 'Iosevka', monospace;
+                font-family: var(--font-display);
                 font-size: 18px;
                 font-weight: 500;
                 letter-spacing: 1px;
@@ -220,8 +225,8 @@ body {
         display: grid;
         place-content: center;
 
-        font-family: 'Source Sans Pro', sans-serif;
+        font-family: var(--font-secondary);
-        font-size: 20px;
+        font-size: 18px;
 
         scroll-snap-align: end;
 

src/styles/pages.scss

@@ -763,7 +763,7 @@
                 background: #eee;
                 color: #000;
 
-                font-family: 'Iosevka', monospace;
+                font-family: var(--font-display);
                 font-size: 14px;
 
                 border-radius: 0.25rem;
@@ -819,7 +819,7 @@
                 display: grid;
                 align-content: center;
 
-                font-family: 'JetBrains Mono', monospace;
+                font-family: 'JetBrains Mono', var(--font-mono);
                 font-size: 16px;
 
                 user-select: all;

src/styles/typography.scss

@@ -19,7 +19,7 @@
 
         h#{$i} {
             font-size: $base-font-size * $factor;
-            font-family: 'Iosevka', monospace;
+            font-family: var(--font-display);
             font-weight: 700;
             margin-bottom: 0.25rem;
         }
@@ -55,7 +55,7 @@
             // background: color-mix(in lab, var(--zone-color), #fff 75%) !important;
             // background: var(--code-bg, #00000022) !important;
 
-            font-family: 'Source Code Pro', monospace;
+            font-family: var(--font-mono);
             font-weight: 400;
             font-size: 16px;
         }