Make <Nav /> more suited for other pages

src/components/generic/Nav.astro

···
 const { data, startOpen = false, current } = Astro.props;
 ---
 
-<button popovertarget="nav" popovertargetaction="show" aria-label="Nav Menu">
+<button
+  popovertarget="nav"
+  popovertargetaction="show"
+  aria-label="Nav Menu"
+  id="nav-menu"
+>
   <Hamburger />
 </button>
 <dialog closedby="any" open={startOpen} id="nav" popover>
···
     & svg {
       stroke: white;
     }
+  }
+
+  #nav-menu {
+    background-color: black;
+    padding: 1rem;
+    border-radius: 0 0 50% 0;
   }
 
   .top {

src/pages/blog/index.astro

···
     top: 0;
     width: 100%;
     z-index: 999;
-    padding: 0.5rem 1rem;
     display: flex;
     align-items: center;
     justify-content: space-between;
 
-    & .gap {
-      width: 100%;
+    & a {
+      margin: 0.5rem 1rem;
     }
   }