You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
94 lines
4.1 KiB
94 lines
4.1 KiB
<!DOCTYPE html> |
|
<html lang="fr"> |
|
<head> |
|
<meta charset="UTF-8"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> |
|
<title>CrossApp</title> |
|
{% load static %} |
|
<link rel="icon" type="image/png" href="{% static 'person-running-solid-full.png' %}"> |
|
<!-- SB Admin 2 Bootstrap CSS --> |
|
<link href="{% static 'sb-admin-2/sb-admin-2.min.css' %}" rel="stylesheet"> |
|
<!-- Font Awesome --> |
|
<link href="{% static 'fontawesomefree/css/fontawesome.css' %}" rel="stylesheet"> |
|
<link href="{% static 'fontawesomefree/css/brands.css' %}" rel="stylesheet"> |
|
<link href="{% static 'fontawesomefree/css/solid.css' %}" rel="stylesheet"> |
|
<!-- Custom styles --> |
|
{% block extra_css %}{% endblock %} |
|
</head> |
|
<body id="page-top"> |
|
<!-- Page Wrapper --> |
|
<div id="wrapper" class="d-flex"> |
|
<!-- Sidebar (Accordion Navigation) --> |
|
<nav class="bg-gradient-primary sidebar sidebar-dark accordion" id="accordionSidebar"> |
|
<!-- Sidebar - Brand --> |
|
<a class="sidebar-brand d-flex align-items-center justify-content-center" href="/"> |
|
<div class="sidebar-brand-icon rotate-n-15"> |
|
<i class="fas fa-running"></i> |
|
</div> |
|
<div class="sidebar-brand-text mx-3">CrossApp</title></div> |
|
</a> |
|
<!-- Divider --> |
|
<hr class="sidebar-divider my-0"> |
|
<!-- Nav Item - Dashboard --> |
|
<li class="nav-item active"> |
|
<a class="nav-link" href="/"> |
|
<i class="fas fa-fw fa-tachometer-alt"></i> |
|
<span>Dashboard</span></a> |
|
</li> |
|
<!-- Nav Item - Dossards --> |
|
<li class="nav-item active"> |
|
<a class="nav-link" href="{% url 'dossards' %}"> |
|
<i class="fas fa-qrcode"></i> |
|
<span>Dossards</span></a> |
|
</li> |
|
<!-- Divider --> |
|
<hr class="sidebar-divider d-none d-md-block"> |
|
<!-- Logout Button --> |
|
<li class="nav-item"> |
|
<form method="post" action="{% url 'logout' %}" style="margin:0;"> |
|
{% csrf_token %} |
|
<button type="submit" class="nav-link btn btn-link text-left w-100" style="color:#fff;"> |
|
<i class="fas fa-sign-out-alt"></i> |
|
<span>Déconnexion</span> |
|
</button> |
|
</form> |
|
</li> |
|
</nav> |
|
<!-- Content Wrapper --> |
|
<div id="content-wrapper" class="flex-fill"> |
|
<!-- Topbar déplacée ici --> |
|
<nav class="navbar navbar-expand navbar-light bg-white topbar mb-4 static-top shadow"> |
|
<!-- Hamburger Sidebar Toggle (Topbar) --> |
|
<button id="sidebarToggleTop" class="btn btn-link d-md-none rounded-circle mr-3"> |
|
<i class="fa fa-bars"></i> |
|
</button> |
|
<span class="navbar-brand font-weight-bold">{{ title }}</span> |
|
</nav> |
|
{% block content %}{% endblock %} |
|
</div> |
|
</div> |
|
<!-- jQuery (nécessaire pour Bootstrap) --> |
|
<script src="{% static 'jquery/jquery-3.6.0.min.js' %}"></script> |
|
<!-- Bootstrap core JavaScript --> |
|
<script src="{% static 'bootstrap/bootstrap.bundle.min.js' %}"></script> |
|
<!-- SB Admin 2 JS --> |
|
<script src="{% static 'sb-admin-2/sb-admin-2.min.js' %}"></script> |
|
<script> |
|
// Masquer la sidebar automatiquement si l'écran devient trop petit |
|
function autoHideSidebar() { |
|
if (window.innerWidth < 768) { |
|
document.body.classList.add('sidebar-toggled'); |
|
var sidebar = document.querySelector('.sidebar'); |
|
if (sidebar) sidebar.classList.add('toggled'); |
|
} else { |
|
document.body.classList.remove('sidebar-toggled'); |
|
var sidebar = document.querySelector('.sidebar'); |
|
if (sidebar) sidebar.classList.remove('toggled'); |
|
} |
|
} |
|
window.addEventListener('resize', autoHideSidebar); |
|
window.addEventListener('DOMContentLoaded', autoHideSidebar); |
|
</script> |
|
{% block extra_js %}{% endblock %} |
|
</body> |
|
</html>
|
|
|