Fixes #15613: Show login button/user menu on mobile view
This commit is contained in:
parent
4e4c277711
commit
4562e347fd
File diff suppressed because one or more lines are too long
|
@ -14,3 +14,9 @@ html {
|
|||
.progress {
|
||||
min-width: 80px;
|
||||
}
|
||||
|
||||
// Reduce vertical margin around dropdown menu divider
|
||||
hr.dropdown-divider {
|
||||
margin-bottom: 0.25rem;
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
|
|
|
@ -21,16 +21,23 @@ Blocks:
|
|||
<aside class="navbar navbar-vertical navbar-expand-lg" data-bs-theme="dark">
|
||||
<div class="container-fluid">
|
||||
|
||||
{# Header icon #}
|
||||
{# Menu toggle (mobile view) #}
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#sidebar-menu" aria-controls="sidebar-menu" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
{# Logo #}
|
||||
<h1 class="navbar-brand navbar-brand-autodark">
|
||||
<a href="{% url 'home' %}">
|
||||
<img src="{% static 'netbox_logo.svg' %}" height="32" alt="{% trans "NetBox Logo" %}" class="navbar-brand-image">
|
||||
<img src="{% static 'netbox_logo.svg' %}" alt="{% trans "NetBox Logo" %}" class="navbar-brand-image">
|
||||
</a>
|
||||
</h1>
|
||||
|
||||
{# User menu (mobile view) #}
|
||||
<div class="navbar-nav flex-row d-lg-none">
|
||||
{% include 'inc/user_menu.html' %}
|
||||
</div>
|
||||
|
||||
{# Navigation menu #}
|
||||
<div class="collapse navbar-collapse" id="sidebar-menu">
|
||||
{% nav %}
|
||||
|
@ -43,11 +50,6 @@ Blocks:
|
|||
<header class="navbar navbar-expand-md d-none d-lg-flex d-print-none">
|
||||
<div class="container-fluid">
|
||||
|
||||
{# Nav menu toggle #}
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbar-menu" aria-controls="navbar-menu" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<div class="navbar-nav flex-row align-items-center order-md-last">
|
||||
{# Dark/light mode toggle #}
|
||||
<div class="d-none d-md-flex">
|
||||
|
@ -60,46 +62,7 @@ Blocks:
|
|||
</div>
|
||||
|
||||
{# User menu #}
|
||||
{% if request.user.is_authenticated %}
|
||||
<div class="nav-item dropdown">
|
||||
<a href="#" class="nav-link d-flex lh-1 text-reset p-0" data-bs-toggle="dropdown" aria-label="Open user menu">
|
||||
<div class="d-xl-block ps-2">
|
||||
<div>{{ request.user }}</div>
|
||||
<div class="mt-1 small text-secondary">{% if request.user.is_staff %}Staff{% else %}User{% endif %}</div>
|
||||
</div>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-end dropdown-menu-arrow" {% htmx_boost %}>
|
||||
{% if config.DJANGO_ADMIN_ENABLED and request.user.is_staff %}
|
||||
<a class="dropdown-item" href="{% url 'admin:index' %}">
|
||||
<i class="mdi mdi-cog"></i> {% trans "Django Admin" %}
|
||||
</a>
|
||||
{% endif %}
|
||||
<a href="{% url 'account:profile' %}" class="dropdown-item">
|
||||
<i class="mdi mdi-account"></i> {% trans "Profile" %}
|
||||
</a>
|
||||
<a href="{% url 'account:bookmarks' %}" class="dropdown-item">
|
||||
<i class="mdi mdi-bookmark"></i> {% trans "Bookmarks" %}
|
||||
</a>
|
||||
<a href="{% url 'account:preferences' %}" class="dropdown-item">
|
||||
<i class="mdi mdi-wrench"></i> {% trans "Preferences" %}
|
||||
</a>
|
||||
<a href="{% url 'account:usertoken_list' %}" class="dropdown-item">
|
||||
<i class="mdi mdi-key"></i> {% trans "API Tokens" %}
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="{% url 'logout' %}" hx-disable="true" class="dropdown-item">
|
||||
<i class="mdi mdi-logout-variant"></i> {% trans "Log Out" %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="btn-group ps-2">
|
||||
<a class="btn btn-primary" type="button" href="{% url 'login' %}?next={{ request.path }}">
|
||||
<i class="mdi mdi-login-variant"></i> {% trans "Log In" %}
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
{# /User menu #}
|
||||
{% include 'inc/user_menu.html' %}
|
||||
</div>
|
||||
|
||||
{# Search box #}
|
||||
|
|
|
@ -0,0 +1,50 @@
|
|||
{% load i18n %}
|
||||
{% load navigation %}
|
||||
|
||||
{% if request.user.is_authenticated %}
|
||||
<div class="nav-item dropdown">
|
||||
<a href="#" class="nav-link d-flex lh-1 text-reset p-0" data-bs-toggle="dropdown" aria-label="Open user menu">
|
||||
<div class="d-xl-block ps-2">
|
||||
<div>{{ request.user }}</div>
|
||||
<div class="mt-1 small text-secondary">
|
||||
{% if request.user.is_superuser %}
|
||||
{% trans "Admin" %}
|
||||
{% elif request.user.is_staff %}
|
||||
{% trans "Staff" %}
|
||||
{% else %}
|
||||
{% trans "User" %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-end dropdown-menu-arrow" {% htmx_boost %}>
|
||||
{% if config.DJANGO_ADMIN_ENABLED and request.user.is_staff %}
|
||||
<a class="dropdown-item" href="{% url 'admin:index' %}">
|
||||
<i class="mdi mdi-cog"></i> {% trans "Django Admin" %}
|
||||
</a>
|
||||
{% endif %}
|
||||
<a href="{% url 'account:profile' %}" class="dropdown-item">
|
||||
<i class="mdi mdi-account"></i> {% trans "Profile" %}
|
||||
</a>
|
||||
<a href="{% url 'account:bookmarks' %}" class="dropdown-item">
|
||||
<i class="mdi mdi-bookmark"></i> {% trans "Bookmarks" %}
|
||||
</a>
|
||||
<a href="{% url 'account:preferences' %}" class="dropdown-item">
|
||||
<i class="mdi mdi-wrench"></i> {% trans "Preferences" %}
|
||||
</a>
|
||||
<a href="{% url 'account:usertoken_list' %}" class="dropdown-item">
|
||||
<i class="mdi mdi-key"></i> {% trans "API Tokens" %}
|
||||
</a>
|
||||
<hr class="dropdown-divider" />
|
||||
<a href="{% url 'logout' %}" hx-disable="true" class="dropdown-item">
|
||||
<i class="mdi mdi-logout-variant"></i> {% trans "Log Out" %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="btn-group align-items-center ps-2">
|
||||
<a class="btn btn-primary" type="button" href="{% url 'login' %}?next={{ request.path }}">
|
||||
<i class="mdi mdi-login-variant"></i> {% trans "Log In" %}
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
Loading…
Reference in New Issue