From 5fab0381b308eb5a1c837ffdd5e0ddd757e769d3 Mon Sep 17 00:00:00 2001
From: Andrew Lee <alee14498@protonmail.com>
Date: Wed, 24 Jan 2024 22:50:02 -0500
Subject: Starting to work on blog

---
 src/layouts/BlogPost.astro     | 50 ++++++++++++++++++++++++++++++++++++++++++
 src/layouts/Default.astro      | 17 ++++++++++----
 src/layouts/PageMarkdown.astro |  8 ++++---
 3 files changed, 68 insertions(+), 7 deletions(-)
 create mode 100644 src/layouts/BlogPost.astro

(limited to 'src/layouts')
diff --git a/src/layouts/BlogPost.astro b/src/layouts/BlogPost.astro
new file mode 100644
index 0000000..60baee6
--- /dev/null
+++ b/src/layouts/BlogPost.astro
@@ -0,0 +1,50 @@
+---
+import Layout from './Default.astro';
+const { title, description } = Astro.props;
+---
+
+<Layout title=`${title} - Andrew Lee` description={description}>
+    <header>
+        <h1 class="header-text">{title}</h1>
+        <h2 class="header-text">{description}</h2>
+    </header>
+    <div class="container">
+        <main>
+            <article>
+                <slot />
+            </article>
+        </main>
+    </div>
+</Layout>
+
+<style>
+    header {
+        display: flex;
+        flex-direction: column;
+        gap: 0.5em;
+        margin: 0;
+        text-align: center;
+        padding: 0 0 1em;
+    }
+
+    .header-text {
+        font-size: 2em;
+        margin: 0;
+    }
+
+    h2.header-text {
+        font-size: 1.5em;
+        font-weight: 300;
+    }
+
+    .container {
+        margin: 1em 10em 1em 10em;
+    }
+
+    @media (max-width: 992px) {
+        .container {
+            margin: 10px 20px 10px 20px;
+        }
+    }
+
+</style>
diff --git a/src/layouts/Default.astro b/src/layouts/Default.astro
index cc05e25..185a807 100644
--- a/src/layouts/Default.astro
+++ b/src/layouts/Default.astro
@@ -4,7 +4,7 @@ interface Props {
 	description: string;
 }
 
-const { title, description } = Astro.props;
+const { title = "Andrew Lee", description = "Andrew Lee Website" } = Astro.props;
 import { ViewTransitions, slide } from 'astro:transitions';
 import Navbar from '../components/Navbar.vue';
 ---
@@ -13,17 +13,25 @@ import Navbar from '../components/Navbar.vue';
 <html lang="en">
 	<head>
 		<meta charset="UTF-8" />
-		<meta name="title" content={title} />
-		<meta name="description" content={description} />
 		<meta name="viewport" content="width=device-width" />
+
+		<link rel="alternate" type="application/rss+xml" title="RSS Feed" href="/rss.xml" />
 		<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=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
 		<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+
+		<!-- Default Metadata -->
+		<meta name="title" content={title} />
+		<meta name="description" content={description} />
+
+		<!-- Open Graph Metadata -->
 		<meta property="og:title" content={title} />
 		<meta property="og:description" content={description} />
 		<meta property="og:image" content="/profile.png" />
-		<meta name="theme-color" content="#0e8106"/>
+		<meta property="og:type" content="website" />
+
+		<meta name="theme-color" content="#1B291F"/>
 		<meta name="generator" content={Astro.generator} />
 		<ViewTransitions />
 		<title>{title}</title>
@@ -33,6 +41,7 @@ import Navbar from '../components/Navbar.vue';
 	<div transition:animate={slide({ duration: '0.2s' })}>
 		<slot />
 		<footer>
+			<p>Made with {Astro.generator} and Hosted on Vercel</p>
 			<p>Copyright &copy; 2024 Andrew Lee</p>
 		</footer>
 	</div>
diff --git a/src/layouts/PageMarkdown.astro b/src/layouts/PageMarkdown.astro
index 1250dd5..f6e76ab 100644
--- a/src/layouts/PageMarkdown.astro
+++ b/src/layouts/PageMarkdown.astro
@@ -9,9 +9,11 @@ const { frontmatter } = Astro.props;
         <h2 class="header-text">{frontmatter.description}</h2>
     </header>
     <div class="container">
-        <article>
-            <slot />
-        </article>
+        <main>
+            <article>
+                <slot />
+            </article>
+        </main>
     </div>
 </Layout>
 
-- 
cgit v1.2.3

