242 lines
9.6 KiB
HTML
242 lines
9.6 KiB
HTML
{# Base layout for the core NetBox UI w/navbar and page content #}
|
|
{% extends 'base/base.html' %}
|
|
{% load helpers %}
|
|
{% load navigation %}
|
|
{% load static %}
|
|
{% load i18n %}
|
|
|
|
{% comment %}
|
|
Blocks:
|
|
header: Page header
|
|
tabs: Horizontal navigation tabs
|
|
content: Page content
|
|
modals: Bootstrap 5 modal components
|
|
{% endcomment %}
|
|
|
|
{% block layout %}
|
|
|
|
<div class="page">
|
|
|
|
{# Sidebar #}
|
|
<aside class="navbar navbar-vertical navbar-expand-lg" data-bs-theme="dark">
|
|
<div class="container-fluid">
|
|
|
|
{# Header icon #}
|
|
<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>
|
|
<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">
|
|
</a>
|
|
</h1>
|
|
|
|
{# Navigation menu #}
|
|
<div class="collapse navbar-collapse" id="sidebar-menu">
|
|
{% nav %}
|
|
</div>
|
|
|
|
</div>
|
|
</aside>
|
|
|
|
{# Top menu #}
|
|
<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">
|
|
<button class="btn color-mode-toggle hide-theme-dark" title="{% trans "Enable dark mode" %}" data-bs-toggle="tooltip" data-bs-placement="bottom">
|
|
<i class="mdi mdi-lightbulb"></i>
|
|
</button>
|
|
<button class="btn color-mode-toggle hide-theme-light" title="{% trans "Enable light mode" %}" data-bs-toggle="tooltip" data-bs-placement="bottom">
|
|
<i class="mdi mdi-lightbulb-on"></i>
|
|
</button>
|
|
</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' %}" 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 #}
|
|
</div>
|
|
|
|
{# Search box #}
|
|
<div class="collapse navbar-collapse" id="navbar-menu">
|
|
<form action="{% url 'search' %}" method="get" autocomplete="off" novalidate>
|
|
<div class="input-icon">
|
|
<span class="input-icon-addon">
|
|
<i class="mdi mdi-magnify"></i>
|
|
</span>
|
|
<input type="text" name="q" value="" class="form-control" placeholder="Search…" aria-label="Search NetBox">
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
</div>
|
|
</header>
|
|
|
|
{# Page content #}
|
|
<div class="page-wrapper">
|
|
<div id="page-content" {% htmx_boost %}>
|
|
|
|
{# Page header #}
|
|
{% block header %}
|
|
|
|
{# Top banner #}
|
|
{% if config.BANNER_TOP %}
|
|
{% include 'inc/banner.html' with content=config.BANNER_TOP %}
|
|
{% endif %}
|
|
{# /Top banner #}
|
|
|
|
{# Alerts #}
|
|
{% if settings.DEBUG and not settings.DEVELOPER %}
|
|
{% include 'inc/alerts/warning.html' with title="Debug mode is enabled" message="Performance may be limited. Debugging should never be enabled on a production system." %}
|
|
{% endif %}
|
|
|
|
{% if config.MAINTENANCE_MODE and config.BANNER_MAINTENANCE %}
|
|
{% include 'inc/alerts/warning.html' with title="Maintenance Mode" message=config.BANNER_MAINTENANCE|escape %}
|
|
{% endif %}
|
|
{# /Alerts #}
|
|
|
|
{% endblock header %}
|
|
{# /Page header #}
|
|
|
|
{# Page body #}
|
|
{% block page %}
|
|
<div class="page-body my-1">
|
|
<div class="container-fluid tab-content py-3">
|
|
|
|
{# Page content #}
|
|
{% block content %}{% endblock %}
|
|
{# /Page content #}
|
|
|
|
</div>
|
|
</div>
|
|
{% endblock page %}
|
|
{# /Page body #}
|
|
|
|
{# Bottom banner #}
|
|
{% if config.BANNER_BOTTOM %}
|
|
{% include 'inc/banner.html' with content=config.BANNER_BOTTOM %}
|
|
{% endif %}
|
|
{# /Bottom banner #}
|
|
|
|
</div>
|
|
|
|
{# Page footer #}
|
|
<footer class="footer footer-transparent d-print-none py-2">
|
|
<div class="container-fluid d-flex justify-content-between align-items-center">
|
|
{% block footer %}
|
|
|
|
{# Footer links #}
|
|
<ul class="list-inline mb-0 fs-2">
|
|
{% block footer_links %}
|
|
{# Documentation #}
|
|
<li class="list-inline-item">
|
|
<a href="{% static 'docs/' %}" target="_blank" class="link-secondary" rel="noopener">
|
|
<i title="{% trans "Docs" %}" class="mdi mdi-book-open-variant text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
|
|
</a>
|
|
</li>
|
|
{# REST API #}
|
|
<li class="list-inline-item">
|
|
<a href="{% url 'api-root' %}" target="_blank" class="link-secondary" rel="noopener">
|
|
<i title="{% trans "REST API" %}" class="mdi mdi-cloud-braces text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
|
|
</a>
|
|
</li>
|
|
{# API docs #}
|
|
<li class="list-inline-item">
|
|
<a href="{% url 'api_docs' %}" target="_blank" class="link-secondary" rel="noopener">
|
|
<i title="{% trans "REST API documentation" %}" class="mdi mdi-book text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
|
|
</a>
|
|
</li>
|
|
{# GraphQL API #}
|
|
{% if config.GRAPHQL_ENABLED %}
|
|
<li class="list-inline-item">
|
|
<a href="{% url 'graphql' %}" target="_blank" class="link-secondary" rel="noopener">
|
|
<i title="{% trans "GraphQL API" %}" class="mdi mdi-graphql text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
|
|
</a>
|
|
</li>
|
|
{% endif %}
|
|
{# GitHub #}
|
|
<li class="list-inline-item">
|
|
<a href="https://github.com/netbox-community/netbox" target="_blank" class="link-secondary" rel="noopener">
|
|
<i title="{% trans "Source Code" %}" class="mdi mdi-github text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
|
|
</a>
|
|
</li>
|
|
{# NetDev Slack #}
|
|
<li class="list-inline-item">
|
|
<a href="https://netdev.chat" target="_blank" class="link-secondary" rel="noopener">
|
|
<i title="{% trans "Community" %}" class="mdi mdi-slack text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
|
|
</a>
|
|
</li>
|
|
{% endblock footer_links %}
|
|
</ul>
|
|
{# /Footer links #}
|
|
|
|
{# Footer text #}
|
|
<ul class="list-inline list-inline-dots mb-0" id="footer-stamp" hx-swap-oob="true">
|
|
<li class="list-inline-item">
|
|
{% annotated_now %} {% now 'T' %}
|
|
</li>
|
|
<li class="list-inline-item">
|
|
{{ settings.HOSTNAME }} (v{{ settings.VERSION }})
|
|
</li>
|
|
</ul>
|
|
{# /Footer text #}
|
|
|
|
{% endblock footer %}
|
|
</div>
|
|
</footer>
|
|
{# /Page footer #}
|
|
|
|
{# /Page content #}
|
|
</div>
|
|
|
|
{# BS5 pop-up modals #}
|
|
{% block modals %}{% endblock %}
|
|
|
|
</div>
|
|
{% endblock layout %}
|