From 7a8500777771e6bc2c2277cc7933a6aba4fd8871 Mon Sep 17 00:00:00 2001 From: Maxim Dolgolyov Date: Wed, 27 May 2026 15:18:47 +0300 Subject: [PATCH] =?UTF-8?q?fix(algebra-8=20ch2):=20=D1=81=D0=BB=D0=BE?= =?UTF-8?q?=D0=BC=D0=B0=D0=BD=D0=BD=D0=B0=D1=8F=20=D0=B2=D1=91=D1=80=D1=81?= =?UTF-8?q?=D1=82=D0=BA=D0=B0=20=D1=81=D0=BB=D0=B0=D0=B9=D0=B4=D0=B5=D1=80?= =?UTF-8?q?=D0=BE=D0=B2,=20=D0=BF=D1=80=D0=BE=D0=BA=D0=B0=D1=87=D0=B0?= =?UTF-8?q?=D0=BD=D1=8B=20=D0=BF=D0=BE=D0=B4=D1=81=D0=BA=D0=B0=D0=B7=D0=BA?= =?UTF-8?q?=D0=B8=20=D0=B8=20=D1=88=D0=BF=D0=B0=D1=80=D0=B3=D0=B0=D0=BB?= =?UTF-8?q?=D0=BA=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Слайдеры (.sliders label): убран flex-direction:column, который раскладывал KaTeX-span / '=' / / на 4 строки. Теперь label = block, всё на одной строке, slider — на следующей. - .wg-help: вместо мелкого курсива — полноценный hint-box с жёлтым градиентом, левой полосой и круглым «?» слева. Совпадает по визуалу с главой 1. - Шпаргалка: добавлена кнопка «Шпаргалка» в шапке, на узких экранах (≤980px) col-side превращается в выезжающий справа drawer с backdrop'ом, открывается по кнопке/закрывается по клику вне или Esc. - initSidebarToggle() вызывается из init(). --- frontend/textbooks/algebra_8_ch2.html | 41 +++++++++++++++++++++++---- 1 file changed, 36 insertions(+), 5 deletions(-) diff --git a/frontend/textbooks/algebra_8_ch2.html b/frontend/textbooks/algebra_8_ch2.html index bc51699..7113dae 100644 --- a/frontend/textbooks/algebra_8_ch2.html +++ b/frontend/textbooks/algebra_8_ch2.html @@ -139,7 +139,9 @@ input,select,textarea{font-family:inherit} .wg-header{display:flex;align-items:center;gap:8px;margin-bottom:14px} .wg-badge{padding:4px 9px;background:var(--sec-acc,var(--pri));color:#fff;border-radius:6px;font-family:'Unbounded',sans-serif;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em} .wg-title{font-family:'Unbounded',sans-serif;font-size:1.05rem;font-weight:800;color:var(--sec-acc-d,var(--pri2));flex:1} -.wg-help{font-size:.78rem;color:var(--muted);font-style:italic;margin-bottom:10px;line-height:1.5} +.wg-help{font-size:.88rem;color:var(--text);margin-bottom:12px;line-height:1.55;background:linear-gradient(135deg,var(--warn-bg,#fef3c7),var(--sec-acc-soft,var(--pri-soft)));border-left:4px solid var(--warn,#f59e0b);padding:9px 14px;border-radius:9px;position:relative} +.wg-help::before{content:'?';position:absolute;left:-13px;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:50%;background:var(--warn,#f59e0b);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:.78rem;box-shadow:0 2px 6px rgba(0,0,0,.18)} +.dark .wg-help{background:linear-gradient(135deg,rgba(245,158,11,.18),rgba(233,30,99,.10))} .btn{padding:8px 16px;border-radius:8px;background:var(--card);color:var(--text);border:1.5px solid var(--border);font-weight:600;font-size:.88rem;transition:background .15s,border-color .15s,transform .1s} .btn:hover{background:var(--sec-acc-soft,var(--pri-soft));border-color:var(--sec-acc,var(--pri))} @@ -250,9 +252,10 @@ input,select,textarea{font-family:inherit} /* SLIDERS / DROP / ACTIONS */ .sliders{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-bottom:10px} -.sliders label{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:var(--muted);background:var(--card);padding:8px 10px;border-radius:8px;border:1px solid var(--border)} -.sliders label b{font-family:'JetBrains Mono',monospace;font-size:1.05rem;color:var(--sec-acc-d,var(--pri2))} -.sliders input[type="range"]{width:100%;accent-color:var(--sec-acc,var(--pri))} +.sliders label{display:block;font-size:.92rem;color:var(--muted);background:var(--card);padding:8px 12px;border-radius:8px;border:1px solid var(--border);line-height:1.5} +.sliders label .katex{font-size:1em} +.sliders label b{font-family:'JetBrains Mono',monospace;font-size:1.05rem;color:var(--sec-acc-d,var(--pri2));margin-left:4px} +.sliders label input[type="range"]{display:block;width:100%;margin-top:6px;accent-color:var(--sec-acc,var(--pri))} .drop-box{background:var(--card);border:1.5px dashed var(--border);border-radius:10px;padding:10px;min-height:90px;transition:border-color .15s,background .15s} .drop-box:hover{border-color:var(--sec-acc,var(--pri));background:var(--sec-acc-soft,var(--pri-soft))} .drop-box h5{font-family:'Unbounded',sans-serif;font-size:.78rem;color:var(--sec-acc-d,var(--pri2));margin-bottom:8px;text-transform:uppercase;letter-spacing:.05em} @@ -262,6 +265,14 @@ input,select,textarea{font-family:inherit} .actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px} .eq-show{font-family:'JetBrains Mono',monospace} .pipe-tabs .btn.active{background:var(--sec-acc,var(--pri));color:#fff;border-color:var(--sec-acc,var(--pri))} + +/* SIDEBAR DRAWER for narrow viewports */ +.col-side-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.42);z-index:9990;display:none;animation:fadeIn .18s ease} +.col-side-backdrop.show{display:block} +@media(max-width:980px){ + .col-side{position:fixed;top:0;right:0;height:100vh;width:300px;max-width:88vw;background:var(--bg);box-shadow:-12px 0 24px rgba(0,0,0,.18);padding:18px 16px;overflow-y:auto;transform:translateX(100%);transition:transform .25s ease;z-index:9991;max-height:none} + .col-side.open{transform:none} +} @@ -277,6 +288,10 @@ input,select,textarea{font-family:inherit} Глава 1 +