Add web/static/themes/dos.css
This commit is contained in:
parent
6fec0a453f
commit
923d6ba47f
215
web/static/themes/dos.css
Normal file
215
web/static/themes/dos.css
Normal file
@ -0,0 +1,215 @@
|
||||
/* ===============================
|
||||
DOS — Green Phosphor Terminal
|
||||
=============================== */
|
||||
/* Monospace stack leans into old-school vibe */
|
||||
@font-face {
|
||||
font-family: "DOSFallback";
|
||||
src: local("VT323"), local("Share Tech Mono");
|
||||
/* falls back to system monospace if not present */
|
||||
}
|
||||
|
||||
html[data-theme="dos"] body{
|
||||
background:#000; /* CRT black */
|
||||
color:#35ff6b; /* terminal green */
|
||||
min-height:100vh;
|
||||
font-family: "VT323","Share Tech Mono",DOSFallback,ui-monospace,Menlo,Consolas,monospace;
|
||||
letter-spacing: .2px;
|
||||
}
|
||||
|
||||
/* Subtle scanline feel (optional; comment out if you prefer flat) */
|
||||
html[data-theme="dos"] body::before{
|
||||
content:"";
|
||||
position:fixed; inset:0; pointer-events:none;
|
||||
background: repeating-linear-gradient(
|
||||
0deg,
|
||||
rgba(53,255,107,.03) 0px,
|
||||
rgba(53,255,107,.03) 1px,
|
||||
transparent 2px,
|
||||
transparent 3px
|
||||
);
|
||||
}
|
||||
|
||||
/* Selection = bright green block */
|
||||
html[data-theme="dos"] ::selection{
|
||||
background:#35ff6b;
|
||||
color:#000;
|
||||
}
|
||||
|
||||
/* ---------- Top bar (status strip) ---------- */
|
||||
html[data-theme="dos"] .topbar-wrap{
|
||||
background:#000;
|
||||
border-bottom:1px solid #0f3; /* #00ff33-ish */
|
||||
box-shadow:none;
|
||||
}
|
||||
html[data-theme="dos"] .topbar-wrap.is-scrolled{
|
||||
box-shadow: none;
|
||||
border-bottom-color:#3f6; /* a bit brighter on scroll */
|
||||
}
|
||||
html[data-theme="dos"] .brand-title,
|
||||
html[data-theme="dos"] .version-link{
|
||||
color:#35ff6b;
|
||||
}
|
||||
html[data-theme="dos"] .version-link:hover{ text-decoration: underline; }
|
||||
|
||||
/* ---------- Cards / Panels (1px “frame”) ---------- */
|
||||
html[data-theme="dos"] .card,
|
||||
html[data-theme="dos"] .result-card,
|
||||
html[data-theme="dos"] .search-form,
|
||||
html[data-theme="dos"] .form-card,
|
||||
html[data-theme="dos"] .user-menu,
|
||||
html[data-theme="dos"] .mobile-menu-inner{
|
||||
background:#000;
|
||||
color:#35ff6b;
|
||||
border:1px solid #0f3;
|
||||
border-radius:0;
|
||||
box-shadow:none;
|
||||
}
|
||||
|
||||
/* Headers & muted text */
|
||||
html[data-theme="dos"] .page-title,
|
||||
html[data-theme="dos"] .subject-title{
|
||||
color:#5aff8a;
|
||||
}
|
||||
html[data-theme="dos"] .section-label,
|
||||
html[data-theme="dos"] .meta-label,
|
||||
html[data-theme="dos"] .page-subtitle,
|
||||
html[data-theme="dos"] .muted{
|
||||
color:#2dd160; /* dimmer green */
|
||||
}
|
||||
|
||||
/* Dividers */
|
||||
html[data-theme="dos"] .meta-grid{
|
||||
border-top:1px solid #0f3;
|
||||
}
|
||||
|
||||
/* ---------- Inputs ---------- */
|
||||
html[data-theme="dos"] .search-input,
|
||||
html[data-theme="dos"] .form-control,
|
||||
html[data-theme="dos"] .login-input,
|
||||
html[data-theme="dos"] .tool-input,
|
||||
html[data-theme="dos"] textarea{
|
||||
background:#000;
|
||||
color:#35ff6b;
|
||||
border:1px solid #0f3;
|
||||
border-radius:0;
|
||||
caret-color:#35ff6b;
|
||||
box-shadow:none;
|
||||
}
|
||||
html[data-theme="dos"] .search-input::placeholder,
|
||||
html[data-theme="dos"] .form-control::placeholder,
|
||||
html[data-theme="dos"] .tool-input::placeholder{ color:#1ea64a; }
|
||||
|
||||
html[data-theme="dos"] .search-input:focus,
|
||||
html[data-theme="dos"] .form-control:focus,
|
||||
html[data-theme="dos"] .login-input:focus,
|
||||
html[data-theme="dos"] .tool-input:focus{
|
||||
outline:none;
|
||||
border-color:#3f6;
|
||||
box-shadow:0 0 0 2px rgba(53,255,107,.18);
|
||||
}
|
||||
|
||||
/* Check pills & chips -> flat terminal labels */
|
||||
html[data-theme="dos"] .check-pill,
|
||||
html[data-theme="dos"] .chip,
|
||||
html[data-theme="dos"] .chip-link,
|
||||
html[data-theme="dos"] .chip-muted{
|
||||
background:#000;
|
||||
color:#35ff6b;
|
||||
border:1px solid #0f3;
|
||||
border-radius:0;
|
||||
}
|
||||
html[data-theme="dos"] .check-pill:hover{ background:#001a00; }
|
||||
|
||||
/* ---------- Buttons (solid outline; invert on hover) ---------- */
|
||||
html[data-theme="dos"] .btn{
|
||||
background:#000;
|
||||
color:#35ff6b;
|
||||
border:1px solid #0f3;
|
||||
border-radius:0;
|
||||
padding:8px 12px;
|
||||
text-transform:uppercase;
|
||||
letter-spacing:.6px;
|
||||
}
|
||||
html[data-theme="dos"] .btn:hover{
|
||||
background:#35ff6b;
|
||||
color:#000;
|
||||
}
|
||||
html[data-theme="dos"] .btn-primary{
|
||||
border-color:#3f6;
|
||||
color:#5aff8a;
|
||||
}
|
||||
html[data-theme="dos"] .btn-primary:hover{
|
||||
background:#5aff8a; color:#000; border-color:#5aff8a;
|
||||
}
|
||||
html[data-theme="dos"] .btn-danger{
|
||||
border-color:#ff4d4d; color:#ff6666;
|
||||
}
|
||||
html[data-theme="dos"] .btn-danger:hover{
|
||||
background:#ff6666; color:#000;
|
||||
}
|
||||
|
||||
/* Header nav buttons */
|
||||
html[data-theme="dos"] .nav-btn{
|
||||
background:#000; color:#35ff6b; border:1px solid #0f3; border-radius:0;
|
||||
}
|
||||
html[data-theme="dos"] .nav-btn.primary{
|
||||
border-color:#3f6; color:#5aff8a;
|
||||
}
|
||||
html[data-theme="dos"] .nav-btn:hover{ background:#001a00; }
|
||||
|
||||
/* ---------- Menus ---------- */
|
||||
html[data-theme="dos"] .user-menu .menu-item,
|
||||
html[data-theme="dos"] .mobile-link{
|
||||
color:#35ff6b;
|
||||
background:transparent;
|
||||
border-radius:0;
|
||||
}
|
||||
html[data-theme="dos"] .user-menu .menu-item:hover,
|
||||
html[data-theme="dos"] .mobile-link:hover{
|
||||
background:#001a00;
|
||||
}
|
||||
|
||||
/* ---------- Messages ---------- */
|
||||
html[data-theme="dos"] .msg{
|
||||
background:#000;
|
||||
color:#35ff6b;
|
||||
border:1px solid #0f3;
|
||||
border-radius:0;
|
||||
}
|
||||
html[data-theme="dos"] .msg.info{ border-color:#3f6; }
|
||||
html[data-theme="dos"] .msg.success{ border-color:#35ff6b; }
|
||||
html[data-theme="dos"] .msg.warning{ border-color:#ccf233; color:#ccf233; }
|
||||
html[data-theme="dos"] .msg.error{ border-color:#ff5c5c; color:#ff5c5c; }
|
||||
|
||||
/* ---------- Links ---------- */
|
||||
html[data-theme="dos"] a{ color:#5aff8a; }
|
||||
html[data-theme="dos"] a:hover{ color:#9dffbd; text-decoration: underline; }
|
||||
|
||||
/* ---------- Result count & small meta ---------- */
|
||||
html[data-theme="dos"] .rt-count,
|
||||
html[data-theme="dos"] .meta-value.small{ color:#2dd160; }
|
||||
|
||||
/* ---------- Command Center bits ---------- */
|
||||
html[data-theme="dos"] .settings-console .cc-panel{ border-color:#0f3; }
|
||||
html[data-theme="dos"] .settings-console .cc-kicker,
|
||||
html[data-theme="dos"] .settings-console .cc-panel-title,
|
||||
html[data-theme="dos"] .settings-console .cc-title{
|
||||
color:#5aff8a;
|
||||
}
|
||||
html[data-theme="dos"] .settings-console .sec-tile{
|
||||
background:#000; color:#35ff6b; border:1px solid #0f3; border-radius:0;
|
||||
}
|
||||
html[data-theme="dos"] .settings-console .sec-tile:hover{
|
||||
background:#001a00;
|
||||
}
|
||||
html[data-theme="dos"] .settings-console .sec-icon{
|
||||
background:#000; color:#5aff8a; border:1px solid #0f3;
|
||||
}
|
||||
|
||||
/* ---------- Tables (gridlines) ---------- */
|
||||
html[data-theme="dos"] table{ border-collapse:collapse; }
|
||||
html[data-theme="dos"] th, html[data-theme="dos"] td{
|
||||
border:1px solid #0f3; color:#35ff6b; background:#000;
|
||||
}
|
||||
|
||||
/* Keep Classic’s gradient opt-in separate; DOS doesn’t use .themed-bg */
|
||||
Loading…
Reference in New Issue
Block a user