From 3e721b19f0b8de16e3a3a836feb82d0918cc6c10 Mon Sep 17 00:00:00 2001
From: Pontoporeia <pontoporeia@happyngreen.fr>
Date: Tue, 18 Aug 2026 21:47:46 +0200
Subject: [PATCH] ui: system logs style update

- Increase padding in admin log dropdown selects
- Move admin log filters above the Journaux tabs
---
 app/public/assets/css/system.css              | 11 +++++----
 app/public/assets/js/app/admin-logs.js        |  6 ++---
 app/templates/admin/parametres.php            | 18 +-------------
 .../admin/partials/system-log-panel.php       | 24 +++++++++++++++----
 4 files changed, 31 insertions(+), 28 deletions(-)

diff --git a/app/public/assets/css/system.css b/app/public/assets/css/system.css
index 9fcef4e..6e40947 100644
--- a/app/public/assets/css/system.css
+++ b/app/public/assets/css/system.css
@@ -204,16 +204,16 @@
 }
 
 /* ── Tab panel loading state ───────────────────────────────────────────── */
-#sys-tab-panel {
+#sys-log-view {
 	min-height: 8rem;
 	position: relative;
 }
-#sys-tab-panel.htmx-request {
+#sys-log-view.htmx-request {
 	opacity: 0.4;
 	pointer-events: none;
 	transition: opacity 0.1s;
 }
-#sys-tab-panel.htmx-request::after {
+#sys-log-view.htmx-request::after {
 	content: "";
 	position: absolute;
 	inset: 0;
