change font to Spectral

Author: robsonperassoli

priv/layout.html.eex

@@ -12,7 +12,7 @@
 
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link href="https://fonts.googleapis.com/css2?family=Libertinus+Serif+Display&family=Mona+Sans:ital,wght@0,200..900;1,200..900&display=swap" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap" rel="stylesheet">
 
     <link href="/public/styles.css" rel="stylesheet">
 </head>
@@ -36,8 +36,10 @@
 
   </header>
 
-  <article class="markdown-body">
-    <%= article.html %>
-  </article>
+  <main>
+    <article class="markdown-body">
+        <%= article.html %>
+    </article>
+  </main>
 </body>
 </html>

priv/static/layout.css

@@ -50,6 +50,10 @@
         0 4px 6px -1px rgb(0 0 0 / 0.3), 0 2px 4px -2px rgb(0 0 0 / 0.3);
 }
 
+html {
+    font-family: "Spectral", "Times New Roman", serif;
+}
+
 body {
     background-color: var(--bg-primary);
     color: var(--text-primary);
@@ -61,7 +65,7 @@ body {
     flex-direction: column;
     max-width: 800px;
     margin: 0 auto;
-    padding: 0 1.5rem;
+    padding: 0 1.5rem 2rem 1.5rem;
 }
 
 .masthead {
@@ -81,7 +85,6 @@ body {
 }
 
 .header-nav a {
-    font-family: "Libertinus Serif Display", "Times New Roman", serif;
     font-size: 0.8rem;
     font-weight: 400;
     color: var(--text-secondary);
@@ -106,7 +109,6 @@ body {
 }
 
 .nameplate h1 {
-    font-family: "Libertinus Serif Display", "Times New Roman", serif;
     font-size: 3.5rem;
     font-weight: 400;
     color: var(--text-primary);
@@ -126,7 +128,6 @@ body {
 }
 
 .nameplate h2 {
-    font-family: "Libertinus Serif Display", "Times New Roman", serif;
     font-size: 0.9rem;
     font-weight: 400;
     color: var(--text-secondary);