68 lines
3.8 KiB
HTML
68 lines
3.8 KiB
HTML
<header class="bg-zinc-800 shadow-md py-3 px-6 flex items-center justify-between relative">
|
|
<a href="/" class="flex items-center space-x-3">
|
|
<img src="{{ LOGO_PNG }}" alt="Logo" class="h-8 rounded">
|
|
<span class="text-2xl font-bold text-white">{{ NAME }} IPAM <span class="text-sm font-normal text-gray-300">v{{ VERSION }}</span></span>
|
|
</a>
|
|
<div class="hidden lg:block absolute left-1/2 transform -translate-x-1/2 text-white text-lg font-medium whitespace-nowrap">
|
|
{% if current_user_name %}Hello, {{ current_user_name }}{% endif %}
|
|
</div>
|
|
<nav class="hidden md:flex items-center space-x-6" id="main-nav">
|
|
{% if has_permission('view_index') %}
|
|
<a href="/" class="text-gray-200 hover:text-gray-400 font-medium">Home</a>
|
|
{% endif %}
|
|
{% if has_permission('view_devices') %}
|
|
<a href="/devices" class="text-gray-200 hover:text-gray-400 font-medium">Devices</a>
|
|
{% endif %}
|
|
{% if has_permission('view_racks') %}
|
|
<a href="/racks" class="text-gray-200 hover:text-gray-400 font-medium">Racks</a>
|
|
{% endif %}
|
|
{% if has_permission('view_admin') %}
|
|
<a href="/admin" class="text-gray-200 hover:text-gray-400 font-medium">Admin</a>
|
|
{% endif %}
|
|
{% if has_permission('view_users') %}
|
|
<a href="/users" class="text-gray-200 hover:text-gray-400 font-medium">Users</a>
|
|
{% endif %}
|
|
{% if has_permission('view_audit') %}
|
|
<a href="/audit" class="text-gray-200 hover:text-gray-400 font-medium">Audit Log</a>
|
|
{% endif %}
|
|
{% if has_permission('view_help') %}
|
|
<a href="/help" class="text-gray-200 hover:text-gray-400 font-medium">Help</a>
|
|
{% endif %}
|
|
{% if current_user_name %}
|
|
<a href="/logout" class="text-gray-200 hover:text-gray-400 font-medium">Logout</a>
|
|
{% endif %}
|
|
</nav>
|
|
<button class="md:hidden flex items-center text-gray-200 hover:cursor-pointer focus:outline-none" id="nav-toggle" aria-label="Open navigation menu">
|
|
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
|
|
</svg>
|
|
</button>
|
|
<div class="md:hidden absolute top-16 right-6 bg-zinc-800 rounded-lg shadow-lg z-50 w-48 hidden flex-col py-2" id="mobile-nav">
|
|
{% if has_permission('view_index') %}
|
|
<a href="/" class="block px-6 py-2 text-gray-200 hover:text-gray-400 font-medium">Home</a>
|
|
{% endif %}
|
|
{% if has_permission('view_devices') %}
|
|
<a href="/devices" class="block px-6 py-2 text-gray-200 hover:text-gray-400 font-medium">Devices</a>
|
|
{% endif %}
|
|
{% if has_permission('view_racks') %}
|
|
<a href="/racks" class="block px-6 py-2 text-gray-200 hover:text-gray-400 font-medium">Racks</a>
|
|
{% endif %}
|
|
{% if has_permission('view_admin') %}
|
|
<a href="/admin" class="block px-6 py-2 text-gray-200 hover:text-gray-400 font-medium">Admin</a>
|
|
{% endif %}
|
|
{% if has_permission('view_users') %}
|
|
<a href="/users" class="block px-6 py-2 text-gray-200 hover:text-gray-400 font-medium">Users</a>
|
|
{% endif %}
|
|
{% if has_permission('view_audit') %}
|
|
<a href="/audit" class="block px-6 py-2 text-gray-200 hover:text-gray-400 font-medium">Audit Log</a>
|
|
{% endif %}
|
|
{% if has_permission('view_help') %}
|
|
<a href="/help" class="block px-6 py-2 text-gray-200 hover:text-gray-400 font-medium">Help</a>
|
|
{% endif %}
|
|
{% if current_user_name %}
|
|
<a href="/logout" class="block px-6 py-2 text-gray-200 hover:text-gray-400 font-medium">Logout</a>
|
|
{% endif %}
|
|
</div>
|
|
<script src="/static/js/header.js"></script>
|
|
</header>
|