Fix panel

This commit is contained in:
2026-05-10 18:21:03 -03:00
parent e00a7bd93c
commit 4a04ff79f0
3 changed files with 158 additions and 52 deletions

View File

@@ -164,8 +164,10 @@ body.light-mode{
}
.app{padding:0;background:linear-gradient(180deg,var(--bg),#101010);min-height:100vh;}
.shell{max-width:none;margin:0;background:transparent;border:0;border-radius:0;box-shadow:none;padding:0;min-height:100vh;}
.panel-layout{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:100vh;background:var(--bg);}
.sidebar{position:sticky;top:0;height:100vh;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:20;box-shadow:18px 0 45px rgba(0,0,0,.18);}
.panel-layout{display:block;min-height:100vh;background:var(--bg);}
@supports (min-height:100dvh){.panel-layout{min-height:100dvh;}}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:280px;height:100vh;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:20;box-shadow:18px 0 45px rgba(0,0,0,.18);}
@supports (height:100dvh){.sidebar{height:100dvh;}}
.brand-block{height:112px;display:flex;align-items:center;gap:14px;padding:22px 22px;border-bottom:1px solid var(--border);}
.brand-mark{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(90,73,245,.18),rgba(174,47,243,.18));font-size:2rem;filter:drop-shadow(0 10px 18px rgba(0,0,0,.35));}
.brand-copy{display:flex;flex-direction:column;gap:2px;}
@@ -181,7 +183,8 @@ body.light-mode{
.avatar-dragon{width:42px;height:42px;border-radius:14px;background:#111;display:grid;place-items:center;font-size:1.45rem;}
.sidebar-foot strong{display:block;font-size:.93rem;}
.sidebar-foot span{display:block;color:var(--muted);font-size:.78rem;margin-top:2px;text-transform:capitalize;}
.workspace{min-width:0;display:flex;flex-direction:column;background:radial-gradient(circle at 35% -10%,rgba(90,73,245,.12),transparent 32%),var(--bg);}
.workspace{min-width:0;margin-left:280px;display:flex;flex-direction:column;min-height:100vh;background:radial-gradient(circle at 35% -10%,rgba(90,73,245,.12),transparent 32%),var(--bg);}
@supports (min-height:100dvh){.workspace{min-height:100dvh;}}
.topbar{height:84px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:0 26px;border-bottom:1px solid var(--border);background:rgba(31,31,32,.86);backdrop-filter:blur(18px);position:sticky;top:0;z-index:15;margin:0;}
body.light-mode .topbar{background:rgba(255,255,255,.82);}
.topbar-left,.topbar-actions{display:flex;align-items:center;gap:14px;min-width:0;}
@@ -257,9 +260,10 @@ tbody tr:hover{background:rgba(90,73,245,.08);}
.badge-on{color:var(--success);font-weight:750}.badge-off{color:var(--muted);font-weight:700}
pre.log-box{background:#121214;border-color:var(--border);border-radius:15px;}
.drawer-backdrop{display:none;}
@media(max-width:1180px){.dash-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.panel-layout{grid-template-columns:250px minmax(0,1fr);}}
@media(max-width:1180px){.dash-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.sidebar{width:250px;}.workspace{margin-left:250px;}}
@media(max-width:820px){
.panel-layout{grid-template-columns:1fr;}
.panel-layout{display:block;}
.workspace{margin-left:0;}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:min(82vw,300px);height:100vh;transform:translateX(-105%);transition:transform .22s ease;}
body.sidebar-open .sidebar{transform:translateX(0);}
.drawer-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.58);z-index:18;backdrop-filter:blur(4px);}
@@ -327,3 +331,7 @@ pre.log-box{background:#121214;border-color:var(--border);border-radius:15px;}
.dash-icon{width:54px;height:54px;font-size:1.35rem;}
.btn{padding:9px 11px;}
}
/* Xray client table updates in place; this tiny state avoids visual flicker during background polling. */
#inboundsContainer.xray-refreshing{opacity:.985;}
#inboundsContainer [data-cell]{transition:background-color .12s ease;}