miglioramenti stilistici

src/styles/typography.scss

@@ -12,20 +12,20 @@
 
 @mixin geometric-headings {
     $base-font-size: 16px;
-    $heading-scale: 1.33;
+    $heading-scale: 1.25;
 
     @for $i from 1 through 5 {
         $factor: pow($heading-scale, 5 - $i);
 
         h#{$i} {
             font-size: $base-font-size * $factor;
-            font-family: 'Source Sans Pro', monospace;
-            font-weight: 400;
+            font-family: 'Space Mono', monospace;
+            font-weight: 700;
             margin-bottom: 0.25rem;
         }
 
         p + h#{$i} {
-            margin-top: 0.5rem * $factor;
+            margin-top: 0.75rem * $factor;
         }
     }
 }
@@ -52,18 +52,21 @@
     }
 
     pre {
-        margin: 1rem auto;
+        margin: 2rem auto;
 
-        padding: 0.5rem;
+        padding: 0.5rem 1rem;
 
-        width: 100%;
+        // width: 100%;
         max-width: 80ch;
 
+        width: fit-content;
+
         line-height: 1.5;
 
-        border-radius: 0.5rem;
+        border-radius: 0.25rem;
 
-        box-shadow: 0.25rem 0.25rem 0 0 #777;
+        box-shadow: 0.25rem 0.25rem 0 0 #333;
+        border: 2px solid #333;
 
         code {
             padding: 0;
@@ -71,7 +74,7 @@
     }
 
     p {
-        line-height: 1.65;
+        line-height: 1.75;
         margin: 0.5rem auto;
     }
 
@@ -82,6 +85,34 @@
         text-align: center;
     }
 
+    h1,
+    h2,
+    h3,
+    h4 {
+        font-weight: 700;
+        color: #333;
+    }
+
+    h1,
+    h2,
+    h3,
+    h4,
+    ol,
+    ul {
+        margin-left: auto;
+        margin-right: auto;
+    }
+
+    a,
+    a:visited {
+        color: var(--zone-color, #1e6733);
+        font-weight: 600;
+
+        &:hover {
+            text-decoration: underline 2px solid;
+        }
+    }
+
     padding: 2rem 0 3rem;
 
     @media screen and (max-width: 1024px) {