fix: various padding, layouts and visual issues

- fixed padding in the tfe.php page
- fixed the layout in admin/index.php toolbar top
- the gap issued with the table theader
- rearranged button order in the toolbar top
This commit is contained in:
Pontoporeia
2026-07-08 13:09:35 +02:00
parent a4cfe4356f
commit 30f901f1ed
4 changed files with 1465 additions and 1475 deletions
+23 -28
View File
@@ -51,7 +51,6 @@
flex: 1;
min-height: 0;
overflow-y: auto;
padding: var(--space-s) var(--space-m) var(--space-xl);
width: 100%;
background: linear-gradient(
180deg,
@@ -104,9 +103,7 @@
border-radius: var(--radius);
color: var(--text-secondary);
text-decoration: none;
transition:
background 0.15s,
color 0.15s;
transition: background 0.15s, color 0.15s;
flex-shrink: 0;
vertical-align: middle;
margin-right: var(--space-2xs);
@@ -382,10 +379,7 @@ th.admin-ap-col {
color: var(--text-secondary);
cursor: pointer;
text-decoration: none;
transition:
background 0.15s,
color 0.15s,
border-color 0.15s;
transition: background 0.15s, color 0.15s, border-color 0.15s;
line-height: 1;
}
@@ -887,42 +881,46 @@ th.admin-ap-col {
}
/* ── List page toolbar (theses index — single-line search) ─────────────── */
.admin-list-toolbar--list {
display: flex;
flex-direction: column;
gap: var(--space-s);
padding: 2ch;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr 1fr;
gap: 0px 0px;
grid-template-areas:
"header"
"filters";
}
.admin-list-toolbar--list .admin-toolbar-top {
display: flex;
justify-content: space-between;
align-items: center;
gap: var(--space-m);
grid-area: header;
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr;
gap: 0px 0px;
grid-template-areas: "header edit";
}
.admin-list-toolbar--list .admin-toolbar-title-row {
display: flex;
align-items: center;
gap: var(--space-m);
}
.admin-list-toolbar--list .admin-toolbar-title-row h1 {
.admin-toolbar-top h1 {
grid-area: header;
margin: 0;
white-space: nowrap;
}
.admin-list-toolbar--list .admin-toolbar-top .admin-btn-group {
.admin-btn-group {
grid-area: edit;
display: flex;
gap: var(--space-2xs);
flex-wrap: wrap;
align-items: center;
}
.admin-list-toolbar--list .admin-filters {
grid-area: filters;
display: flex;
flex-direction: row;
gap: var(--space-xs);
align-items: center;
margin-bottom: 0;
}
@@ -942,7 +940,6 @@ th.admin-ap-col {
.admin-btn-group {
display: flex;
align-items: center;
gap: var(--space-xs);
flex-wrap: wrap;
}
@@ -1751,9 +1748,7 @@ th.admin-ap-col {
font-size: var(--step--1);
font-weight: 400;
text-decoration: none;
transition:
border-color 0.15s,
color 0.15s;
transition: border-color 0.15s, color 0.15s;
}
.admin-body .pagination-btn:hover:not(.disabled) {
+3 -3
View File
@@ -63,16 +63,16 @@ main * {
/* Global heading scale — used by admin + public pages */
h1 {
font-size: var(--step-5);
font-size: var(--step-4);
}
h2 {
font-size: var(--step-3);
}
h3 {
font-size: var(--step-1);
font-size: var(--step-2);
}
h4 {
font-size: var(--step-0);
font-size: var(--step-1);
}
h5 {
font-size: var(--step--1);
+8 -11
View File
@@ -7,7 +7,7 @@
flex: 1;
min-height: 0;
overflow: hidden;
padding: var(--space-l) var(--space-m) 0;
padding: 0 var(--space-m) 0 var(--space-m);
}
/* Stacked article layout — fills main height */
@@ -35,23 +35,20 @@
flex: 1;
min-height: 0;
}
/* Left column: stacks author, title, meta, synopsis — scrolls independently */
.tfe-left-column {
.tfe-left-column, .tfe-right-column {
display: flex;
flex-direction: column;
gap: var(--space-m);
overflow-y: auto;
min-width: 0;
padding-top: var(--space-l);
padding-bottom: var(--space-xl);
}
/* Right column: holds files — scrolls independently */
.tfe-right-column {
display: flex;
flex-direction: column;
overflow-y: auto;
min-width: 0;
/* Left column: stacks author, title, meta, synopsis — scrolls independently */
.tfe-left-column {
gap: var(--space-m);
/* to space the edge of the text and the scrollbar */
padding-right: 0.5ch;
}
/* Files container inside right column */
+15 -17
View File
@@ -4,7 +4,6 @@
<!-- Title + filters + stats + import all in one toolbar row -->
<div class="admin-list-toolbar admin-list-toolbar--list">
<div class="admin-toolbar-top">
<div class="admin-toolbar-title-row">
<h1>Liste des TFE</h1>
<div class="admin-stats">
<fieldset class="admin-stat">
@@ -21,22 +20,6 @@
</fieldset>
</div>
</div>
<div class="admin-btn-group">
<a href="/admin/add.php" class="btn btn--primary btn--sm"><?= icon('plus-circle') ?> Ajouter un TFE</a>
<?php if ($trashCount > 0): ?>
<a href="/admin/index.php?tab=trash" class="btn btn--sm <?= $tab === 'trash' ? 'btn--primary' : 'btn--secondary' ?>">
Corbeille (<?= $trashCount ?>)
</a>
<?php endif; ?>
<a href="/admin/cleanup.php" class="btn btn--sm btn--secondary">
<?= icon('trash') ?> Nettoyer<?= $tmpTotalCount > 0 ? " ($tmpTotalCount)" : '' ?>
</a>
<button type="button" class="btn btn--primary btn--sm" id="import-dialog-btn"
onclick="document.getElementById('import-dialog').showModal(); window.XamxamInitFilePonds()">
<?= icon('tray-arrow-up') ?> Importer
</button>
</div>
</div>
<form id="admin-filter-form" class="admin-filters" method="get" action="/admin/"
hx-get="/admin/"
@@ -74,6 +57,21 @@
<?php if ($searchQuery || $yearFilter || $orientationFilter || $apFilter): ?>
<a href="/admin/" class="btn btn--secondary btn--sm admin-filters-reset">&#x2715; Réinitialiser</a>
<?php endif; ?>
<div class="admin-btn-group">
<a href="/admin/add.php" class="btn btn--primary btn--sm"><?= icon('plus-circle') ?> Ajouter un TFE</a>
<button type="button" class="btn btn--primary btn--sm" id="import-dialog-btn"
onclick="document.getElementById('import-dialog').showModal(); window.XamxamInitFilePonds()">
<?= icon('tray-arrow-up') ?> Importer
</button>
<?php if ($trashCount > 0): ?>
<a href="/admin/index.php?tab=trash" class="btn btn--sm <?= $tab === 'trash' ? 'btn--primary' : 'btn--secondary' ?>">
Corbeille (<?= $trashCount ?>)
</a>
<?php endif; ?>
<a href="/admin/cleanup.php" class="btn btn--sm btn--secondary">
<?= icon('trash') ?> Nettoyer<?= $tmpTotalCount > 0 ? " ($tmpTotalCount)" : '' ?>
</a>
</div>
</form>
<!-- Loading indicator bar -->