From c3a7be91a05a211731a6c20246f4095a64100185 Mon Sep 17 00:00:00 2001
From: Ruthenic <mdrakea3@tutanota.com>
Date: Mon, 24 Oct 2022 00:46:31 -0400
Subject: [PATCH] fix blog + mobile layout issues

---
 src/components/blogList.astro | 8 ++++----
 src/css/base.scss             | 8 ++++++++
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/components/blogList.astro b/src/components/blogList.astro
index 094b64e..32af317 100644
--- a/src/components/blogList.astro
+++ b/src/components/blogList.astro
@@ -6,11 +6,11 @@ const posts = allPosts.map(item => (Object.assign({}, item.frontmatter, {url: it
 <div>
 {posts.map((post) => {
 	if (!post.wip) { return (
-	<a href={post.url} style="text-decoration: none;">
-		<p>
-			<b>{post.title}</b> - {post.pubDate}<br>
+	<a href={post.url}>
+		<div class="main-content" style="margin-bottom: 10px; font-size: 125%;">
+			<div><b>{post.title}</b> - {post.pubDate}<br></div>
 			<i>{post.description}</i>
-		</p>
+		</div>
 	</a>
 )}})}
 </div>
diff --git a/src/css/base.scss b/src/css/base.scss
index 7a442b3..7d6424c 100644
--- a/src/css/base.scss
+++ b/src/css/base.scss
@@ -3,6 +3,13 @@
   flex-direction: column;
   align-items: center;
   justify-content: center;
+  text-align: center;
+  @media (max-width: 470px) {
+    margin-bottom: 132px;
+  }
+  @media (min-width: 470px) {
+    margin-bottom: 3.4375em;
+  }
 }
 
 .blog-content {
@@ -12,6 +19,7 @@
 }
 
 .footer {
+  text-align: left; //Why does text-align being center in .main-content affect the footer at all?!
   position: fixed;
   display: flex;
   flex-grow: 1;