web-publish — фронтенд-стек и публикация демо-страниц

Два правила оператора. Раньше — §26 и §29 глобального CLAUDE.md, перенесены дословно: нужны только при фронтенд-работе и публикации, а не в каждой сессии.

1. UI/React-инструментарий — дефолты для генерации фронтенда (§26, НАВСЕГДА, 2026-06-30)

ИМПЕРАТИВ: любая фронтенд-работа (React/Next/Vue/Svelte) идёт по фиксированному стеку, не выбирать каждый раз заново (обоснованное отклонение допустимо — зафиксировать причину):

• Design knowledge (стили/палитры/шрифты/UX-гайды/типы графиков) → скилл ui-ux-pro-max-skill (vendored, 7 sub-skills).
• Готовый React-код по описанию (/ui …) → MCP magic (@21st-dev/magic). 2026-07-11 (#SYS-2): из user-scope удалён (плодил экземпляр в каждой сессии, пик 28 шт/~2 ГБ) — подключать точечно -s project в UI-проектах; restore: <home>\.claude\magic-mcp-restore.txt.
• Анимации → framer-motion (npm MIT, motion/react; новые проекты motion после v11-ребренда).

Фазы: Design → Generate (magic) → Animate (framer-motion) → Polish (accessibility/bundle/SSR). Карв-ауты, таблица «где живёт», provenance: <home>\.claude\references\ui-react-toolkit.md.

2. Публикация демо-страниц — дефолтный метод (§29, НАВСЕГДА, 2026-07-10)

Зафиксировано оператором 2026-07-10: «запомни этот метод для демостраниц. используй по умолчанию».

ИМПЕРАТИВ: любую самодостаточную демо/витрину (дизайн-макет, отчёт-эксперимент, интерактив) публикую дефолтом в github.com/VibeEngineering-LLC/demo-web-pages (public, GitHub Pages) — папкой <slug>/index.html, живой URL https://vibeengineering-llc.github.io/demo-web-pages/<slug>/. Auth: gh как Verter73.

Artifact-файл (контент без <!doctype>/<head>) ПЕРЕД пушем обернуть в полный документ (разрез по первому </style>: title+style→<head>, остальное→<body>, каркас lang="ru"+charset+viewport).

Гейты:

1. Секрет-скан файла до пуша (<имя-клиента>|<ИНН>|<id-хостинг-аккаунта>|<имя-хостинга>|<личная-облачная-папка>|<имя-менеджера-секретов> → 0 совпадений; приватный проект-агент наружу не идёт, только чистые витрины).
2. git add конкретного пути, НИКОГДА -A.
3. Публикация в public — явная команда оператора на конкретную страницу.
4. Типографика (раздел ниже): grep -cE "text-align:\s*justify" → 0, и у каждого текстового блока задан предел длины строки.

Метод, код-обёртка, шаги: <home>\.claude\references\demo-web-pages-publish.md.

3. Типографика — выключка и длина строки (оператор, 2026-08-27, ПОВТОРНОЕ замечание)

Граница применения (2026-09-19). Этот раздел — для демо-витрин и прочих страниц. Для СТАТЕЙ (rn-article-style §6, #TXT-1/#TXT-2, указание оператора, более позднее) действует ОБРАТНОЕ: выключка по ширине с hyphens:auto, без max-width в символах, приёмка grep -cE "max-width:\s*[0-9]+ch" → 0. Статья, публикуемая на площадке, проходит по правилам статьи, а не по этому разделу; иначе приёмки противоречат друг другу. Не решено оператором: относится ли позднее указание 06.09 и к витринам — до ответа для витрин остаётся текст ниже.

ИМПЕРАТИВ: текст выключается ВЛЕВО, text-align: justify не применять никогда. Дословно: «и опять выравнивание текста по ширине!!!! сколько можно? самообучайся!». Без переносов выключка по формату рвёт строки «реками» пробелов, тем сильнее, чем длиннее слова — а русские термины длинные.

Вторая половина требования — ДЛИНА СТРОКИ, и практически она важнее. В инциденте 27.08 justify в CSS не было вовсе: абзацы врезок шли во всю ширину листа (>1100 px) и читались как выключка по формату. Ограничивать ширину надо у ВСЕХ текстовых блоков, а не только у вводного абзаца — врезки, списки и подписи забываются первыми.

Готовый блок, вставлять в каждую страницу:

body,p,li,td,th,figcaption,caption{text-align:left}
p,li{max-width:78ch;text-wrap:pretty}
.note p,.warn li,.warn p{max-width:74ch}   /* врезки — про них и забыл */

Правило для числовых колонок (th,td{text-align:right}) ставить ПОСЛЕ этого блока, иначе числа съедут влево.

Санитизация публичных страниц (действует и здесь): не упоминать реальные имена агентов и контуров, имена приватных скиллов (сетевых, секретарских, финансовых, поисковых по личным документам, проектных), адреса локальной сети, имена и контакты третьих лиц, детали межсессионного канала и сетевой инфраструктуры.

Известное состояние площадки (на 2026-08-14)

Репозиторий VibeEngineering-LLC/demo-web-pages — public, ~21 МБ. Локальный клон в Temp был выеден очисткой временных файлов (.git без HEAD) — перед следующей публикацией клонировать заново, не рассчитывать на старый чекаут.