byrsapty
c7fecfba0b
МЕНЮ. Шість груп, разом 1246 px при вікні 720 — довше за екран. Тепер згортаються, стан живе в localStorage як перелік ЗГОРНУТИХ (не розгорнутих: інакше кожна нова група приїхала б до наявних користувачів схованою). Ключ групи окремо від заголовка — підписи тут уже переписували, і якби ключем був заголовок, кожне переписування слова тихо скидало б налаштування всім. Група з активною сторінкою розгортається сама, але рівно одна — вибір для решти не чіпається. Правка стану на ЗМІНІ шляху, а не на кожному рендері, тож згорнути активну групу теж можна. Дві наявні поломки мобільного вигляду, знайдені дорогою: рейка вмикалась класами md:, а розгалуження заголовок/риска було на JS і про md: не знало — людина згортала панель на моніторі, і в шухляді на телефоні ЗНИКАЛИ ВСІ назви розділів. ЛОГО. Пульс на лінії зв'язку: вузол → сплеск → провал → норма → вузол. Два вузли по краях — ключова деталь: без них це іконка «activity» з будь-якого безкоштовного набору, з ними кардіограма стає лінією між двома точками мережі. SVG кодом, не растр: слідує темі через currentColor, важить сотні байтів. Три РІЗНІ малюнки, а не один масштабований: повне лого, знак, і спрощений для 16 px усередині favicon.ico (зібраний власним кодувальником на zlib, без сторонніх інструментів). Пульсація вузла — опційна й типово вимкнена: у шапці вона конкурувала б зі справжнім показником зв'язку, який стоїть поруч. ПОЛЯ З ПІДКАЗКОЮ. Field малює підказку під контролем, тож у ряду з вирівнюванням по низу колонка з підказкою вища — її підпис і поле спливають угору, а гола кнопка з'їжджає вниз. Видно було в словнику трапів; та сама вада знайшлась у редакторі фільтра портів. Ряди вирівняно по верху, а кнопки без підпису загорнуто у FieldGap — порожній підпис такої самої висоти. Відступ у пікселях полагодив би один ряд і роз'їхався б від зміни розміру шрифту. Перевірено очима в живому Chrome: іконки віддаються (4/4, правильні типи й розміри), лого 64×64 на сторінці входу, праве коло справді sky-400 і пульсує лише там.
1.2 KiB
32x32px
1.2 KiB
32x32px
