sankalp
0537ea5e5e
- Add custom border, background, and spacing utilities to base template - Enhance message notification styling and layout - Update delete modal button appearance and behavior - Refine comment card component with Tailwind classes and responsive behavior - Adjust sidebar responsiveness for mobile view
20 lines
1.8 KiB
HTML
20 lines
1.8 KiB
HTML
<header class="fixed top-0 left-0 right-0 h-16 bg-white/80 backdrop-blur-md border-b border-subtle z-30 flex items-center justify-between px-4 sm:px-6">
|
|
<div class="flex items-center gap-4">
|
|
<button @click="sidebarOpen = !sidebarOpen" class="lg:hidden p-2 text-secondary hover:text-primary rounded-lg hover:bg-hover transition-colors" aria-label="Toggle sidebar">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"/></svg>
|
|
</button>
|
|
<a href="/" class="flex items-center gap-2 text-primary font-bold text-lg no-underline">
|
|
<svg class="w-7 h-7 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 17V7m0 10a2 2 0 01-2 2H5a2 2 0 01-2-2V7a2 2 0 012-2h2a2 2 0 012 2m0 10a2 2 0 002 2h2a2 2 0 002-2M9 7a2 2 0 012-2h2a2 2 0 012 2m0 10V7"/></svg>
|
|
ProMan
|
|
</a>
|
|
</div>
|
|
<div class="flex items-center gap-3">
|
|
<span class="hidden sm:inline text-sm text-tertiary">{{ user.get_full_name|default:user.username }}</span>
|
|
<div class="w-8 h-8 rounded-full bg-blue-100 text-blue-700 flex items-center justify-center text-sm font-semibold">
|
|
{{ user.get_initials }}
|
|
</div>
|
|
<a href="{% url 'logout' %}" class="p-2 text-tertiary hover:text-secondary rounded-lg hover:bg-hover transition-colors" title="Log out">
|
|
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"/></svg>
|
|
</a>
|
|
</div>
|
|
</header> |