From 0d5378969fd95cff1645c431ea2312218443bdb4 Mon Sep 17 00:00:00 2001
From: Sat Naing <satnaingdev@gmail.com>
Date: Thu, 8 Sep 2022 22:51:27 +0630
Subject: [PATCH] Add IBM Plex Mono font

---
 src/layouts/Layout.astro | 45 +++++++---------------------------------
 tailwind.config.cjs      |  3 +++
 2 files changed, 11 insertions(+), 37 deletions(-)
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 70729ed..f20f8dd 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -27,45 +27,16 @@ const { title } = Astro.props;
     <meta property="og:site_name" content="og_site_name" />
     <meta name="twitter:card" content="summary_large_image" />
     <meta name="twitter:image:alt" content="twitter_image_description" />
+
+    <!-- Google Font -->
+    <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=IBM+Plex+Mono:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap"
+      rel="stylesheet"
+    />
   </head>
   <body>
     <slot />
-    <style>
-      :root {
-        --font-size-base: clamp(1rem, 0.34vw + 0.91rem, 1.19rem);
-        --font-size-lg: clamp(1.2rem, 0.7vw + 1.2rem, 1.5rem);
-        --font-size-xl: clamp(2.44rem, 2.38vw + 1.85rem, 3.75rem);
-
-        --color-text: hsl(12, 5%, 4%);
-        --color-bg: hsl(10, 21%, 95%);
-        --color-border: hsl(17, 24%, 90%);
-      }
-
-      html {
-        font-family: system-ui, sans-serif;
-        font-size: var(--font-size-base);
-        color: var(--color-text);
-        background-color: var(--color-bg);
-      }
-
-      body {
-        margin: 0;
-      }
-    </style>
-
-    <style is:global>
-      h1 {
-        font-size: var(--font-size-xl);
-      }
-
-      h2 {
-        font-size: var(--font-size-lg);
-      }
-
-      code {
-        font-family: Menlo, Monaco, Lucida Console, Liberation Mono,
-          DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
-      }
-    </style>
   </body>
 </html>
diff --git a/tailwind.config.cjs b/tailwind.config.cjs
index 9167ef2..1daca44 100644
--- a/tailwind.config.cjs
+++ b/tailwind.config.cjs
@@ -25,6 +25,9 @@ module.exports = {
           card: withOpacity("--color-card"),
         },
       },
+      fontFamily: {
+        mono: ["IBM Plex Mono", "monospace"],
+      },
     },
   },
   plugins: [],
