change menu styling

css/style.css

@@ -448,6 +448,7 @@ button:visited, .link-button:visited, .logo:visited {
   align-items: center;
   justify-content: center;
   gap: 1rem;
+  min-height: 44px;
 }
 
 /* .desktop-nav {
@@ -455,6 +456,14 @@ button:visited, .link-button:visited, .logo:visited {
   align-self: stretch;
 } */
 
+.desktop-nav {
+  flex: 1;  
+  background: var(--color-neutral-200);
+  border-radius: var(--radius-xxl);
+  box-shadow: var(--shadow-button);
+  padding: var(--spacing-1);
+}
+
 .desktop-nav ul,
 .mobile-menu ul {
   list-style: none;

index.html

@@ -43,21 +43,21 @@
             <li><a href="#" class="link-button">About</a></li>
           </ul>
         </nav>
-    </div>
+      </div>
   
-    <button
+      <button
-      class="menu-toggle"
+        class="menu-toggle"
-      id="menuToggle"
+        id="menuToggle"
-      type="button"
+        type="button"
-      aria-expanded="false"
+        aria-expanded="false"
-      aria-controls="mobileMenu"
+        aria-controls="mobileMenu"
-      aria-haspopup="true"
+        aria-haspopup="true"
-      aria-label="Open menu"
+        aria-label="Open menu"
-    >
+      >
-      <span></span>
+        <span></span>
-      <span></span>
+        <span></span>
-      <span></span>
+        <span></span>
-    </button>
+      </button>
     </div>
   </header>