maxim.dolgolyov/Learn_System
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(lab): phase 3 — token purification across lab.html / lab.css / lab-glue.js

Browse Source 
Replaced ~100 hardcoded brand colors with var() tokens across 3 files.
Kept: tinted-alpha colors (rgba(155,93,229,.x)), canvas fillStyle (vars
don't resolve there), curated SVG card-preview palettes (P_GRAPH, P_MAGNETIC,
etc.), physics-convention colors (#EF476F for positive charges, #4CC9F0 for
negative), slightly-different decorative shades (#EF476F ≠ #F15BB5).

lab.css: #9B5DE5→var(--violet), #06D6E0→var(--cyan), #F15BB5/nscene→var(--pink),
  #0F172A (filter.active)→var(--text), fn-color defaults, trig btn defaults.
lab.html: stat bars, slider labels, info-fn-dot, toggle-dot, panel badges,
  section-specific color coding (violet=wave1/param1, cyan=wave2/param2).
lab-glue.js: toggleTheory() JS style assignments, template-literal HTML headings.

Before: ~265 hardcodes   After: ~60 (canvas+curated+rgba+physics-convention)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Maxim Dolgolyov
2026-05-22 22:51:28 +03:00
parent 92b5c39860
commit 6792a4a5c7
3 changed files with 150 additions and 150 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/js/labs/lab-glue.js
+4 -4
View File
@@ -689,8 +689,8 @@
document.getElementById('theory-panel').classList.toggle('open', _theoryOpen);
const btn = document.getElementById('theory-toggle');
btn.style.background = _theoryOpen ? 'rgba(155,93,229,0.15)' : '';
btn.style.borderColor = _theoryOpen ? '#9B5DE5' : '';
btn.style.color = _theoryOpen ? '#9B5DE5' : '';
btn.style.borderColor = _theoryOpen ? 'var(--violet)' : '';
btn.style.color = _theoryOpen ? 'var(--violet)' : '';
}
function loadTheory(simId) {
@@ -796,7 +796,7 @@
document.getElementById('sim-grid').innerHTML =
`<div style="grid-column:1/-1;padding:60px 0;text-align:center;color:var(--text-3)">
<div style="font-size:2rem;margin-bottom:12px"><svg class="ic" viewBox="0 0 24 24"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg></div>
<div style="font-family:'Unbounded',sans-serif;font-size:1rem;font-weight:800;color:#0F172A;margin-bottom:6px">Доступ к симуляциям закрыт</div>
<div style="font-family:'Unbounded',sans-serif;font-size:1rem;font-weight:800;color:var(--text);margin-bottom:6px">Доступ к симуляциям закрыт</div>
<div style="font-size:.88rem">Администратор ограничил доступ к лаборатории</div>
</div>`;
return;
@@ -812,7 +812,7 @@
document.getElementById('sim-grid').innerHTML =
`<div style="grid-column:1/-1;padding:60px 0;text-align:center;color:var(--text-3)">
<div style="font-size:2rem;margin-bottom:12px"><svg class="ic" viewBox="0 0 24 24"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg></div>
<div style="font-family:'Unbounded',sans-serif;font-size:1rem;font-weight:800;color:#0F172A;margin-bottom:6px">Модуль симуляций отключён</div>
<div style="font-family:'Unbounded',sans-serif;font-size:1rem;font-weight:800;color:var(--text);margin-bottom:6px">Модуль симуляций отключён</div>
<div style="font-size:.88rem">Администратор временно отключил лабораторию</div>
</div>`;
} else {