diff --git a/web/static/themes/win95.css b/web/static/themes/win95.css index 5399c4b..828651d 100644 --- a/web/static/themes/win95.css +++ b/web/static/themes/win95.css @@ -4,6 +4,7 @@ /* Palette + notes: - 3D light: #FFFFFF - Face: #C0C0C0 + - Dark face: #A0A0A0 - Shadow: #808080 - Dark: #000000 - Title Bar: #000080 @@ -12,15 +13,11 @@ html[data-theme="win95"] { --w95-face: #C0C0C0; + --w95-face-dark: #A0A0A0; --w95-light: #FFFFFF; --w95-shadow: #808080; --w95-dark: #000000; --w95-blue: #000080; - /* Topbar button sizing (consistent across pages) */ - --w95-btn-h: 44px; - --w95-btn-minw: 140px; - --w95-btn-pad-x: 18px; - --w95-btn-font: 18px; } html[data-theme="win95"] body{ @@ -30,13 +27,13 @@ html[data-theme="win95"] body{ font-family: "Tahoma","MS Sans Serif",system-ui,Segoe UI,Arial,sans-serif; } -/* Selection (classic blue) */ +/* Selection */ html[data-theme="win95"] ::selection{ background:var(--w95-blue); color:#fff; } -/* ---------- Top bar (Title Bar) ---------- */ +/* ---------- Top bar ---------- */ html[data-theme="win95"] .topbar-wrap{ background:var(--w95-blue); border-bottom:2px solid var(--w95-dark); @@ -45,16 +42,61 @@ html[data-theme="win95"] .topbar-wrap{ top: 0; z-index: 1000; } - html[data-theme="win95"] .brand-title, html[data-theme="win95"] .brand .tagline, html[data-theme="win95"] .version-link{ color:#fff !important; text-decoration:none; } -html[data-theme="win95"] .version-link:hover{ text-decoration:underline; } +html[data-theme="win95"] .version-link:hover{ + text-decoration:underline; +} -/* ---------- 3D Window (Cards / Panels) ---------- */ +/* ---------- Nav Buttons (Find/Create/Insights) ---------- */ +html[data-theme="win95"] .topbar .nav-btn{ + background:var(--w95-face) !important; + color:#000 !important; + border:2px solid var(--w95-face) !important; + border-top-color:var(--w95-light) !important; + border-left-color:var(--w95-light) !important; + border-right-color:var(--w95-shadow) !important; + border-bottom-color:var(--w95-shadow) !important; + border-radius:0 !important; + display:inline-flex !important; + align-items:center !important; + justify-content:center !important; + padding:6px 14px !important; /* consistent size */ + font-size:15px !important; + line-height:1 !important; + box-shadow: inset -1px -1px 0 var(--w95-dark) !important; +} +html[data-theme="win95"] .topbar .nav-btn:active{ + border-top-color:var(--w95-shadow) !important; + border-left-color:var(--w95-shadow) !important; + border-right-color:var(--w95-light) !important; + border-bottom-color:var(--w95-light) !important; + box-shadow: inset 1px 1px 0 var(--w95-dark) !important; +} + +/* ---------- Username Chip ---------- */ +html[data-theme="win95"] .topbar .user-chip{ + background:var(--w95-face-dark) !important; + color:#000 !important; + border:2px solid var(--w95-face-dark) !important; + border-top-color:var(--w95-light) !important; + border-left-color:var(--w95-light) !important; + border-right-color:var(--w95-shadow) !important; + border-bottom-color:var(--w95-shadow) !important; + border-radius:0 !important; + display:inline-flex !important; + align-items:center !important; + justify-content:center !important; + padding:6px 14px !important; + font-size:15px !important; + box-shadow: inset -1px -1px 0 var(--w95-dark) !important; +} + +/* ---------- 3D Windows (cards/panels) ---------- */ html[data-theme="win95"] .card, html[data-theme="win95"] .result-card, html[data-theme="win95"] .search-form, @@ -72,19 +114,22 @@ html[data-theme="win95"] .user-menu{ box-shadow: 1px 1px 0 var(--w95-dark) inset; } -/* "Window Caption" vibe for headings */ +/* Section headers */ html[data-theme="win95"] .cc-panel-head, html[data-theme="win95"] .page-title, -html[data-theme="win95"] .cc-panel-title{ color:#000; } +html[data-theme="win95"] .cc-panel-title{ + color:#000; +} html[data-theme="win95"] .cc-kicker, html[data-theme="win95"] .muted, html[data-theme="win95"] .page-subtitle, html[data-theme="win95"] .meta-label, html[data-theme="win95"] .section-label{ - color:#000; opacity:.75; + color:#000; + opacity:.75; } -/* Tables (gridlines) */ +/* Tables */ html[data-theme="win95"] table{ border-collapse:collapse; } html[data-theme="win95"] th, html[data-theme="win95"] td{ @@ -99,22 +144,24 @@ html[data-theme="win95"] .form-control, html[data-theme="win95"] .login-input, html[data-theme="win95"] .tool-input, html[data-theme="win95"] textarea{ - background:#FFFFFF; color:#000; + background:#fff; + color:#000; border:2px solid var(--w95-face); border-top-color:var(--w95-light); border-left-color:var(--w95-light); border-right-color:var(--w95-shadow); border-bottom-color:var(--w95-shadow); - border-radius:0; box-shadow:none; + border-radius:0; + box-shadow:none; } html[data-theme="win95"] .search-input:focus, html[data-theme="win95"] .form-control:focus, html[data-theme="win95"] .login-input:focus, html[data-theme="win95"] .tool-input:focus{ - outline: 1px dotted #000; outline-offset: 0; + outline: 1px dotted #000; } -/* Check pills/chips -> flat Win95 labels */ +/* ---------- Pills & Chips ---------- */ html[data-theme="win95"] .check-pill, html[data-theme="win95"] .chip, html[data-theme="win95"] .chip-link, @@ -125,9 +172,8 @@ html[data-theme="win95"] .chip-muted{ border-radius:0; } -/* ---------- Buttons (global) ---------- */ +/* ---------- Buttons ---------- */ html[data-theme="win95"] .btn{ - appearance:none; background:var(--w95-face); color:#000; border:2px solid var(--w95-face); @@ -139,9 +185,7 @@ html[data-theme="win95"] .btn{ padding:6px 12px; box-shadow: inset -1px -1px 0 var(--w95-dark); cursor: default; - line-height:1; } -html[data-theme="win95"] .btn:hover{ filter:brightness(1.02); } html[data-theme="win95"] .btn:active{ border-top-color:var(--w95-shadow); border-left-color:var(--w95-shadow); @@ -149,63 +193,24 @@ html[data-theme="win95"] .btn:active{ border-bottom-color:var(--w95-light); box-shadow: inset 1px 1px 0 var(--w95-dark); } -html[data-theme="win95"] .btn-primary{ background:var(--w95-face); color:#000; } -html[data-theme="win95"] .btn-primary:focus{ outline:1px dotted #000; } html[data-theme="win95"] .btn-danger{ color:#8B0000; } -/* ---------- Topbar controls: CONSISTENT sizing ---------- */ -/* Make header nav buttons and username chip identical Win95 buttons */ -html[data-theme="win95"] .topbar .nav-btn, -html[data-theme="win95"] .topbar .user-chip{ - background:var(--w95-face) !important; - color:#000 !important; - border:2px solid var(--w95-face) !important; - border-top-color:var(--w95-light) !important; - border-left-color:var(--w95-light) !important; - border-right-color:var(--w95-shadow) !important; - border-bottom-color:var(--w95-shadow) !important; - border-radius:0 !important; - display:inline-flex !important; - align-items:center !important; - justify-content:center !important; - height:var(--w95-btn-h) !important; - min-width:var(--w95-btn-minw) !important; - padding:0 var(--w95-btn-pad-x) !important; - box-shadow: inset -1px -1px 0 var(--w95-dark) !important; - font-size:var(--w95-btn-font) !important; - line-height:1 !important; - white-space:nowrap !important; -} - -html[data-theme="win95"] .topbar .nav-btn:active, -html[data-theme="win95"] .topbar .user-chip:active{ - border-top-color:var(--w95-shadow) !important; - border-left-color:var(--w95-shadow) !important; - border-right-color:var(--w95-light) !important; - border-bottom-color:var(--w95-light) !important; - box-shadow: inset 1px 1px 0 var(--w95-dark) !important; -} - -/* Remove the rounded “pill” look from default chip in header */ -html[data-theme="win95"] .user-chip{ border-radius:0 !important; } - /* ---------- Menus ---------- */ -html[data-theme="win95"] .user-menu, -html[data-theme="win95"] .mobile-menu-inner{ - background:var(--w95-face); -} html[data-theme="win95"] .user-menu .menu-item, html[data-theme="win95"] .mobile-link{ - color:#000; background:transparent; border-radius:0; + color:#000; + border-radius:0; } html[data-theme="win95"] .user-menu .menu-item:hover, html[data-theme="win95"] .mobile-link:hover{ - background:var(--w95-blue); color:#fff; + background:var(--w95-blue); + color:#fff; } /* ---------- Messages ---------- */ html[data-theme="win95"] .msg{ - background:#DFDFDF; color:#000; + background:#DFDFDF; + color:#000; border:2px solid var(--w95-face); border-top-color:var(--w95-light); border-left-color:var(--w95-light); @@ -213,18 +218,19 @@ html[data-theme="win95"] .msg{ border-bottom-color:var(--w95-shadow); border-radius:0; } -html[data-theme="win95"] .msg.info { border-left-color:#0000AA; } -html[data-theme="win95"] .msg.success { border-left-color:#007A00; } -html[data-theme="win95"] .msg.warning { border-left-color:#A06A00; } -html[data-theme="win95"] .msg.error { border-left-color:#8B0000; } +html[data-theme="win95"] .msg.info { background:#eaf2ff; border-color:#8aaad6; color:#003366; } +html[data-theme="win95"] .msg.success { background:#e8f5e8; border-color:#6aa86a; color:#104010; } +html[data-theme="win95"] .msg.warning { background:#fff7e0; border-color:#d4b96a; color:#5a4100; } +html[data-theme="win95"] .msg.error { background:#fff0f0; border-color:#cc6666; color:#7a1d1d; } /* ---------- Links ---------- */ html[data-theme="win95"] a{ color:#0000EE; } html[data-theme="win95"] a:hover{ color:#551A8B; text-decoration: underline; } -/* ---------- Command Center accents ---------- */ +/* ---------- Command Center ---------- */ html[data-theme="win95"] .settings-console .sec-tile{ - background:var(--w95-face); color:#000; + background:var(--w95-face); + color:#000; border:2px solid var(--w95-face); border-top-color:var(--w95-light); border-left-color:var(--w95-light); @@ -232,54 +238,57 @@ html[data-theme="win95"] .settings-console .sec-tile{ border-bottom-color:var(--w95-shadow); border-radius:0; } -html[data-theme="win95"] .settings-console .sec-tile:hover{ background:#DFDFDF; } +html[data-theme="win95"] .settings-console .sec-tile:hover{ + background:#DFDFDF; +} html[data-theme="win95"] .settings-console .sec-icon{ - background:#DFDFDF; color:#000; + background:#DFDFDF; + color:#000; border:1px solid var(--w95-shadow); - border-right-color:var(--w95-light); - border-bottom-color:var(--w95-light); + border-right-color:#fff; + border-bottom-color:#fff; + border-radius:0; +} +html[data-theme="win95"] .settings-console .swatch{ border-radius:0; } -/* Theme swatches inside Command Center — let the swatch be blocky */ -html[data-theme="win95"] .settings-console .swatch{ border-radius:0; } - -/* ---------- Misc ---------- */ -html[data-theme="win95"] .topbar-wrap.is-scrolled{ box-shadow:none; border-bottom-color:var(--w95-dark); } -/* win95 does not use .themed-bg */ - -/* =============================== - Windows 95 — validation & highlights - =============================== */ -html[data-theme="win95"] .mark-hit{ - background:#ffff88; color:#000; - padding:0 2px; border:1px solid #c0c0c0; +/* ---------- Highlights & Validation ---------- */ +html[data-theme="win95"] .mark-hit { + background: #ffff88; + color: #000; + padding: 0 2px; + border: 1px solid #c0c0c0; } - -/* Inputs validated by scripture-validator */ html[data-theme="win95"] .form-control.scripture-valid, -html[data-theme="win95"] .search-input.scripture-valid{ - border:2px inset #008000; background:#e8f5e8; +html[data-theme="win95"] .search-input.scripture-valid { + border: 2px inset #008000; + background: #e8f5e8; } html[data-theme="win95"] .form-control.scripture-invalid, -html[data-theme="win95"] .search-input.scripture-invalid{ - border:2px inset #a00000; background:#fff0f0; +html[data-theme="win95"] .search-input.scripture-invalid { + border: 2px inset #a00000; + background: #fff0f0; } - -/* Scripture/Source “chips” states */ -html[data-theme="win95"] .scripture-pill-invalid{ - background:#ffeaea; border:2px outset #cc6666; color:#7a1d1d; +html[data-theme="win95"] .scripture-pill-invalid { + background: #ffeaea; + border: 2px outset #cc6666; + color: #7a1d1d; } -html[data-theme="win95"] .scripture-pill-wol{ - background:#e8f4ff; border:2px outset #8aaad6; color:#003366; text-decoration:none; +html[data-theme="win95"] .scripture-pill-wol { + background: #e8f4ff; + border: 2px outset #8aaad6; + color: #003366; } html[data-theme="win95"] a.chip:hover, -html[data-theme="win95"] .chip-link:hover{ - filter:brightness(0.96); outline:1px dotted #000; outline-offset:1px; +html[data-theme="win95"] .chip-link:hover { + filter: brightness(0.96); + outline: 1px dotted #000; + outline-offset: 1px; } -/* Message tones refined to Win95 palette */ -html[data-theme="win95"] .msg.info { background:#eaf2ff; border-color:#8aaad6; color:#003366; } -html[data-theme="win95"] .msg.success { background:#e8f5e8; border-color:#6aa86a; color:#104010; } -html[data-theme="win95"] .msg.warning { background:#fff7e0; border-color:#d4b96a; color:#5a4100; } -html[data-theme="win95"] .msg.error { background:#fff0f0; border-color:#cc6666; color:#7a1d1d; } \ No newline at end of file +/* ---------- Misc ---------- */ +html[data-theme="win95"] .topbar-wrap.is-scrolled{ + box-shadow:none; + border-bottom-color:#000; +} \ No newline at end of file