Release
This commit is contained in:
133
web/assets/panel.css
Normal file
133
web/assets/panel.css
Normal file
@@ -0,0 +1,133 @@
|
||||
:root{
|
||||
--bg:#0b1220;
|
||||
--card:#111a2e;
|
||||
--text:#e7ecf4;
|
||||
--muted:#c6d3ee;
|
||||
--brand:#2b7bff;
|
||||
--border:#223257;
|
||||
--input:#0c1527;
|
||||
--grid: rgba(231,236,244,.15);
|
||||
}
|
||||
|
||||
:root[data-theme="light"]{
|
||||
--bg:#f7f9fc;
|
||||
--card:#ffffff;
|
||||
--text:#0b1220;
|
||||
--muted:#56617a;
|
||||
--brand:#0d6efd;
|
||||
--border:#dee2e6;
|
||||
--input:#ffffff;
|
||||
--grid: rgba(0,0,0,.1);
|
||||
}
|
||||
|
||||
html,body{
|
||||
height:100%;
|
||||
background:var(--bg);
|
||||
color:var(--text);
|
||||
}
|
||||
|
||||
.card{
|
||||
background:var(--card);
|
||||
border:1px solid var(--border);
|
||||
border-radius:16px;
|
||||
color:var(--text);
|
||||
}
|
||||
|
||||
h1,h2,h3,h4,h5,h6 { color:var(--text) !important; }
|
||||
.h1,.h2,.h3,.h4,.h5,.h6 { color:var(--text) !important; }
|
||||
.form-label,label{ color:var(--text) !important; }
|
||||
.small, .text-muted, .form-text{ color:var(--muted) !important; }
|
||||
|
||||
.mono{
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.form-control,.form-select{
|
||||
background:var(--input);
|
||||
color:var(--text);
|
||||
border-color:var(--border);
|
||||
}
|
||||
.form-control::placeholder{ color:#9db1d6; opacity:.8; }
|
||||
:root[data-theme="light"] .form-control::placeholder{ color:#6c757d; }
|
||||
.form-control:focus,.form-select:focus{
|
||||
background:var(--input);
|
||||
color:var(--text);
|
||||
border-color:var(--brand);
|
||||
box-shadow:0 0 0 .2rem color-mix(in oklab, var(--brand) 25%, transparent);
|
||||
}
|
||||
|
||||
input:-webkit-autofill,
|
||||
input:-webkit-autofill:hover,
|
||||
input:-webkit-autofill:focus,
|
||||
textarea:-webkit-autofill,
|
||||
select:-webkit-autofill{
|
||||
-webkit-box-shadow:0 0 0 30px var(--input) inset !important;
|
||||
-webkit-text-fill-color:var(--text) !important;
|
||||
caret-color:var(--text);
|
||||
}
|
||||
|
||||
.btn-primary{ background:var(--brand); border:0; }
|
||||
.btn-secondary{ background:#3a4663; border:0; color:#fff; }
|
||||
:root[data-theme="light"] .btn-secondary{ background:#6c7aa6; }
|
||||
|
||||
.page-wrap{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px; }
|
||||
.maxw-960{ max-width:960px; }
|
||||
|
||||
.equal-row > [class*="col-"]{ display:flex; }
|
||||
.equal-row .card{ width:100%; }
|
||||
|
||||
#trafficWrap{ height:260px; }
|
||||
#trafficChart{ width:100%; height:100%; display:block; }
|
||||
|
||||
.navbar-brand img{ width:20px; height:20px; margin-right:.5rem; vertical-align:-3px; }
|
||||
|
||||
:root[data-theme="dark"] .alert-warning{
|
||||
background-color:#3b2b00 !important;
|
||||
border-color:#8a6d1a !important;
|
||||
color:var(--text) !important;
|
||||
}
|
||||
:root[data-theme="dark"] .alert-warning .fw-semibold,
|
||||
:root[data-theme="dark"] .alert-warning .mono,
|
||||
:root[data-theme="dark"] .alert-warning .small,
|
||||
:root[data-theme="dark"] .alert-warning li,
|
||||
:root[data-theme="dark"] .alert-warning p{ color:var(--text) !important; }
|
||||
:root[data-theme="dark"] .alert-warning a{ color:#ffd267 !important; text-decoration:underline; }
|
||||
|
||||
.input-group-text{
|
||||
background: var(--input);
|
||||
color: var(--text);
|
||||
border-color: var(--border);
|
||||
padding: .375rem .5rem;
|
||||
}
|
||||
|
||||
.input-group .form-control{
|
||||
background: var(--input);
|
||||
color: var(--text);
|
||||
border-color: var(--border);
|
||||
}
|
||||
.input-group .form-control:focus{
|
||||
background: var(--input);
|
||||
color: var(--text);
|
||||
border-color: var(--brand);
|
||||
box-shadow: 0 0 0 .2rem color-mix(in oklab, var(--brand) 25%, transparent);
|
||||
}
|
||||
|
||||
.input-group > .form-control,
|
||||
.input-group > .form-select,
|
||||
.input-group > .input-group-text{
|
||||
border-radius: .375rem;
|
||||
}
|
||||
|
||||
:root[data-theme="light"] .card .btn-outline-light{
|
||||
color: var(--brand) !important;
|
||||
border-color: var(--brand) !important;
|
||||
}
|
||||
|
||||
:root[data-theme="light"] .card .btn-outline-light:hover,
|
||||
:root[data-theme="light"] .card .btn-outline-light:focus{
|
||||
background: var(--brand) !important;
|
||||
color: #fff !important;
|
||||
border-color: var(--brand) !important;
|
||||
box-shadow: 0 0 0 .2rem color-mix(in oklab, var(--brand) 25%, transparent);
|
||||
}
|
||||
Reference in New Issue
Block a user