Compare commits

...

5 Commits

Author SHA1 Message Date
4fff0e49e2 Remove footer left-margin 2023-10-01 15:01:11 +02:00
0bbac278c6 Merge branch 'better-footer-implementation' 2023-10-01 14:49:00 +02:00
4542739a48 Revert "I may have fixed the broken scrolling..."
This reverts commit 48f1d7f675.
2023-10-01 14:48:16 +02:00
2c16625162 Revert "Profile pictures: CSS fixed"
This reverts commit 37ce178b21.
2023-10-01 14:47:49 +02:00
031f2af91f This solution might be simpler...
...and might not need a complete rewrite of the whole CSS
2023-09-30 00:33:09 +02:00
5 changed files with 56 additions and 45 deletions

View File

@ -13,5 +13,10 @@
overflow: hidden;
min-width: 90vw;
position: fixed;
transition: all 0.5s ease;
}
input:checked#slide-sidebar~#content-container {
position: initial;
}
}

View File

@ -81,13 +81,17 @@
font-family: var(--font-family);
}
body {
overflow-x: hidden;
}
/** Hide scrollbars (needed on Chromium) */
*::-webkit-scrollbar {
/** Hide scrollbars (deeply needed on Chromium) */
::-webkit-scrollbar {
display: none;
}
* {
:root {
-ms-overflow-style: none;
scrollbar-width: none;
}
@ -139,16 +143,10 @@ body {
transition: left 0.5s ease;
padding: 0 25px;
max-height: 100vh;
display: flex;
flex-direction: column;
overflow: hidden;
}
#content {
margin-bottom: 50px;
flex: 1;
}
#footer {
@ -187,6 +185,9 @@ body {
top: 0;
left: 0;
bottom: 0;
-moz-transition: width 0.5s ease;
transition: width 0.5s ease;
}
#slide {
@ -203,15 +204,13 @@ body {
input:checked#slide-sidebar~#content-container {
left: 0;
overflow: unset;
}
input:checked#slide-sidebar~#content-container>#content {
overflow-y: scroll;
margin-left: 0;
}
input:checked#slide-sidebar~#footer {
left: 0;
overflow: unset;
margin-left: 0;
}
input:checked#slide-sidebar~#sidebar {
@ -266,17 +265,15 @@ section#users {
.user-profile-picture {
color: var(--color-mantle);
position: absolute;
left: 0;
}
.user-profile {
display: inline-flex;
margin-left: 30px;
}
.user-profile .user-profile-picture {
position: absolute;
left: 30px;
}
.dropdown {
@ -409,6 +406,9 @@ img.partition-thumbnail {
margin: 5px;
border-radius: 3px;
-moz-transition: width 0.5s ease;
transition: width 0.5s ease;
}
button#logout,
@ -679,3 +679,7 @@ td {
.liste {
text-align: left;
}
.x-scrollable {
overflow-x: auto;
}

View File

@ -12,32 +12,34 @@
<div class="button">Voir toutes les partitions</div>
</a>
</div>
<table>
<thead>
<tr>
<th scope="col">Utilisateur</th>
<th scope="col">Albums</th>
<th scope="col">Partitions</th>
<th scope="col">Privilèges</th>
</tr>
</thead>
<tbody>
{% for user in users %}
<tr>
<td style="position:relative">
<div class="user-profile">
<div class="user-profile-picture" style="background-color:{{ user.color }};"
title="{{ user.username }}">
{{ user.username[0] | upper }}
<div class="x-scrollable">
<table>
<thead>
<tr>
<th scope="col">Utilisateur</th>
<th scope="col">Albums</th>
<th scope="col">Partitions</th>
<th scope="col">Privilèges</th>
</tr>
</thead>
<tbody>
{% for user in users %}
<tr>
<td>
<div class="user-profile">
<div class="user-profile-picture" style="background-color:{{ user.color }};"
title="{{ user.username }}">
{{ user.username[0] | upper }}
</div>
<div class="table-username">{{ user.username }}</div>
</div>
<div class="table-username">{{ user.username }}</div>
</div>
</td>
<td>{{ user.albums | length }}</td>
<td>{{ user.partitions | length }}</td>
<td>{% if user.access_level != 1 %}❌{% else %}✅{% endif %}</td>
</tr>
{% endfor %}
</tbody>
</table>
</td>
<td>{{ user.albums | length }}</td>
<td>{{ user.partitions | length }}</td>
<td>{% if user.access_level != 1 %}❌{% else %}✅{% endif %}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endblock %}

View File

@ -110,7 +110,7 @@
</button></a><br/>
{% endif %}
<div class="user">
<div class="user-profile-picture" style="background-color:{{ user.color }}; position:inherit;"
<div class="user-profile-picture" style="background-color:{{ user.color }};"
title="{{ user.username }}">
{{ user.username[0] | upper }}
</div>

View File

@ -11,7 +11,7 @@
<td>
Responsable de l'ajout
</td>
<td style="position:absolute">
<td>
{% if user is not none %}
<div class="user-profile"><!-- Completely messy html for this -->
<div class="table-username">{{ user.username }}</div>