Update footer styling and fix navigation naming

- Change footer colors to match left nav (lighter gray)
- Update heart to red emoji in footer text
- Fix "Introduction" to "Basic Memory" in navigation config
- Improve overall visual consistency

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>

Author: groksrc

src/components/Footer.astro

@@ -28,45 +28,25 @@ const socialLinks = [
 ]
 ---
 
-<footer class="border-t bg-background">
-  <div class="flex justify-center">
-    <div class="flex flex-col items-center justify-between gap-4 py-10 md:h-24 md:flex-row md:py-0 w-full max-w-screen-2xl px-6">
-      <div class="flex flex-col items-center gap-4 md:flex-row md:gap-2">
-        <p class="text-center text-sm leading-loose text-muted-foreground md:text-left">
-          Built by{' '}
-          <a
-            href="https://basicmachines.co"
-            target="_blank"
-            rel="noreferrer"
-            class="font-medium hover:text-foreground transition-colors no-underline"
-          >
-            Basic Machines
-          </a>
-          . The source code is available on{' '}
-          <a
-            href="https://github.com/basicmachines-co/basic-memory"
-            target="_blank"
-            rel="noreferrer"
-            class="font-medium hover:text-foreground transition-colors no-underline"
-          >
-            GitHub
-          </a>
-          .
-        </p>
-      </div>
-      <div class="flex items-center space-x-4">
-        {socialLinks.map((link) => (
-          <a
-            href={link.href}
-            target="_blank"
-            rel="noreferrer"
-            class="text-muted-foreground hover:text-foreground transition-colors"
-            title={link.name}
-          >
-            <span set:html={link.icon} />
-          </a>
-        ))}
-      </div>
+<footer class="mt-16 py-8 border-t">
+  <div class="flex flex-col items-center justify-between gap-4 md:flex-row md:items-center">
+    <div class="flex items-center space-x-4 h-6">
+      {socialLinks.map((link) => (
+        <a
+          href={link.href}
+          target="_blank"
+          rel="noreferrer"
+          class="inline-flex items-center justify-center h-full text-gray-400 hover:text-gray-600 transition-colors"
+          title={link.name}
+        >
+          <span set:html={link.icon} class="inline-flex" />
+        </a>
+      ))}
+    </div>
+    <div class="flex items-center h-6">
+      <p class="text-center text-sm text-gray-500 md:text-right m-0">
+        Built with ❤️ by Basic Machines
+      </p>
     </div>
   </div>
 </footer>

src/components/Sidebar.astro

@@ -5,7 +5,7 @@ import Icon from './Icon.astro'
 const currentPath = Astro.url.pathname
 ---
 
-<aside class="hidden md:block w-64 flex-shrink-0 bg-background">
+<aside class="hidden md:block w-72 flex-shrink-0 bg-background">
   <nav class="sticky top-16 h-[calc(100vh-4rem)] overflow-y-auto py-6 pr-6 pl-8">
     <div class="space-y-6">
       <!-- Top links section -->
@@ -27,11 +27,11 @@ const currentPath = Astro.url.pathname
           </a>
         ))}
       </div>
-      
+
       <!-- Regular navigation sections -->
       {navConfig.sidebar.map((section) => (
-        <div class="space-y-3">
-          <h4 class="text-sm font-semibold leading-none tracking-tight text-gray-900 px-3">
+        <div>
+          <h4 class="text-sm font-semibold leading-none tracking-tight text-gray-900 px-3 mb-4 mt-10">
             {section.title}
           </h4>
           <ul class="space-y-1 list-none m-0 p-0">
@@ -55,4 +55,4 @@ const currentPath = Astro.url.pathname
       ))}
     </div>
   </nav>
-</aside>
+</aside>

src/config/navigation.ts

@@ -25,7 +25,7 @@ export const navConfig = {
     {
       title: 'Get Started',
       items: [
-        { title: 'Introduction', href: '/' },
+        { title: 'Basic Memory', href: '/' },
         { title: 'Getting Started', href: '/getting-started' },
         { title: 'User Guide', href: '/user-guide' },
       ],

src/layouts/DocsLayout.astro

@@ -23,10 +23,10 @@ const { title, description } = Astro.props.frontmatter || Astro.props
           <article class="max-w-4xl py-8">
             <slot />
           </article>
+          <Footer />
         </main>
         <TableOfContents />
       </div>
     </div>
-    <Footer />
   </div>
 </Layout>