Refactoring sidebar and adding footer

web/src/components/footer.astro

@@ -0,0 +1,29 @@
+---
+const links = [
+    {
+        text: "src",
+        href: "https://github.com/breadone/breadone.net"
+    },
+    {
+        text: "bsky",
+        href: "https://bsky.app/profile/breadone.xyz"
+    },
+    {
+        text: "email",
+        href: "mailto:contact@breadone.net"
+    },
+]
+---
+
+<footer class="text-xl mt-auto">
+    {
+        links.map(l => (
+            <a
+                class="ps-2"
+                href={l.href}
+            >
+                {l.text}
+            </a>
+        ))
+    }
+</footer>

web/src/components/index/navbar.astro

@@ -1,12 +1,35 @@
+---
+const links = [
+    {
+        txt: 'now',
+        lnk: '/now'
+    },
+    {
+        txt: 'posts',
+        lnk: '/posts'
+    },
+    {
+        txt: 'photos',
+        lnk: '/photos'
+    },
+]
+---
+
 <div class="text-2xl">
-    <a href="/now">now</a>
+    {
+        links.map(l => (
+            <a href={l.lnk}>{l.txt}</a>
+        )).join(<span class="text-(--accent)">•</span>)
+    }
+
+    <!-- <a href="/now">now</a>
 
     <span class="text-(--accent)">•</span> 
 
     <a href="/posts">posts</a>
 
     <span class="text-(--accent)">•</span> 
-    
+
-    <a href="/photos">photos</a>
+    <a href="/photos">photos</a> -->
     <!-- • <a href="/software">software</a> -->
 </div>

web/src/components/sidebar.astro

@@ -1,12 +1,15 @@
 ---
 import Navbar from "src/components/index/navbar.astro"
+import Footer from "./footer.astro"
 ---
 
-<div class="w-[32%] text-center">
+<div class="w-[32%] py-14 h-screen text-center flex flex-col">
-    <div class="flex flex-col">
+    <p class="text-4xl">breadone dot net</p>
-        <p class="text-4xl">breadone dot net</p>
+    <Navbar/>
-        <Navbar/>
+    <!-- Lil spacer -->
-        <div class="mt-8"/>
+    <div class="mt-8"/> 
-        <slot/>
+
-    </div>
+    <slot/>
+
+    <Footer/>
 </div>

web/src/layout/Base.astro

@@ -12,6 +12,5 @@ import BaseHead from "./BaseHead.astro"
     <main id="main" class="flex-1">
         <slot />
     </main>
-    <!-- <Footer /> -->
 </body>
 </html>

web/src/pages/index.astro

@@ -5,10 +5,9 @@ import Sidebar from "src/components/sidebar.astro"
 
 <Base>
 	<div class="flex flex-row">
-		<!-- HeaderSection -->
 		<Sidebar/>
 
-		<div class="content-panel bg-amber-200">
+		<div class="content-panel">
 			content
 		</div>
 	</div>

web/src/styles/global.css

@@ -16,7 +16,7 @@
   
   html body {
     @apply font-[Barnum];
-    @apply w-[68%] mx-auto mt-14 h-full;
+    @apply w-[68%] mx-auto h-full;
     @apply bg-(--bg-light);
   }