adds some styling

src/components/Sidebar.astro

@@ -60,8 +60,10 @@ const navItems = [
     justify-content: flex-start;
   }
 
-  nav > ul > li > a.active {
-    background-color: var(--accent);
+  nav > ul > li > a.active,
+  a:hover {
+    background-color: var(--muted);
+    border-radius: var(--radius-sm);
     font-weight: 600;
   }
 

src/layouts/Layout.astro

@@ -48,8 +48,10 @@ const { title } = Astro.props;
   }
 
   :root {
+    color-scheme: light;
     /* Oat UI */
     --background: #ffffff;
+    --foreground: #000000;
     --primary: #133d56;
 
     /* Custom */
@@ -57,6 +59,7 @@ const { title } = Astro.props;
     --container-lg: 1200px;
     --container-md: 600px;
     --container-sm: 480px;
+    --radius-sm: 4px;
   }
 
   img {

src/pages/index.astro

@@ -4,4 +4,5 @@ import Layout from "../layouts/Layout.astro";
 
 <Layout title="Home">
   <h1>Welcome!</h1>
+  <img src="public/cover.png" />
 </Layout>