perf: optimizations

src/layouts/BaseLayout.astro

@@ -54,12 +54,14 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site);
     <link rel="preconnect" href="https://fonts.bunny.net" />
     <link
       href="https://fonts.bunny.net/css?family=fira-code:400,700&display=swap"
+      as="style"
       rel="stylesheet"
     />
 
     <link rel="preconnect" href="https://cdn.jsdelivr.net" />
     <link
       rel="stylesheet"
+      as="style"
       href="https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.min.css"
     />
   </head>

src/styles/global.css

@@ -101,10 +101,11 @@ pre,
 code,
 kbd,
 samp {
-    --font-family: 'Ubuntu Mono', "Menlo", "Consolas", "Roboto Mono", "Ubuntu Monospace",
+    --font-family: 'Fira Code', 'Ubuntu Mono', "Menlo", "Consolas", "Roboto Mono", "Ubuntu Monospace",
         "Noto Mono", "Oxygen Mono", "Liberation Mono", monospace,
         "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
     --code-color: var(--text-color);
+    font-family: 'Fira Code', var(--font-family);
 }
 
 .skip-link {
@@ -116,9 +117,6 @@ samp {
     transition: transform 0.3s;
 }
 
-a:focus {
-    transform: translateY(0%);
-}
 
 .sr-only {
     position: absolute !important;
@@ -140,6 +138,14 @@ article {
     --card-background-color: var(--background-color);
 }
 
+article a,
+details a {
+    text-decoration: underline;
+}
+
+a:focus {
+    transform: translateY(0%);
+}
 
 a[role="button"],
 button {
@@ -172,20 +178,4 @@ button:active {
 
 main ul li {
     list-style: circle;
-}
-
-code {
-    font-family: 'Fira Code', monospace;
-}
-
-@supports (font-variation-settings: normal) {
-
-    code {
-        font-family: 'Fira Code VF', monospace;
-    }
-}
-
-article a,
-details a {
-    text-decoration: underline;
 }