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:
+1
-1
@@ -569,7 +569,7 @@
|
|||||||
<div class="d-flex flex-wrap align-items-end justify-content-between gap-2 mb-2">
|
<div class="d-flex flex-wrap align-items-end justify-content-between gap-2 mb-2">
|
||||||
<div class="info-line small text-muted">
|
<div class="info-line small text-muted">
|
||||||
<span class="badge bg-light text-dark border" aria-hidden="true">i</span>
|
<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>
|
||||||
<div class="d-flex gap-2">
|
<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>
|
<button type="button" id="open-add-user-modal" class="btn btn-warning btn-sm btn-compact">Ajouter un utilisateur</button>
|
||||||
|
|||||||
+7
-2
@@ -626,6 +626,7 @@ footer {
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
margin-top: -1px;
|
margin-top: -1px;
|
||||||
padding-top: 0 !important;
|
padding-top: 0 !important;
|
||||||
|
border-top: 1px solid var(--app-border);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Hide top border under the active admin tab */
|
/* Hide top border under the active admin tab */
|
||||||
@@ -638,13 +639,17 @@ footer {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
height: 1px;
|
height: 2px;
|
||||||
width: calc(100% + 2px);
|
width: calc(100% + 2px);
|
||||||
margin-left: -1px;
|
margin-left: -1px;
|
||||||
background: transparent;
|
background: var(--app-surface);
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#adminTabs + .admin-tabs-content > .tab-pane.fade::before {
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
#adminTabs + .admin-tabs-content .tab-pane .card:first-of-type {
|
#adminTabs + .admin-tabs-content .tab-pane .card:first-of-type {
|
||||||
border-top-color: transparent;
|
border-top-color: transparent;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -37,9 +37,42 @@
|
|||||||
}
|
}
|
||||||
.stats-tabs {
|
.stats-tabs {
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
|
gap: 0.35rem;
|
||||||
}
|
}
|
||||||
.stats-tab-panel {
|
.stats-tab-panel {
|
||||||
padding-top: 0;
|
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) {
|
.stats-tab-panel > .tab-pane:not(#pane-ranking) {
|
||||||
padding-top: 1rem;
|
padding-top: 1rem;
|
||||||
@@ -52,6 +85,9 @@
|
|||||||
.stats-tab-panel .table td {
|
.stats-tab-panel .table td {
|
||||||
font-size: 0.9rem;
|
font-size: 0.9rem;
|
||||||
}
|
}
|
||||||
|
html[data-theme="dark"] .stats-tabs .nav-link.active {
|
||||||
|
border-bottom-color: transparent;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body class="bg-light page-loading">
|
<body class="bg-light page-loading">
|
||||||
|
|||||||
Reference in New Issue
Block a user