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

Les tailles sont proportionnelles au viewport

This commit is contained in:
theo@manjaro 2024-03-20 20:41:07 +01:00
parent 057285717b
commit f79250216b
2 changed files with 51 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
static/billboardstyle.css
View File

@ -5,58 +5,54 @@
--special: #c09f80; --special: #c09f80;
} }
main {
display: grid;
grid-template-rows: 2fr 1fr 5fr 1fr;
}
body { body {
background: var(--bg); background: var(--bg);
color: var(--fg); color: var(--fg);
font-family: "ubuntu", sans-serif; font-family: "ubuntu", sans-serif;
font-size: 200%;
margin: 0px; margin: 0px;
} }
h1, h2 { h1, h2 {
text-align: center; text-align: center;
font-size: 7vh;
} }
h2 { h2 {
font-size: 90%; font-size: 6vh;
font-weight: normal; font-weight: normal;
margin-bottom: 8vh;
} }
.slider { .slider { overflow: hidden;
overflow: hidden;
} }
.slide-track { .slide-track {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
gap: 50px; gap: 3vw;
animation: scroll 40s linear infinite; animation: scroll 40s linear infinite;
width: 750%; /* Pas bô, mais on va faire avec en attendant... */ width: 3000vh; /* Pas bô, mais on va faire avec en attendant... */
} }
.room { .room {
text-align: center; text-align: center;
background: var(--bg-dark); background: var(--bg-dark);
border-style: solid; border-style: solid;
border-width: 1px; border-width: 1vw;
border-color: var(--bg-dark); border-color: var(--bg-dark);
border-radius: 10px; border-radius: 3vw;
padding: 10px; padding: 2vw;
color: var(--bg); color: var(--bg);
font-size: 8vh;
} }
@keyframes scroll { @keyframes scroll {
0% { transform: translateX(0); } 0% { transform: translateX(0); }
100% { transform: translateX(calc(-250px * 7)); } 100% { transform: translateX(calc(-25vw * 7)); }
} }
footer { footer {
margin-top: 10px; margin-top: 10vh;
font-size: 50%; font-size: 4vh;
text-align: center; text-align: center;
} }

78
templates/billboard.html
View File

@ -7,46 +7,44 @@
<meta name="viewport" content="width=300, initial-scale=1" /> <meta name="viewport" content="width=300, initial-scale=1" />
</head> </head>
<body> <body>
<main> <h1><b>Salles disponibles</b></h1>
<h1><b>Salles disponibles</b></h1> <h2>{{ depts_str }}</h2>
<h2>{{ depts_str }}</h2> <div class="slider">
<div class="slider"> <div class="slide-track">
<div class="slide-track"> {% if favs: %}
{% if favs: %} <!-- Afficher les favoris -->
<!-- Afficher les favoris --> <!-- Deux fois pour que l'animation boucle -->
<!-- Deux fois pour que l'animation boucle --> {% for i in range(2) : %}
{% for i in range(2) : %} {% if favs_free_rooms|length > 0 : %}
{% if favs_free_rooms|length > 0 : %} {% for room in favs_free_rooms : %}
{% for room in favs_free_rooms : %} <div class="room">
<div class="room"> <b>{{ room.name }}</b> {% if DEBUG :%}( {{ room.id }} ){% endif %}
<b>{{ room.name }}</b> {% if DEBUG :%}( {{ room.id }} ){% endif %} {% if not(room.noend) : %}
{% if not(room.noend) : %} <p class=details>Jusqu'à {{ frooms_disp[room.name]["end"] }}</p>
<p class=details>Jusqu'à {{ frooms_disp[room.name]["end"] }}</p> {% endif %}
{% endif %} </div>
</div> {% endfor %}
{% endfor %} {% endif %}
{% endif %} {% endfor %}
{% endfor %} {% else %}
{% else %} <!-- Si les favoris ne sont pas définis, afficher les salles classiques -->
<!-- Si les favoris ne sont pas définis, afficher les salles classiques --> {% for i in range(2):%}
{% for i in range(2):%} {% if free_rooms|length>0 %}
{% if free_rooms|length>0 %} {% for room in free_rooms: %}
{% for room in free_rooms: %} <div class="room">
<div class="room"> <b>{{ room.name }}</b> {% if DEBUG : %}( {{ room.id }} ){% endif %}
<b>{{ room.name }}</b> {% if DEBUG : %}( {{ room.id }} ){% endif %} {% if not room.noend : %}
{% if not room.noend : %} <p class=details>Jusqu'à {{ frooms_disp[room.name]["end"] }}</p>
<p class=details>Jusqu'à {{ frooms_disp[room.name]["end"] }}</p> {% endif %}
{% endif %} </div>
</div> {% endfor %}
{% endfor %} {% endif %}
{% endif %} {% endfor %}
{% endfor %} {% endif %}
{% endif %}
</div>
</div> </div>
<footer> </div>
Propulsé par UniSquat : <a href="https://unisquat.alwaysdata.net">https://unisquat.alwaysdata.net</a> <footer>
</footer> Propulsé par UniSquat : <a href="https://unisquat.alwaysdata.net">https://unisquat.alwaysdata.net</a>
</main> </footer>
</body> </body>
</html> </html>