feat(fonts): add Google Fonts Roboto

Author: hHolyMolly

src/html/layouts/_head.html

@@ -18,6 +18,13 @@
 
 <link rel="icon" href="./assets/favicon.ico" />
 
+<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=Roboto:ital,wght@0,100..900;1,100..900&display=swap"
+  rel="stylesheet"
+/>
+
 <link rel="stylesheet" href="./styles/normalize.css" />
 <link rel="stylesheet" href="./styles/vars.css" />
 <link rel="stylesheet" href="./styles/fonts.css" />

src/styles/vars.scss

@@ -4,7 +4,7 @@
   --black: #222;
 
   /* Typography */
-  --font-family: -apple-system, blinkmacsystemfont, 'Segoe UI', roboto, 'Helvetica Neue', arial, sans-serif;
+  --font-family: 'Roboto', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Helvetica Neue', arial, sans-serif;
 
   /* Layout */
   --container-width: 1230px;