Give the pages one switch and one prefix each

Three pages had reimplemented the same sliding toggle, and two both claimed
vv-set-* with disjoint class names, which reads as shared and is not.
This commit is contained in:
Gmer4Lfe
2026-08-11 21:59:27 -04:00
parent 67510b8fad
commit 999dbcfdf3
4 changed files with 46 additions and 64 deletions
+1 -5
View File
@@ -95,10 +95,6 @@
/* Settings */
.vv-ry-set-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:6px; }
.vv-ry-toggle { display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none; }
.vv-ry-toggle-track { width:32px;height:18px;border-radius:9px;background:#222;border:1px solid #333;position:relative;transition:background .15s,border-color .15s;flex-shrink:0; }
.vv-ry-toggle-track.on { background:#1a3a1a;border-color:#2d5a2d; }
.vv-ry-toggle-track::after { content:'';position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:#555;transition:left .15s,background .15s; }
.vv-ry-toggle-track.on::after { left:16px;background:#4caf50; }
.vv-ry-toggle-lbl { font-size:11px;color:#666; }
.vv-ry-set-row { display:flex;align-items:center;gap:10px;margin:4px 0; }
.vv-ry-set-lbl { font-size:11px;color:#555;width:130px;flex-shrink:0; }
@@ -852,7 +848,7 @@ function _startLogPoll() {
function _toggle(name, currentVal, label) {
const id = 'vv-ry-tog-' + name;
return `<label class="vv-ry-toggle" title="${name}">
<div class="vv-ry-toggle-track ${currentVal ? 'on' : ''}" id="${id}"
<div class="vv-cf-track ${currentVal ? 'on' : ''}" id="${id}"
onclick="vvRyToggle(this,'${name}')"></div>
<span class="vv-ry-toggle-lbl">${label}</span>
</label>`;