Add navbar
This commit is contained in:
parent
4d4b83f4d4
commit
1cde62b74d
|
@ -6,8 +6,6 @@
|
|||
{% block title %}Marketplace{% endblock title %}
|
||||
|
||||
{% block main %}
|
||||
<a href="{% url "colloscope.dashboard" %}">Retour au tableau de bord</a>
|
||||
|
||||
<h1>Marketplace</h1>
|
||||
|
||||
Bienvenue sur le marketplace.
|
||||
|
|
|
@ -2,12 +2,10 @@
|
|||
|
||||
{% block title %}Sélection du profil{% endblock title %}
|
||||
|
||||
{% block header %}
|
||||
<h1>Sélection du profil</h1>
|
||||
{% endblock header %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
|
||||
<h1>Sélection du profil</h1>
|
||||
|
||||
Vous êtes connecté. Votre compte correspond à deux profils :
|
||||
<ul>
|
||||
<li>en tant que colleur : {{ profil.colleur }} ; Classes : {{ profil.colleur.get_classes|join:"; " }}</li>
|
||||
|
|
|
@ -9,13 +9,9 @@
|
|||
<link href="{% static 'table.css' %}" rel="stylesheet" type="text/css">
|
||||
{% endblock head %}
|
||||
|
||||
{% block header %}
|
||||
<h1>Colloscope</h1>
|
||||
{% endblock header %}
|
||||
|
||||
|
||||
{% block main %}
|
||||
|
||||
<h1>Colloscope</h1>
|
||||
|
||||
<p>
|
||||
Lycée : {{ term.cls.school.description }}. Classe : {{ term.cls.description }}. <a href="dashboard.html">Retour au tableau de bord</a>
|
||||
</p>
|
||||
|
|
|
@ -2,12 +2,10 @@
|
|||
|
||||
{% block title %}Sélection du profil{% endblock title %}
|
||||
|
||||
{% block header %}
|
||||
<h1>Sélection du profil</h1>
|
||||
{% endblock header %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
|
||||
<h1>Sélection du profil</h1>
|
||||
|
||||
Vous êtes connecté, mais votre compte n'est associé à aucun profil. Veuillez contacter le webmestre à l'adresse <a href="mailto:valentin@mp2i-vms.fr">valentin@mp2i-vms.fr</a>.
|
||||
|
||||
{% endblock main %}
|
||||
|
|
|
@ -4,7 +4,6 @@
|
|||
|
||||
body {
|
||||
font-family: sans-serif;
|
||||
background-color: #fafafa;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
@ -36,6 +35,49 @@ header .bandeau button:active {
|
|||
background-color: darkgoldenrod;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
background-color: #eee;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.navbar .block {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 400px)
|
||||
{
|
||||
.navbar {
|
||||
padding: 0 10px;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.navbar .block {
|
||||
flex-direction: row;
|
||||
gap: 0 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar a:link, .navbar a:visited {
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.navbar .link {
|
||||
background: none;
|
||||
border: none;
|
||||
font: inherit;
|
||||
padding: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.navbar .link:hover {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
main {
|
||||
margin: 20px auto;
|
||||
width: clamp(350px, 60%, 1200px);
|
||||
|
@ -47,6 +89,34 @@ h1 {
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
form.login table {
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
form.login input[type=text], form.login input[type=password] {
|
||||
padding: 5px;
|
||||
border: none;
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
form.login button {
|
||||
border: none;
|
||||
padding: 10px;
|
||||
background-color: dodgerblue;
|
||||
border-radius: 5px;
|
||||
color: white;
|
||||
display: block;
|
||||
margin: 15px auto;
|
||||
}
|
||||
|
||||
form.login button:hover {
|
||||
background-color: #0483ff;
|
||||
}
|
||||
|
||||
form.login button:active {
|
||||
background-color: #0077ea;
|
||||
}
|
||||
|
||||
nav.semaine {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
|
|
@ -5,28 +5,73 @@
|
|||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>{% block title %}{% endblock title %}</title>
|
||||
<link href="{% static 'unified-navigator/navigator.css' %}" rel="stylesheet" type="text/css">
|
||||
<link href="{% static 'main.css' %}" rel="stylesheet" type="text/css">
|
||||
<script src="https://kit.fontawesome.com/0fd87250ec.js" crossorigin="anonymous"></script>
|
||||
{% block head %}{% endblock head %}
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
{% if request.user.is_authenticated %}
|
||||
<div class="bandeau">
|
||||
Vous êtes connecté avec le compte <b>{{ user.username }}</b>.
|
||||
{% if request.session.profile == "student" %}
|
||||
Profil actuel : étudiant.
|
||||
{% elif request.session.profile == "colleur" %}
|
||||
Profil actuel : colleur.
|
||||
{% else %}
|
||||
Pas de profil.
|
||||
{% endif %}
|
||||
<form action="{% url 'logout' %}" method="post">
|
||||
{% csrf_token %}
|
||||
<button type="submit">Se déconnecter</button>
|
||||
</form>
|
||||
<script>
|
||||
function navigator_toggleMenu() {
|
||||
if (document.body.clientWidth > 600)
|
||||
return document.location = "https://mp2i-vms.fr"
|
||||
|
||||
if (document.getElementById("menu-sec").classList.contains("hidden")) {
|
||||
document.getElementById("menu-sec").classList.remove("hidden");
|
||||
document.getElementById("navigator-dropdown-indicator").className = "fa-solid fa-caret-up";
|
||||
} else {
|
||||
document.getElementById("menu-sec").classList.add("hidden");
|
||||
document.getElementById("navigator-dropdown-indicator").className = "fa-solid fa-caret-down";
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<div class="unified_navigator">
|
||||
<div class="nav-container">
|
||||
<div class="logo-wrapper" onclick="navigator_toggleMenu();">
|
||||
<a class="logo">
|
||||
<img src="{% static 'unified-navigator/icon.png' %}" alt="logo"><strong>mp2i-vms.fr</strong>
|
||||
</a>
|
||||
<i id="navigator-dropdown-indicator" class="fa-solid fa-caret-down"></i>
|
||||
</div>
|
||||
<div class="menu-wrapper hidden" id="menu-sec">
|
||||
<div class="link"><a href="https://mp2i-vms.fr/pages.html"><i class="fa-solid fa-house"></i> Pages personnelles</a></div>
|
||||
<div class="link"><a href="https://git.mp2i-vms.fr"><i class="fa-brands fa-git-alt"></i> Git</a></div>
|
||||
<div class="link"><a href="https://play.mp2i-vms.fr"><i class="fa-solid fa-cubes"></i> Minecraft</a></div>
|
||||
<div class="link"><a href="{% url "home" %}"><i class="fa-solid fa-book"></i> Colles</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="navbar">
|
||||
<div class="block">
|
||||
{% if request.user.is_authenticated %}
|
||||
<a href="{% url "colloscope.dashboard" %}">
|
||||
<div class="link"><i class="fa-solid fa-rocket"></i> Tableau de bord</div>
|
||||
</a>
|
||||
<a href="{% url "colloscope.table" %}">
|
||||
<div class="link"><i class="fa-solid fa-calendar"></i> Colloscope</div>
|
||||
</a>
|
||||
<a href="{% url "colloscope.marketplace" %}">
|
||||
<div class="link"><i class="fa-solid fa-shop"></i> Marketplace</div>
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="block">
|
||||
{% if request.user.is_authenticated %}
|
||||
<form action="{% url 'logout' %}" method="post">
|
||||
{% csrf_token %}
|
||||
<button class="link" type="submit" href="{% url "login" %}">
|
||||
<i class="fa-solid fa-right-from-bracket"></i> Se déconnecter
|
||||
</button>
|
||||
</form>
|
||||
{% else %}
|
||||
<a href="{% url "login" %}">
|
||||
<div class="link right"><i class="fa-solid fa-right-from-bracket"></i> Se connecter</div>
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% block header %}{% endblock header %}
|
||||
</header>
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
<form method="post" action="{% url 'login' %}">
|
||||
<form class="login" method="post" action="{% url 'login' %}">
|
||||
{% csrf_token %}
|
||||
<table>
|
||||
<tr>
|
||||
|
@ -31,8 +31,7 @@
|
|||
<td>{{ form.password }}</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<input type="submit" value="Se connecter">
|
||||
<button type="submit">Se connecter</button>
|
||||
<input type="hidden" name="next" value="{{ next }}">
|
||||
</form>
|
||||
|
||||
|
|
Loading…
Reference in New Issue