feat: 调整样式

src/components/BaseHeader.astro

@@ -1,3 +1,7 @@
+---
+import { metadata } from "../consts";
+---
+
 <style>
   header {
     height: 60px;
@@ -13,7 +17,17 @@
     max-width: var(--layout-width);
     margin: 0 auto;
     height: 100%;
-    padding: 0 16px;
+    padding: 0 32px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+
+  .main-nav h1 {
+    user-select: none;
+    font-size: 30px;
+    cursor: pointer;
+    font-size: 24px;
   }
 
   .main-nav .menu {
@@ -27,7 +41,6 @@
   /* element: menu-item */
   .main-nav .menu-item a {
     text-decoration: none;
-    font-weight: bold;
   }
 
   .main-nav .menu-item a:hover {
@@ -36,8 +49,14 @@
 
 <header>
   <nav class="main-nav">
+    <h1>
+      <a href="/">{metadata.siteTitle}</a>
+    </h1>
     <ul class="menu">
       <li class="menu-item"><a href="/">首页</a></li>
+      <li class="menu-item"><a href="/">文章</a></li>
+      <li class="menu-item"><a href="/">分类</a></li>
+      <li class="menu-item"><a href="/">关于</a></li>
     </ul>
   </nav>
 </header>