Polish admin and stats tab styling

Improve tab border handling and spacing for admin and stats views, plus minor copy spacing fixes.
This commit is contained in:
Mathieu Moran
2026-01-27 10:36:31 -05:00
parent 9868d2c39a
commit c81135a4c1
3 changed files with 44 additions and 3 deletions
+1 -1
View File
@@ -569,7 +569,7 @@
<div class="d-flex flex-wrap align-items-end justify-content-between gap-2 mb-2">
<div class="info-line small text-muted">
<span class="badge bg-light text-dark border" aria-hidden="true">i</span>
<span class="info-text"><span id="admin-users-count">—</span> utilisateur(s)</span>
<span class="info-text"><span id="admin-users-count" class="me-1">—</span>utilisateur(s)</span>
</div>
<div class="d-flex gap-2">
<button type="button" id="open-add-user-modal" class="btn btn-warning btn-sm btn-compact">Ajouter un utilisateur</button>
+7 -2
View File
@@ -626,6 +626,7 @@ footer {
padding: 0;
margin-top: -1px;
padding-top: 0 !important;
border-top: 1px solid var(--app-border);
}
/* Hide top border under the active admin tab */
@@ -638,13 +639,17 @@ footer {
position: absolute;
top: 0;
left: 0;
height: 1px;
height: 2px;
width: calc(100% + 2px);
margin-left: -1px;
background: transparent;
background: var(--app-surface);
pointer-events: none;
}
#adminTabs + .admin-tabs-content > .tab-pane.fade::before {
background: transparent;
}
#adminTabs + .admin-tabs-content .tab-pane .card:first-of-type {
border-top-color: transparent;
}
+36
View File
@@ -37,9 +37,42 @@
}
.stats-tabs {
border-bottom: 0;
gap: 0.35rem;
}
.stats-tab-panel {
padding-top: 0;
background-color: var(--app-surface);
padding: 0.75rem;
margin-top: -1px;
border: 1px solid var(--app-border);
border-top: 0;
border-radius: 0 0 12px 12px;
}
.stats-tab-panel {
border-top: 1px solid var(--app-border);
}
#statsTabs .nav-link.active {
position: relative;
z-index: 2;
top: 1px;
border-bottom-color: transparent;
}
#statsTabsContent > .tab-pane.active {
position: relative;
}
#statsTabsContent > .tab-pane.active::before {
content: "";
position: absolute;
top: 0;
left: 0;
height: 2px;
width: calc(100% + 2px);
margin-left: -1px;
background: var(--app-surface);
pointer-events: none;
}
#statsTabsContent > .tab-pane.fade::before {
background: transparent;
}
.stats-tab-panel > .tab-pane:not(#pane-ranking) {
padding-top: 1rem;
@@ -52,6 +85,9 @@
.stats-tab-panel .table td {
font-size: 0.9rem;
}
html[data-theme="dark"] .stats-tabs .nav-link.active {
border-bottom-color: transparent;
}
</style>
</head>
<body class="bg-light page-loading">