Fix mobile header layout - remove vertical stacking

The flex-direction: column on header-user was causing buttons to
overflow outside the header bar. Changed approach to keep buttons
horizontal but make them smaller on very small screens.

Changes:
- Removed flex-direction: column from 480px breakpoint
- Keep buttons horizontal with smaller font size
- Reduced button min-height to 36px on small screens
- Reduced touch targets slightly (40px) for very small screens
- Smaller brand font size (0.9rem)

Updated cache version to v=3 to force reload.

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

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Keith Smith
2025-12-26 21:14:30 -07:00
co-authored by Claude Sonnet 4.5
parent e038e47247
commit d83b1e3091
2 changed files with 15 additions and 15 deletions
+1 -1
View File
@@ -10,7 +10,7 @@
<link rel="icon" type="image/svg+xml" href="{% static 'favicons/favicon.svg' %}">
<link rel="alternate icon" href="{% static 'favicons/favicon.svg' %}" type="image/svg+xml">
<link rel="stylesheet" href="{% static 'css/app.css' %}?v=2">
<link rel="stylesheet" href="{% static 'css/app.css' %}?v=3">
{% block extra_css %}{% endblock %}
</head>
<body>