From 991c08e1970d385ecd99cb891751db99e7e3b4a2 Mon Sep 17 00:00:00 2001 From: Alex Cube Date: Tue, 27 Oct 2026 19:17:11 +0300 Subject: [PATCH] =?UTF-8?q?=D0=9F=D0=B5=D1=80=D0=B5=D0=BA=D0=BB=D1=8E?= =?UTF-8?q?=D1=87=D0=B0=D1=82=D0=B5=D0=BB=D1=8C:=20=D1=81=D0=B2=D0=B5?= =?UTF-8?q?=D1=82=D0=BB=D0=B0=D1=8F=20=D1=80=D1=83=D1=87=D0=BA=D0=B0,=20?= =?UTF-8?q?=D0=B1=D1=83=D0=BA=D0=B2=D0=B0=20=D0=B1=D0=B5=D0=BB=D1=8B=D0=BC?= =?UTF-8?q?=20=D0=B2=20=D0=BA=D1=80=D0=B0=D1=81=D0=BD=D0=BE=D0=BC=20=D0=BA?= =?UTF-8?q?=D1=80=D1=83=D0=B6=D0=BA=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Claude Opus 5.5 --- index.html | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/index.html b/index.html index 02ff61e..54122c9 100644 --- a/index.html +++ b/index.html @@ -502,12 +502,12 @@ table.tt { border-collapse: collapse; font-family: var(--font-mono); font-size: const g = E('g', { class: 'hit', tabindex: 0, role: 'switch' }); E('circle', { cx: 896, cy, r: 40, fill: '#efede6', stroke: '#b7b3a7', 'stroke-width': 3, class: 'focusring' }, g); const knob = E('g', { style: `transition: transform .18s ease; transform-origin: 896px ${cy}px` }, g); - // red disc with a bar handle, as on the real machine; white marks show which way it is turned - E('circle', { cx: 896, cy, r: 31, fill: '#c8222c', stroke: '#8f141d', 'stroke-width': 2 }, knob); - E('rect', { x: 882, y: cy - 38, width: 28, height: 76, rx: 5, fill: '#d42a35', stroke: '#8f141d', 'stroke-width': 2 }, knob); - E('line', { x1: 896, y1: cy - 10, x2: 896, y2: cy + 10, stroke: '#fff', 'stroke-width': 2.5 }, knob); - E('text', { x: 896, y: cy - 17, 'text-anchor': 'middle', 'font-family': 'PT Sans, sans-serif', 'font-weight': 700, 'font-size': 18, fill: '#fff' }, knob).textContent = name; - E('text', { x: 896, y: cy + 31, 'text-anchor': 'middle', 'font-family': 'PT Sans, sans-serif', 'font-weight': 700, 'font-size': 18, fill: '#fff' }, knob).textContent = [4, 2, 1][r]; + E('rect', { x: 881, y: cy - 40, width: 30, height: 80, rx: 4, fill: '#f8f7f2', stroke: '#2a2d33', 'stroke-width': 2 }, knob); + E('line', { x1: 896, y1: cy - 6, x2: 896, y2: cy + 12, stroke: '#2a2d33', 'stroke-width': 2 }, knob); + // the letter sits in a red dot, so the turn of the knob reads at a glance + E('circle', { cx: 896, cy: cy - 23, r: 12, fill: '#c8222c' }, knob); + E('text', { x: 896, y: cy - 17, 'text-anchor': 'middle', 'font-family': 'PT Sans, sans-serif', 'font-weight': 700, 'font-size': 17, fill: '#fff' }, knob).textContent = name; + E('text', { x: 896, y: cy + 33, 'text-anchor': 'middle', 'font-family': 'PT Sans, sans-serif', 'font-style': 'italic', 'font-size': 18, fill: '#2a2d33' }, knob).textContent = [4, 2, 1][r]; g.addEventListener('click', () => setSwitch(r, S.inp[r] === null ? 1 : 1 - S.inp[r])); return { g, knob }; });