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

Style du menu des departements

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> <style>
:root { :root {
--bg: #191919; --bg: #191919;
@ -8,25 +8,21 @@
--hl: #8080ff; --hl: #8080ff;
} }
* { body {
background: var(--bg); background: var(--bg);
padding-left: 5px; margin: 0px;
padding-right: 5px; padding: 0px;
font-family: "ubuntu", "sans"; font-family: "ubuntu", "sans";
color: var(--fg); color: var(--fg);
} }
header { header {
background: var(--hl); background: var(--hl);
display: inline-block;
font-size: 250%; font-size: 250%;
width: 100%;
font-weight: lighter; font-weight: lighter;
text-align: center; 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 { main {
@ -97,18 +93,52 @@
font-size: 80%; font-size: 80%;
} }
button, input { input[type="submit"]{
background: var(--bg-light); background: var(--bg-light);
border-style: solid; border-style: solid;
border-width: 1px; border-width: 1px;
border-color: var(--bg); border-color: var(--bg);
padding: 10px; padding: 20px;
border-radius: 10px; border-radius: 10px;
transition: background 0.1s;
}
input[type="submit"]:hover {
background: var(--bg-dark);
} }
input checkbox { input[type="checkbox"] {
margin-bottom: 5px; 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 { .done {
background: var(--bg-dark); background: var(--bg-dark);
@ -128,4 +158,4 @@
@media screen and (max-width: 769px) { @media screen and (max-width: 769px) {
} }
</style> </style>

22
templates/dept-select.html
View File

@ -9,16 +9,20 @@
<body> <body>
{% include "base.html" %} {% include "base.html" %}
<main> <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"> <form action="/app/free-rooms" method="get">
<input type="submit" value="Valider"> <div class="flex">
<br> <input type="submit" value="Valider">
{% for d in dept_list : %} </div>
<div> <div class="flex">
<input type="checkbox" id="{{ d.ident }}" name="dept" value="{{ d.ident }}"> {% for d in dept_list : %}
<label for="{{ d.ident }}">{{ d.name }}</label> <div>
</div> <input type="checkbox" id="{{ d.ident }}" name="dept" value="{{ d.ident }}">
{% endfor %} <label for="{{ d.ident }}">{{ d.name }}</label>
</div>
{% endfor %}
</div>
</form> </form>
</main> </main>
<footer></footer> <footer></footer>