From a2501562a8256f84b5f34497eb78ed435f9293e8 Mon Sep 17 00:00:00 2001
From: pac7 <47831526-pac7@users.noreply.replit.com>
Date: Sun, 21 Sep 2025 13:56:18 +0000
Subject: [PATCH] Improve header navigation and user account access for mobile

Update `enhanced_header.html` to conditionally render mobile navigation links for login and signup based on user authentication status. Adjustments made to `.hidden md:flex` and `.md:hidden` classes for proper display. Additionally, modify `button.html` component to provide default empty strings for `x_data` and `x_on` attributes.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: eff39de1-3afa-446d-a965-acaf61837fc7
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/d6d61dac-164d-45dd-929f-7dcdfd771b64/eff39de1-3afa-446d-a965-acaf61837fc7/W8ptmMg
---
 .../components/layout/enhanced_header.html    | 33 +++++++++++++++++--
 backend/templates/cotton/ui/button.html       |  4 +--
 2 files changed, 33 insertions(+), 4 deletions(-)

diff --git a/backend/templates/components/layout/enhanced_header.html b/backend/templates/components/layout/enhanced_header.html
index 773e40c1..d7165065 100644
--- a/backend/templates/components/layout/enhanced_header.html
+++ b/backend/templates/components/layout/enhanced_header.html
@@ -309,7 +309,7 @@ Includes: Browse menu, advanced search, theme toggle, user dropdown, mobile menu
           </div>
         </div>
       {% else %}
-        <div class="flex items-center space-x-1">
+        <div class="hidden md:flex items-center space-x-1">
           <div 
             hx-get="{% url 'account_login' %}"
             hx-target="body"
@@ -330,7 +330,7 @@ Includes: Browse menu, advanced search, theme toggle, user dropdown, mobile menu
       {% endif %}
 
       <!-- Mobile Menu Button -->
-      <div x-data="{ open: false }">
+      <div class="md:hidden" x-data="{ open: false }">
         <button 
           @click="open = !open"
           class="inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-10 w-10"
@@ -386,6 +386,35 @@ Includes: Browse menu, advanced search, theme toggle, user dropdown, mobile menu
                   Navigate through the ultimate theme park database
                 </p>
 
+                <!-- Mobile Authentication -->
+                {% if not user.is_authenticated %}
+                <div>
+                  <h3 class="text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-3">
+                    ACCOUNT
+                  </h3>
+                  <div class="space-y-2">
+                    <div 
+                      hx-get="{% url 'account_login' %}"
+                      hx-target="body"
+                      hx-swap="beforeend"
+                      class="cursor-pointer"
+                      @click="open = false"
+                    >
+                      <c-ui.button variant="outline" size="default" text="Login" button_classes="w-full" />
+                    </div>
+                    <div 
+                      hx-get="{% url 'account_signup' %}"
+                      hx-target="body"
+                      hx-swap="beforeend"
+                      class="cursor-pointer"
+                      @click="open = false"
+                    >
+                      <c-ui.button variant="default" size="default" text="Join ThrillWiki" button_classes="w-full" />
+                    </div>
+                  </div>
+                </div>
+                {% endif %}
+
                 <!-- Navigation Section -->
                 <div>
                   <h3 class="text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-3">
diff --git a/backend/templates/cotton/ui/button.html b/backend/templates/cotton/ui/button.html
index c3ff7229..b827228d 100644
--- a/backend/templates/cotton/ui/button.html
+++ b/backend/templates/cotton/ui/button.html
@@ -13,8 +13,8 @@ Converts existing button component to use Django Cotton's component system
   type="type|default:'button'"
   disabled="disabled|default:''"
   onclick="onclick|default:''"
-  x_data="x_data"
-  x_on="x_on"
+  x_data="x_data|default:''"
+  x_on="x_on|default:''"
   hx_get="hx_get|default:''"
   hx_post="hx_post|default:''"
   hx_target="hx_target|default:''"