2 files changed, 30 insertions, 91 deletions
diff --git a/src/layouts/Blog.astro b/src/layouts/Blog.astro
new file mode 100644
index 0000000..0300b59
--- /dev/null
+++ b/src/layouts/Blog.astro
@@ -0,0 +1,28 @@
+---
+import Markdown from "../components/Markdown.astro";
+
+interface Props {
+    title: string;
+}
+
+const { title } = Astro.props;
+---
+
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <meta name="description" content="Astro description" />
+        <meta name="viewport" content="width=device-width" />
+        <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+        <meta name="generator" content={Astro.generator} />
+        <title>{title}</title>
+    </head>
+    <body>
+        <main class="w-[70%] m-auto">
+            <Markdown>
+                <slot />
+            </Markdown>
+        </main>
+    </body>
+</html>
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 17d0a70..d8e68d1 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -1,4 +1,6 @@
 ---
+import "../styles/terminal.css";
+
 interface Props {
     title: string;
 }
@@ -20,94 +22,3 @@ const { title } = Astro.props;
         <slot />
     </body>
 </html>
-
-<style is:global>
-    @import url("../styles/JetBrainsMono.css");
-
-    /* :root { */
-    /*     --primary: #ffbf00; */
-    /*     --secondary: #9b7eca; */
-    /*     --accent: #7ed4fb; */
-    /*     --extra: #8fcc75; */
-    /*     --text: #ffffff; */
-    /*     --alt: #999999; */
-    /*     --background: #000000; */
-    /* } */
-
-    :root {
-        --primary: #54D7A9;
-        --secondary: #9b7eca;
-        --accent: #7ed4fb;
-        --extra: #8fcc75;
-        --text: #ffffff;
-        --alt: #999999;
-        --background: #000000;
-    }
-
-    * {
-        margin: 0;
-        padding: 0;
-    }
-
-    html {
-        background-color: var(--background);
-        color: var(--text);
-        font-family: "Jetbrains Mono", monospace;
-        user-select: none;
-    }
-
-    body {
-        overflow-y: scroll;
-        zoom: 1;
-    }
-    @media screen and (max-width: 768px) {
-        body {
-            zoom: 0.8;
-        }
-    }
-    @media screen and (max-width: 480px) {
-        body {
-            zoom: 0.7;
-        }
-    }
-
-    main {
-        display: grid;
-        position: absolute;
-        top: 50%;
-        left: 50%;
-        grid-template-columns: minmax(200px, 1fr);
-        transform: translate(-50%, -50%);
-        border: 1px;
-        border-style: solid;
-        background: var(--background);
-        padding: 1.75rem;
-        width: 55rem;
-        max-width: 75%;
-        padding-top: 1.25rem;
-    }
-
-    h1,
-    h2,
-    h3 {
-        font-size: 1rem;
-        font-weight: bold;
-    }
-
-    a {
-        font-weight: 300;
-    }
-    a:link,
-    a:visited,
-    a:active {
-        background-color: transparent;
-        text-decoration: none;
-        color: var(--secondary);
-    }
-    a:hover {
-        transition-duration: 0.2s;
-        transition-property: color, text-decoration;
-        text-decoration: underline;
-        color: var(--accent);
-    }
-</style>