Switch font to Encode Sans Variable

package.json

@@ -21,6 +21,7 @@
     "dependencies": {
         "@babel/cli": "7.17.0",
         "@babel/plugin-transform-typescript": "7.16.8",
+        "@fontsource/encode-sans": "^4.5.1",
         "@fontsource/fira-code": "4.5.4",
         "@icons-pack/react-simple-icons": "4.6.1",
         "@mdx-js/mdx": "1.6.22",

src/_globals.scss

@@ -3,7 +3,7 @@
 $layoutWidth: 1100px;
 $layoutPadding: 20px;
 
-$mainFont: "Fira Code", monospace;
+$mainFont: "Encode SansVariable", sans-serif;
 
 $theme: (
     "accent": #e52b3e,

src/layouts/default.scss

@@ -1,7 +1,9 @@
-@import "~@fontsource/fira-code/index.css";
-@import "~@fontsource/fira-code/700.css";
+@use "@fontsource/encode-sans/scss/mixins" as EncodeSans;
+@import-normalize;
 @import "../globals";
 
+@include EncodeSans.fontFaceVariable($type: "wghtOnly");
+
 * {
     box-sizing: border-box;
 

src/pages/index.module.scss

@@ -104,20 +104,20 @@
         transform: translate(-50%, 0%);
 
         .hello {
-            font-weight: 100;
+            font-weight: 300;
             opacity: 0.75;
             display: block;
             margin-bottom: -5px;
         }
 
         .name {
-            font-weight: 100;
+            font-weight: 400;
             font-size: 1.8em;
             display: block;
         }
 
         .description {
-            font-weight: 100;
+            font-weight: 300;
             display: block;
         }
 

yarn.lock

@@ -1368,6 +1368,11 @@
     minimatch "^3.0.4"
     strip-json-comments "^3.1.1"
 
+"@fontsource/encode-sans@^4.5.1":
+  version "4.5.1"
+  resolved "https://registry.yarnpkg.com/@fontsource/encode-sans/-/encode-sans-4.5.1.tgz#2a2d1f1fb9578275ce11061fdd7057cc1cdaa880"
+  integrity sha512-ulqUy8uUbMPyasJH3KK4uSICvumQGmuXX5rJGMEwA6beeteXrSRoUCBFjd3ZwpxfKANl2q0QIduhzG3OjbQDwA==
+
 "@fontsource/fira-code@4.5.4":
   version "4.5.4"
   resolved "https://registry.yarnpkg.com/@fontsource/fira-code/-/fira-code-4.5.4.tgz#a8ec2347cf7261b2bf14065e66c734dde7145432"