Spaces:
Sleeping
Sleeping
File size: 2,976 Bytes
9032518 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 | /* pro_ui.css — professional engineering-suite polish (COMSOL/ANSYS-style)
Additive layer: refines the Car Studio panel + toolbar without touching the
app's layout logic. Loaded after the inline styles so it wins on ties. */
/* ---- Car Studio panel: crisp, neutral, consistent ---- */
#carStudio .cs-row { display: flex; flex-wrap: wrap; align-items: center;
gap: 4px; margin: 3px 0; }
#carStudio .cs-row > label { flex: 0 0 100%; font-size: 10px; font-weight: 700;
letter-spacing: 1.1px; text-transform: uppercase; color: #6a7382;
margin: 7px 0 1px; }
#carStudio .cs-btn { display: inline-flex; align-items: center; gap: 5px;
height: 24px; padding: 0 9px; font-size: 11.5px; font-weight: 500;
color: #2a3342; background: linear-gradient(#ffffff, #f2f4f7);
border: 1px solid #c6cdd6; border-radius: 4px; cursor: pointer;
transition: border-color .12s, background .12s, box-shadow .12s; }
#carStudio .cs-btn:hover { border-color: #2461c2; background: #eef4fd;
box-shadow: 0 0 0 1px rgba(36,97,194,.18); }
#carStudio .cs-btn:active { background: #dfeafc; }
#carStudio .cs-btn svg.pro-ic { width: 12px; height: 12px; flex: 0 0 12px;
stroke: #4b5769; fill: none; stroke-width: 1.7; stroke-linecap: round;
stroke-linejoin: round; }
#carStudio .cs-btn:hover svg.pro-ic { stroke: #2461c2; }
#carStudio .cs-cfd { background: linear-gradient(#ffffff, #eef7f0);
border-color: #a9cdb4; }
#carStudio select, #carStudio input[type="text"], #carStudio textarea {
border: 1px solid #c6cdd6; border-radius: 4px; font-size: 11.5px;
padding: 3px 6px; background: #fff; color: #2a3342; }
#carStudio select:focus, #carStudio textarea:focus { outline: none;
border-color: #2461c2; box-shadow: 0 0 0 2px rgba(36,97,194,.15); }
/* dark theme: keep the panel readable, not washed out */
:root:not(.light) #carStudio .cs-btn { background: linear-gradient(#242a33, #1d222a);
border-color: #39414d; color: #cfd6e0; }
:root:not(.light) #carStudio .cs-btn:hover { background: #26313f;
border-color: #3470c8; box-shadow: 0 0 0 1px rgba(52,112,200,.25); }
:root:not(.light) #carStudio .cs-btn svg.pro-ic { stroke: #97a3b4; }
:root:not(.light) #carStudio .cs-btn:hover svg.pro-ic { stroke: #6fa3e8; }
:root:not(.light) #carStudio .cs-cfd { background: linear-gradient(#20301f, #1a271a);
border-color: #3b5e3b; }
:root:not(.light) #carStudio .cs-row > label { color: #8892a2; }
:root:not(.light) #carStudio select, :root:not(.light) #carStudio input[type="text"],
:root:not(.light) #carStudio textarea { background: #171c23; color: #cfd6e0;
border-color: #39414d; }
/* ---- toolbar: uniform icon buttons ---- */
#toolbar button svg.pro-ic { width: 14px; height: 14px; flex: 0 0 14px;
stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round;
stroke-linejoin: round; opacity: .85; }
#toolbar button { letter-spacing: .1px; }
/* keep the two special-action buttons readable but consistent */
#gestureBtn, #disasmBtn { border-radius: 5px; }
|