Wantoo/UniSquat_Python
5
2
Fork 0
Code Issues 2 Pull Requests Projects Releases Wiki Activity

Style du menu des departements

Browse Source
This commit is contained in:
theo@manjaro 2022-05-12 16:58:13 +02:00
parent 560868a7b8
commit 44483fad6a
2 changed files with 59 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
templates/base.html
View File

@ -1,4 +1,4 @@
<header>UniSquat</header>
<div class="flex"><header>UniSquat</header></div>
<style>
:root {
--bg: #191919;
@ -8,25 +8,21 @@
--hl: #8080ff;
}
* {
body {
background: var(--bg);
padding-left: 5px;
padding-right: 5px;
margin: 0px;
padding: 0px;
font-family: "ubuntu", "sans";
color: var(--fg);
}
header {
background: var(--hl);
display: inline-block;
font-size: 250%;
width: 100%;
font-weight: lighter;
text-align: center;
margin: 10px;
margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
margin-top: calc(-50vw + 50%);
padding-top: 20px;
padding-bottom: 5px;
}
main {
@ -97,18 +93,52 @@
font-size: 80%;
}
button, input {
input[type="submit"]{
background: var(--bg-light);
border-style: solid;
border-width: 1px;
border-color: var(--bg);
padding: 10px;
padding: 20px;
border-radius: 10px;
transition: background 0.1s;
}
input[type="submit"]:hover {
background: var(--bg-dark);
}
input checkbox {
margin-bottom: 5px;
}
input[type="checkbox"] {
display: none;
width: 0px;
height: 0px;
}
.flex {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
input[type="checkbox"]:hover + label {
background: var(--bg-dark);
}
input[type="checkbox"]:checked + label {
background: var(--hl);
}
input[type="checkbox"] + label {
background: var(--bg-light);
transition: background 0.1s;
display: inline-block;
width: 200px;
height: 80px;
padding: 10px;
margin: 10px;
text-align: center;
border-radius: 15px;
box-shadow: 5px 5px black;
}
.done {
background: var(--bg-dark);
@ -128,4 +158,4 @@
@media screen and (max-width: 769px) {
}
</style>
</style>

22
templates/dept-select.html
View File

@ -9,16 +9,20 @@
<body>
{% include "base.html" %}
<main>
Sélectionnez des départements dans la liste :
<div class="flex"><p>Sélectionnez des départements dans la liste :</p></div>
<form action="/app/free-rooms" method="get">
<input type="submit" value="Valider">
<br>
{% for d in dept_list : %}
<div>
<input type="checkbox" id="{{ d.ident }}" name="dept" value="{{ d.ident }}">
<label for="{{ d.ident }}">{{ d.name }}</label>
</div>
{% endfor %}
<div class="flex">
<input type="submit" value="Valider">
</div>
<div class="flex">
{% for d in dept_list : %}
<div>
<input type="checkbox" id="{{ d.ident }}" name="dept" value="{{ d.ident }}">
<label for="{{ d.ident }}">{{ d.name }}</label>
</div>
{% endfor %}
</div>
</form>
</main>
<footer></footer>