From 0e48c6baf7a94ab083b05fc639d9679b7e85f9b2 Mon Sep 17 00:00:00 2001
From: z0x <homelab@home.arpa>
Date: Fri, 23 May 2025 20:18:16 -0400
Subject: [PATCH] feat: improve header

---
 src/components/Header.astro      | 2 +-
 src/components/ThemeToggle.astro | 2 +-
 src/pages/blog/[...id].astro     | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/Header.astro b/src/components/Header.astro
index 81d1f17..b12c6cd 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -10,7 +10,7 @@ import { SITE } from "@/consts";
   transition:persist
 >
   <Container>
-    <div class="flex flex-wrap items-center justify-between gap-4 py-4">
+    <div class="flex flex-wrap items-center justify-between gap-4 border-b px-4 py-3 sm:border-none">
       <Link href="/" class="hover:text-muted-foreground text-primary text-xl font-medium">
         {SITE.title}
       </Link>
diff --git a/src/components/ThemeToggle.astro b/src/components/ThemeToggle.astro
index 88d4a39..2c83dd6 100644
--- a/src/components/ThemeToggle.astro
+++ b/src/components/ThemeToggle.astro
@@ -3,7 +3,7 @@ import { Button } from "@/components/ui/button";
 import { Icon } from "astro-icon/components";
 ---
 
-<Button id="theme-toggle" variant="outline" size="icon" title="Toggle theme">
+<Button id="theme-toggle" variant="ghost" size="icon" title="Toggle theme" className="-me-2 size-8">
   <Icon
     name="lucide:sun"
     class="size-4 scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90"
diff --git a/src/pages/blog/[...id].astro b/src/pages/blog/[...id].astro
index bea9ec7..8ca5aeb 100644
--- a/src/pages/blog/[...id].astro
+++ b/src/pages/blog/[...id].astro
@@ -73,7 +73,7 @@ const { Content, headings } = await render(post);
     }
     <section class="col-start-2 flex flex-col gap-y-6 text-center">
       <div class="flex flex-col gap-y-4">
-        <h1 class="text-4xl leading-tight font-medium text-pretty sm:text-5xl">
+        <h1 class="mb-2 text-4xl leading-tight font-medium text-pretty">
           {post.data.title}
         </h1>