mirror of
https://github.com/netbox-community/netbox.git
synced 2025-07-21 19:47:20 -06:00
227 lines
8.9 KiB
HTML
227 lines
8.9 KiB
HTML
{# Base layout for the core NetBox UI w/navbar and page content #}
|
|
{% extends 'base/base.html' %}
|
|
{% load helpers %}
|
|
{% load navigation %}
|
|
{% load plugins %}
|
|
{% 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 d-print-none">
|
|
|
|
{% if 'commercial' in settings.RELEASE.features %}
|
|
<img class="motif" src="{% static 'motif.svg' %}" alt="{% trans "NetBox Motif" %}">
|
|
{% endif %}
|
|
|
|
<div class="container-fluid">
|
|
|
|
{# 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 pb-0">
|
|
<a href="{% url 'home' %}">
|
|
<img src="{% static 'logo_netbox_dark_teal.svg' %}" alt="{% trans "NetBox Logo" %}" class="navbar-brand-image hide-theme-dark">
|
|
<img src="{% static 'logo_netbox_bright_teal.svg' %}" alt="{% trans "NetBox Logo" %}" class="navbar-brand-image hide-theme-light">
|
|
<div class="netbox-edition fw-semibold text-center fs-5 my-1">{{ settings.RELEASE.edition }}</div>
|
|
</a>
|
|
</h1>
|
|
|
|
{# User menu (mobile view) #}
|
|
<div class="navbar-nav flex-row align-items-center d-lg-none">
|
|
{% plugin_navbar %}
|
|
{% include 'inc/light_toggle.html' %}
|
|
{% include 'inc/user_menu.html' %}
|
|
</div>
|
|
|
|
{# Navigation menu #}
|
|
<div class="collapse navbar-collapse" id="sidebar-menu">
|
|
{% nav %}
|
|
</div>
|
|
|
|
</div>
|
|
</aside>
|
|
|
|
{# Top menu #}
|
|
<header class="navbar navbar-expand-md sticky-top d-none d-lg-flex d-print-none">
|
|
<div class="container-fluid">
|
|
|
|
{# User menu (desktop view) #}
|
|
<div class="navbar-nav flex-row align-items-center order-md-last">
|
|
{% plugin_navbar %}
|
|
{% include 'inc/light_toggle.html' %}
|
|
{% include 'inc/user_menu.html' %}
|
|
</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|safe %}
|
|
{% 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 alerts #}
|
|
{% block alerts %}{% endblock %}
|
|
{# /Page alerts #}
|
|
|
|
{# 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 #}
|
|
|
|
{# BS5 pop-up modals #}
|
|
{% block modals %}{% endblock %}
|
|
|
|
</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" aria-label="{% trans "Docs" %}">
|
|
<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" aria-label="{% trans "REST API" %}">
|
|
<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" aria-label="{% trans "REST API documentation" %}">
|
|
<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" aria-label="{% trans "GraphQL API" %}">
|
|
<i title="{% trans "GraphQL API" %}" class="mdi mdi-graphql text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
|
|
</a>
|
|
</li>
|
|
{% endif %}
|
|
|
|
{# Commercial links #}
|
|
{% if settings.RELEASE.features.commercial %}
|
|
{# LinkedIn #}
|
|
<li class="list-inline-item">
|
|
<a href="https://www.linkedin.com/company/netboxlabs/" target="_blank" class="link-secondary" rel="noopener" aria-label="LinkedIn">
|
|
<i title="LinkedIn" class="mdi mdi-linkedin text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
|
|
</a>
|
|
</li>
|
|
{# Support #}
|
|
<li class="list-inline-item">
|
|
<a href="mailto:support@netboxlabs.com" target="_blank" class="link-secondary" rel="noopener" aria-label="{% trans "NetBox Labs Support" %}">
|
|
<i title="{% trans "NetBox Labs Support" %}" class="mdi mdi-lifebuoy text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
|
|
</a>
|
|
</li>
|
|
|
|
{# Community links #}
|
|
{% else %}
|
|
{# GitHub #}
|
|
<li class="list-inline-item">
|
|
<a href="https://github.com/netbox-community/netbox" target="_blank" class="link-secondary" rel="noopener" aria-label="{% trans "Source Code" %}">
|
|
<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" aria-label="{% trans "Community" %}">
|
|
<i title="{% trans "Community" %}" class="mdi mdi-slack text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
|
|
</a>
|
|
</li>
|
|
{% endif %}
|
|
{% endblock footer_links %}
|
|
</ul>
|
|
{# /Footer links #}
|
|
|
|
{# Footer text #}
|
|
<ul class="list-inline list-inline-dots fs-5 mb-0" id="footer-stamp" hx-swap-oob="true">
|
|
<li class="list-inline-item">{% now 'Y-m-d H:i:s T' %}</li>
|
|
<li class="list-inline-item">{{ settings.HOSTNAME }}</li>
|
|
<li class="list-inline-item">{{ settings.RELEASE.name }}</li>
|
|
</ul>
|
|
{# /Footer text #}
|
|
|
|
{% endblock footer %}
|
|
</div>
|
|
</footer>
|
|
{# /Page footer #}
|
|
|
|
{# /Page content #}
|
|
</div>
|
|
|
|
</div>
|
|
{% endblock layout %}
|