40 lines
1.8 KiB
CSS
40 lines
1.8 KiB
CSS
|
/*
|
||
|
|
* CMMS light theme for pcb-retrace schema.html (the "Schema ReTrace" iframe).
|
||
|
|
*
|
||
|
|
* NOT part of the fork. schema.html is dark-only upstream, which clashes when
|
||
|
|
* the CMMS is in light mode. studio.js appends ?theme=light|dark to the iframe
|
||
|
|
* src (from the CMMS-set data-theme on the parent document); an inline script
|
||
|
|
* in schema.html mirrors it onto <html data-theme>. Every rule here is gated on
|
||
|
|
* [data-theme="light"] so standalone use and CMMS dark mode are untouched.
|
||
|
|
*
|
||
|
|
* The schematic canvas (#sch-canvas, painted by schema/draw.js with hardcoded
|
||
|
|
* colours) deliberately stays dark — it reads as a drawing surface, like an EDA
|
||
|
|
* canvas, not UI chrome. Only the surrounding panels/header/modals are themed.
|
||
|
|
*/
|
||
|
|
:root[data-theme="light"] {
|
||
|
|
--bg: #ffffff;
|
||
|
|
--surface: #f6f8fa;
|
||
|
|
--surface2: #eaeef2;
|
||
|
|
--border: #d0d7de;
|
||
|
|
--accent: #0a7d5f;
|
||
|
|
--accent2: #0969da;
|
||
|
|
--accent3: #cf400b;
|
||
|
|
--warn: #9a6700;
|
||
|
|
--text: #1f2328;
|
||
|
|
--text2: #656d76;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Canvas overlays hardcode the dark page bg — flip to a light scrim. */
|
||
|
|
[data-theme="light"] #coord-readout,
|
||
|
|
[data-theme="light"] #zoom-ind { background: rgba(255,255,255,.82); }
|
||
|
|
[data-theme="light"] #hint-bar { background: rgba(255,255,255,.9); color: var(--text2); }
|
||
|
|
|
||
|
|
/* Mobile drawer / toolbar shadows are tuned for a dark bg. */
|
||
|
|
[data-theme="light"] #left-panel { box-shadow: 4px 0 15px rgba(140,149,159,.35); }
|
||
|
|
[data-theme="light"] #right-panel { box-shadow: -4px 0 15px rgba(140,149,159,.35); }
|
||
|
|
[data-theme="light"] #canvas-toolbar .btn { box-shadow: 0 2px 8px rgba(140,149,159,.35); }
|
||
|
|
|
||
|
|
/* Selection tints read as near-invisible on white — lift them slightly. */
|
||
|
|
[data-theme="light"] .net-item.selected,
|
||
|
|
[data-theme="light"] .db-item.selected { background: rgba(10,125,95,.12); }
|
||
|
|
[data-theme="light"] .comp-item.selected { background: rgba(9,105,218,.12); }
|