navbar to own file
This commit is contained in:
parent
f433da1b20
commit
a89cbdd02a
@ -31,7 +31,6 @@
|
||||
<link rel="icon" href="">
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="{% static 'css/custom.css' %}" media="screen">
|
||||
<!-- <link rel="stylesheet" type="text/css" href="{% static 'css/bootstrap.min.css' %}" media="screen"> -->
|
||||
{% compress css %}
|
||||
<link type="text/x-scss" rel="stylesheet" href="{% static '/scss/base.scss' %}">
|
||||
{% endcompress %}
|
||||
@ -41,107 +40,11 @@
|
||||
</head>
|
||||
<body class="overflow-y-auto font-montserrat bg-body-tertiary">
|
||||
|
||||
<nav id="navbar" class="navbar navbar-expand-lg navbar-dark" style="background-color: #04385c;">
|
||||
<div class="container-fluid">
|
||||
<a href="#" class="navbar-brand mx-auto ms-sm-4 me-sm-5 user-select-none">
|
||||
<img src="{% static 'img/logo-icon-alt.webp' %}" class="me-1" height="45px" alt="Brand Logo">
|
||||
<img src="{% static 'img/logo-text-alt.webp' %}" height="40px" alt="Brand Logo">
|
||||
</a>
|
||||
<button class="navbar-toggler mx-auto my-3 my-sm-0 me-sm-4" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div id="navbarCollapse" class="collapse navbar-collapse mx-4 mx-lg-0 mt-3 mt-lg-0">
|
||||
<ul class="navbar-nav me-auto mb-2 mb-lg-0 fw-bold small">
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link pe-3">Dashboard</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link pe-3 active">Venues & Waters</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link pe-3">Other Page</a>
|
||||
</li>
|
||||
</ul>
|
||||
<hr class="d-lg-none">
|
||||
<ul class="navbar-nav mb-2 mb-lg-0 me-0 me-lg-4 flex-row flex-wrap">
|
||||
<li class="nav-item mb-2 mb-lg-0">
|
||||
<button id="themeSwitcher" class="btn btn-outline-light border-0 border-secondary-subtle d-flex align-items-center justify-content-center me-3">
|
||||
<i class="bi"></i>
|
||||
<span class="d-lg-none ms-2">Theme</span>
|
||||
</button>
|
||||
</li>
|
||||
<li class="nav-item mb-2 mb-lg-0 dropdown position-relative">
|
||||
<button class="btn btn-outline-light border-0 border-secondary-subtle d-flex align-items-center justify-content-center me-3" data-bs-toggle="dropdown">
|
||||
<i class="bi bi-bell"></i>
|
||||
<span class="d-lg-none ms-2">Notifications</span>
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end position-absolute me-3 p-3" style="min-width: 15rem;">
|
||||
<li class="text-center text-body-secondary small">
|
||||
There are no notifications right now
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item mb-2 mb-lg-0 ms-auto ms-lg-0 dropdown position-relative">
|
||||
<button class="btn btn-outline-light rounded-pill border-secondary-subtle d-flex align-items-center justify-content-center me-3" data-bs-toggle="dropdown">
|
||||
<i class="bi bi-person me-2"></i>
|
||||
<span class="d-lg-none me-2">Administrator</span>
|
||||
<i class="bi bi-chevron-down"></i>
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end position-absolute me-3">
|
||||
<li>
|
||||
<a href="" class="dropdown-item">
|
||||
<i class="bi bi-gear me-2"></i>
|
||||
Settings
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="" class="dropdown-item text-danger">
|
||||
<i class="bi bi-box-arrow-right me-2"></i>
|
||||
Logout
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
{% include "includes/navbar.html" %}
|
||||
|
||||
{% block content %}
|
||||
{% endblock %}
|
||||
|
||||
<footer class="d-none bg-dark text-light">
|
||||
<div class="container py-5">
|
||||
<div class="row">
|
||||
<div class="col-lg-4">
|
||||
<h3>
|
||||
<img src="{% static 'img/at-logo.png' %}" width="200px" alt="">
|
||||
</h3>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<h5>Links</h5>
|
||||
<ul class="list-unstyled ps-3">
|
||||
<li>
|
||||
<a href="#" class="text-reset text-decoration-none">Dashboard</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="text-reset text-decoration-none">Venues & Waters</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="text-reset text-decoration-none">Other</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<h5>Contact</h5>
|
||||
<ul>
|
||||
placeholder
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script>
|
||||
const CSRF_MiddlewareToken = "{{ csrf_token }}";
|
||||
const currentUserId = "{{ request.user.id }}";
|
||||
@ -150,10 +53,8 @@
|
||||
<script src="{% static 'js/jquery-3.6.3.min.js' %}"></script>
|
||||
<script src="{% static 'js/jquery.validate.min.js' %}"></script>
|
||||
<script src="{% static 'js/bootstrap.bundle.min.js' %}"></script>
|
||||
<!-- <script src="{% static 'js/custom.js' %}"></script> -->
|
||||
<script src="{% static 'js/api.js' %}"></script>
|
||||
<script src="{% static 'js/base.js' %}"></script>
|
||||
{% block scripts %}
|
||||
{% endblock scripts %}
|
||||
{% block scripts %} {% endblock %}
|
||||
</body>
|
||||
</html>
|
||||
67
templates/includes/navbar.html
Normal file
67
templates/includes/navbar.html
Normal file
@ -0,0 +1,67 @@
|
||||
{% load static %}
|
||||
|
||||
<nav id="navbar" class="navbar navbar-expand-lg navbar-dark" style="background-color: #04385c;">
|
||||
<div class="container-fluid">
|
||||
<a href="#" class="navbar-brand mx-auto ms-sm-4 me-sm-5 user-select-none">
|
||||
<img src="{% static 'img/logo-icon-alt.webp' %}" class="me-1" height="45px" alt="Brand Logo">
|
||||
<img src="{% static 'img/logo-text-alt.webp' %}" height="40px" alt="Brand Logo">
|
||||
</a>
|
||||
<button class="navbar-toggler mx-auto my-3 my-sm-0 me-sm-4" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div id="navbarCollapse" class="collapse navbar-collapse mx-4 mx-lg-0 mt-3 mt-lg-0">
|
||||
<ul class="navbar-nav me-auto mb-2 mb-lg-0 fw-bold small">
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link pe-3">Dashboard</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link pe-3 active">Venues & Waters</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link pe-3">Other Page</a>
|
||||
</li>
|
||||
</ul>
|
||||
<hr class="d-lg-none">
|
||||
<ul class="navbar-nav mb-2 mb-lg-0 me-0 me-lg-4 flex-row flex-wrap">
|
||||
<li class="nav-item mb-2 mb-lg-0">
|
||||
<button id="themeSwitcher" class="btn btn-outline-light border-0 border-secondary-subtle d-flex align-items-center justify-content-center me-3">
|
||||
<i class="bi"></i>
|
||||
<span class="d-lg-none ms-2">Theme</span>
|
||||
</button>
|
||||
</li>
|
||||
<li class="nav-item mb-2 mb-lg-0 dropdown position-relative">
|
||||
<button class="btn btn-outline-light border-0 border-secondary-subtle d-flex align-items-center justify-content-center me-3" data-bs-toggle="dropdown">
|
||||
<i class="bi bi-bell"></i>
|
||||
<span class="d-lg-none ms-2">Notifications</span>
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end position-absolute me-3 p-3" style="min-width: 15rem;">
|
||||
<li class="text-center text-body-secondary small">
|
||||
There are no notifications right now
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item mb-2 mb-lg-0 ms-auto ms-lg-0 dropdown position-relative">
|
||||
<button class="btn btn-outline-light rounded-pill border-secondary-subtle d-flex align-items-center justify-content-center me-3" data-bs-toggle="dropdown">
|
||||
<i class="bi bi-person me-2"></i>
|
||||
<span class="d-lg-none me-2">Administrator</span>
|
||||
<i class="bi bi-chevron-down"></i>
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end position-absolute me-3">
|
||||
<li>
|
||||
<a href="" class="dropdown-item">
|
||||
<i class="bi bi-gear me-2"></i>
|
||||
Settings
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="" class="dropdown-item text-danger">
|
||||
<i class="bi bi-box-arrow-right me-2"></i>
|
||||
Logout
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
Loading…
x
Reference in New Issue
Block a user