fix: include header.css in Header component

src/components/Header.astro

@@ -1,40 +1,31 @@
 ---
+import "./header.css";
 import { LightSwitch } from "./LightSwitch";
 
 interface Props {
-    page: string;
+  page: string;
 }
 
 const { page } = Astro.props;
 
 const selected = (value: string) =>
-    page.startsWith(value) ? "nav-link link-selected" : "nav-link";
+  page.startsWith(value) ? "nav-link link-selected" : "nav-link";
 ---
 
 <header>
-    <div class="navbar-container">
-      <h2 class="logo-container">
-        <a href="/" aria-label="Go to the main page">
-          <img
-            src="/images/logo.png"
-            alt="eatsteak.dev"
-            class="logo-image"
-          ></img>
-        </a>
-      </h2>
-      <nav class="navbar">
-        <a class={selected("about")} href="/about">
-          About
-        </a>
-        <a class={selected("post")} href="/posts">
-          Posts
-        </a>
-        <a class={selected("category")} href="/category">
-          Categories
-        </a>
-      </nav>
-      <aside class="switch-container">
-        <LightSwitch client:only="solid-js" />
-      </aside>
-    </div>
-  </header>
+  <div class="navbar-container">
+    <h2 class="logo-container">
+      <a href="/" aria-label="Go to the main page">
+        <img src="/images/logo.png" alt="eatsteak.dev" class="logo-image" /></a
+      >
+    </h2>
+  </div>
+  <nav class="navbar">
+    <a class={selected("about")} href="/about"> About </a>
+    <a class={selected("post")} href="/posts"> Posts </a>
+    <a class={selected("category")} href="/category"> Categories </a>
+  </nav>
+  <aside class="switch-container">
+    <LightSwitch client:only="solid-js" />
+  </aside>
+</header>