Change blog list style

kubgus · Aug 14, 2024 · 143079f · 143079f
1 parent 358d93b
commit 143079f
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/src/components/blog-preview.astro b/src/components/blog-preview.astro
@@ -4,7 +4,7 @@ const { post } = Astro.props;
 const dateString = new Date(post.frontmatter.date).toLocaleString("en-US", { month: "long", day: "numeric", year: "numeric" });
 ---
 
-<figure class="container">
+<figure>
     <a href={post.url}>
         <h1>{post.frontmatter.title}</h1>
         <div class="info">
@@ -20,8 +20,12 @@ const dateString = new Date(post.frontmatter.date).toLocaleString("en-US", { mon
         display: flex;
         flex-direction: column;
         gap: 0.5rem;
-        padding: 1rem;
-        border-width: 2px;
+        padding: 1rem 0.5rem;
+        border-top: 1px solid var(--secondary-background-dark);
+    }
+
+    figure:last-child {
+        border-bottom: 1px solid var(--secondary-background-dark);
     }
 
     a {

diff --git a/src/components/content/blog.astro b/src/components/content/blog.astro
@@ -14,3 +14,9 @@ posts.sort((a, b) => new Date(b.frontmatter.date).valueOf() - new Date(a.frontma
         ))
     }
 </div>
+
+<style>
+    h1 {
+        margin-bottom: 1rem;
+    }
+</style>
-Original file line number
+Diff line change
@@ Expand Up @@
             ))
         }
     </div>
+    <style>
+        h1 {
+            margin-bottom: 1rem;
+        }
+    </style>