@@ -250,7 +250,10 @@
 	color: var(--text-secondary);
 }
 .log-toolbar select {
-	padding: var(--space-3xs) var(--space-xs);
+	padding: var(--space-xs) var(--space-s);
+	padding-right: 1.75rem;
+	line-height: 1.4;
+	min-height: 2.75rem;
 }
 .log-toolbar select:focus {
 	outline: 2px solid var(--accent-primary);
diff --git a/app/public/assets/js/app/admin-logs.js b/app/public/assets/js/app/admin-logs.js
index 5fdfddf..090e8b5 100644
--- a/app/public/assets/js/app/admin-logs.js
+++ b/app/public/assets/js/app/admin-logs.js
@@ -3,7 +3,7 @@
  *
  * Provides:
  *   - copyLogContent(btn)  — copy visible log lines to clipboard
- *   - HTMX afterSwap handler to update active tab class on #sys-tab-panel
+ *   - HTMX afterSwap handler to update active tab class on #sys-log-view
  */
 (() => {
 	window.copyLogContent = (btn) => {
@@ -44,9 +44,9 @@
 		document.body.removeChild(ta);
 	};
 
-	// Update active tab class after each HTMX swap on #sys-tab-panel
+	// Update active tab class after each HTMX swap on #sys-log-view
 	document.body.addEventListener("htmx:afterSwap", (evt) => {
-		if (!(evt.detail.target && evt.detail.target.id === "sys-tab-panel"))
+		if (!(evt.detail.target && evt.detail.target.id === "sys-log-view"))
 			return;
 		var rc = evt.detail.requestConfig;
 		var tab = null;
diff --git a/app/templates/admin/parametres.php b/app/templates/admin/parametres.php
index 2551e54..c9c7ca2 100644
--- a/app/templates/admin/parametres.php
+++ b/app/templates/admin/parametres.php
@@ -458,23 +458,7 @@
     <section aria-labelledby="settings-logs-title">
         <h2 id="settings-logs-title">Journaux</h2>
 
-        <nav class="sys-tabs" aria-label="Journaux et configuration">
-            <?php foreach (SystemController::LOG_FILES as $key => $def): ?>
-            <a href="?tab=<?= htmlspecialchars($key) ?>&amp;date=<?= htmlspecialchars($selectedDate ?? '') ?>&amp;n=<?= $selectedN ?>"
-               class="sys-tab <?= $activeTab === $key ? 'active' : '' ?>"
-               hx-get="/admin/system-fragment.php?tab=<?= htmlspecialchars($key) ?>&amp;date=<?= htmlspecialchars($selectedDate ?? '') ?>&amp;n=<?= $selectedN ?>"
-               hx-target="#sys-tab-panel"
-               hx-push-url="?tab=<?= htmlspecialchars($key) ?>&amp;date=<?= htmlspecialchars($selectedDate ?? '') ?>&amp;n=<?= $selectedN ?>"
-               hx-swap="innerHTML"
-               hx-indicator="#sys-tab-panel"
-               data-tab="<?= htmlspecialchars($key) ?>"
-               <?= $activeTab === $key ? 'aria-current="page"' : '' ?>>
-                <?= htmlspecialchars($def['label']) ?>
-            </a>
-            <?php endforeach; ?>
-        </nav>
-
-        <div id="sys-tab-panel">
+        <div id="sys-log-view">
             <?php include APP_ROOT . '/templates/admin/partials/system-log-panel.php'; ?>
         </div>
     </section>
diff --git a/app/templates/admin/partials/system-log-panel.php b/app/templates/admin/partials/system-log-panel.php
index 9a77707..7aa441b 100644
--- a/app/templates/admin/partials/system-log-panel.php
+++ b/app/templates/admin/partials/system-log-panel.php
@@ -1,8 +1,8 @@
 <div class="log-toolbar">
     <form id="lines-form" hx-get="/admin/system-fragment.php"
-          hx-target="#sys-tab-panel"
+          hx-target="#sys-log-view"
           hx-swap="innerHTML"
-          hx-indicator="#sys-tab-panel"
+          hx-indicator="#sys-log-view"
           hx-trigger="change"
           hx-vals='{"tab":"<?= htmlspecialchars($activeTab) ?>","date":"<?= htmlspecialchars($selectedDate ?? '') ?>"}'>
       <label for="lines-select">Afficher</label>
@@ -15,9 +15,9 @@
 
     <?php if (!empty($logDates)): ?>
     <form id="date-form" hx-get="/admin/system-fragment.php"
-          hx-target="#sys-tab-panel"
+          hx-target="#sys-log-view"
           hx-swap="innerHTML"
-          hx-indicator="#sys-tab-panel"
+          hx-indicator="#sys-log-view"
           hx-trigger="change"
           hx-vals='{"tab":"<?= htmlspecialchars($activeTab) ?>","n":<?= $selectedN ?>}'>
       <label for="date-select">Jour</label>
@@ -34,6 +34,22 @@
     <?php endif; ?>
 </div>
 
+<nav class="sys-tabs" aria-label="Journaux et configuration">
+    <?php foreach (SystemController::LOG_FILES as $key => $def): ?>
+    <a href="?tab=<?= htmlspecialchars($key) ?>&amp;date=<?= htmlspecialchars($selectedDate ?? '') ?>&amp;n=<?= $selectedN ?>"
+       class="sys-tab <?= $activeTab === $key ? 'active' : '' ?>"
+       hx-get="/admin/system-fragment.php?tab=<?= htmlspecialchars($key) ?>&amp;date=<?= htmlspecialchars($selectedDate ?? '') ?>&amp;n=<?= $selectedN ?>"
+       hx-target="#sys-log-view"
+       hx-push-url="?tab=<?= htmlspecialchars($key) ?>&amp;date=<?= htmlspecialchars($selectedDate ?? '') ?>&amp;n=<?= $selectedN ?>"
+       hx-swap="innerHTML"
+       hx-indicator="#sys-log-view"
+       data-tab="<?= htmlspecialchars($key) ?>"
+       <?= $activeTab === $key ? 'aria-current="page"' : '' ?>>
+        <?= htmlspecialchars($def['label']) ?>
+    </a>
+    <?php endforeach; ?>
+</nav>
+
 <?php if ($logFileMeta): ?>
 <div class="log-meta">
     <span data-label="Fichier"><?= htmlspecialchars($logFileMeta['path']) ?></span>