jmtrivial/agenda_culturel
4
4
Fork 0
Code Issues 62 Pull Requests 1 Projects 1 Releases Wiki Activity

on améliore l'apparence du menu

Browse Source
This commit is contained in:
Jean-Marie Favreau 2023-11-29 22:40:54 +01:00
parent 2fafc092a2
commit 716748a487
2 changed files with 35 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/agenda_culturel/static/style.scss
View File

@ -93,7 +93,7 @@ details[role="list"] summary + ul li.selected>a:hover {
color: var(--primary-inverse);
}
body>nav {
#main-nav {
box-shadow: 0 1px 0 rgba(115, 130, 140, 0.2);
}
@ -425,8 +425,15 @@ nav>div {
align-items: center;
}
nav#main {
align-content: flex-start;
#main-nav {
display: block;
>nav {
position: absolute;
float: left;
top: 0;
left: 0;
padding-right: 4em;
}
ul, div {
margin: 0 0 auto 0;
@ -436,9 +443,12 @@ nav#main {
/* header */
.header {
float: left;
z-index: 3;
position: relative;
text-align: right;
display: block;
width: 100%;
}
.header ul {
@ -446,11 +456,16 @@ nav#main {
padding: 0;
list-style: none;
overflow: hidden;
width: 100%;
}
.header ul li {
clear: both;
float: right;
padding: .4em .8em;
width: 100%;
a {
width: 100%;
}
}
.header .logo {
@ -555,6 +570,7 @@ nav#main {
float: none;
display: inline-block;
padding: var(--nav-element-spacing-vertical) var(--nav-element-spacing-horizontal);
width: auto;
}
}
}
}

28
src/agenda_culturel/templates/agenda_culturel/page.html
View File

@ -25,18 +25,7 @@
{% load event_extra %}
{% load utils_extra %}
<body>
<nav id="main" class="container-fluid">
<ul>
<li>
<a href="{% url 'home' %}" aria-label="Retour accueil">
<img src="{% static 'images/favicon.svg' %}" />
</a>
</li>
<li>
<a href="{% url 'home' %}" aria-label="Retour accueil">Les nuits énimagmatiques</a>
</li>
</ul>
<div id="main-nav">
<div class="header">
<input class="menu-btn" type="checkbox" id="menu-btn" />
<label class="menu-icon" for="menu-btn">{% picto_from_name "menu" %}</label>
@ -47,7 +36,20 @@
<li><a href="{% url 'ce_mois_ci' %}">Ce mois-ci</a></li>
</ul>
</div>
</nav>
<nav class="container-fluid">
<ul>
<li>
<a href="{% url 'home' %}" aria-label="Retour accueil">
<img src="{% static 'images/favicon.svg' %}" />
</a>
</li>
<li>
<a href="{% url 'home' %}" aria-label="Retour accueil">Les nuits énimagmatiques</a>
</li>
</ul>
</nav>
</div>
<main class="container{% block main-fluid %}{% endblock %}">
{% if messages %}
{% for message in messages %}