IMBENJI.NET/Duriin-API
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: make admin navigation responsive

Browse Source
This commit is contained in:
ImBenji
2026-08-04 21:36:39 +01:00
parent 5680ee8a44
commit bd162606b6
15 changed files with 204 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/admin/assets/css/components.css
+34
View File
@@ -68,6 +68,40 @@ tbody tr:hover { background: rgba(255,255,255,.022); }
.empty-state { padding: 42px 24px; color: var(--muted-dark); text-align: center; }
.skeleton-row:hover { background: transparent; }
.skeleton-row td { height: 205px; padding: 22px 18px; vertical-align: top; }
.skeleton-row td span {
width: min(680px, 82%);
height: 11px;
margin-bottom: 20px;
display: block;
border-radius: 2px;
background: linear-gradient(90deg, #171b17 20%, #252b24 42%, #171b17 64%);
background-size: 300% 100%;
animation: skeleton-wave 1.6s ease infinite;
}
.skeleton-row td span:nth-child(2) { width: 58%; }
.skeleton-row td span:nth-child(3) { width: 72%; }
.skeleton-row td span:nth-child(4) { width: 45%; }
.content-loading { min-height: 160px; position: relative; }
.content-loading::after { content: "Loading"; position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted-dark); font-family: var(--mono); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
@keyframes skeleton-wave { from { background-position: 100% 0; } to { background-position: 0 0; } }
html::after {
content: "";
position: fixed;
z-index: 500;
top: 0;
left: var(--rail);
width: 0;
height: 2px;
opacity: 0;
background: var(--accent);
box-shadow: 0 0 12px rgba(223,255,79,.45);
transition: width 220ms ease, opacity 120ms;
}
html.navigating::after { width: calc(100% - var(--rail)); opacity: 1; }
@media (max-width: 640px) {
.table-wrap { border-radius: 0; margin-inline: -16px; border-left: 0; border-right: 0; }
th, td { padding-inline: 11px; }