From 599b2f0685f67fbe0879aff2a001d07122acdc2e Mon Sep 17 00:00:00 2001
From: Joshua Ryder <ryderjj89@outlook.com>
Date: Fri, 7 Nov 2025 09:36:17 -0500
Subject: [PATCH] feat: Add navigation menu to login/register page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Add consistent header with logo and hamburger menu to authentication pages, matching the navigation pattern used throughout the site. The menu adapts to authentication state and provides easy access to home and other sections.

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

Co-Authored-By: Claude <noreply@anthropic.com>
---
 pages/login.vue | 24 +++++++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

diff --git a/pages/login.vue b/pages/login.vue
index 83ba80c..c8e3bfc 100644
--- a/pages/login.vue
+++ b/pages/login.vue
@@ -1,9 +1,26 @@
 <template>
   <div class="min-h-screen bg-gray-50 flex flex-col">
+    <!-- Header -->
+    <header class="bg-white shadow-sm">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
+        <div class="flex items-center justify-between">
+          <NuxtLink to="/">
+            <img src="/logos/logo.png" alt="New Life Christian Church" class="h-16 w-auto" />
+          </NuxtLink>
+          <ClientOnly fallback-tag="div">
+            <Menu
+              :is-authenticated="isAuthenticated"
+              :is-admin="isAdmin"
+              :show-home="true"
+            />
+          </ClientOnly>
+        </div>
+      </div>
+    </header>
+
     <div class="flex-1 flex items-center justify-center px-4">
       <div class="max-w-md w-full">
       <div class="text-center mb-8">
-        <img src="/logos/logo.png" alt="New Life Christian Church" class="h-20 w-auto mx-auto mb-4" />
         <h2 class="text-3xl font-bold text-gray-900">{{ isRegistering ? 'Create Account' : 'Log In' }}</h2>
         <p class="mt-2 text-sm text-gray-600">{{ isRegistering ? 'Create a new account' : 'Sign in to your account' }}</p>
       </div>
@@ -169,6 +186,11 @@
 </template>
 
 <script setup lang="ts">
+// Check authentication status
+const { data: authData } = await useFetch('/api/auth/verify')
+const isAuthenticated = computed(() => authData.value?.authenticated || false)
+const isAdmin = computed(() => authData.value?.isAdmin || false)
+
 const route = useRoute()
 const router = useRouter()