diff --git a/docs/plan-theme.md b/docs/archive/plan-theme.md similarity index 98% rename from docs/plan-theme.md rename to docs/archive/plan-theme.md index 4eff7d5..ed86b29 100644 --- a/docs/plan-theme.md +++ b/docs/archive/plan-theme.md @@ -1,6 +1,6 @@ # План: светлая и тёмная тема -> Статус: план к выполнению. +> **СТАТУС: ВЫПОЛНЕН 25.08.2026.** ## 1. Что получается diff --git a/docs/backlog.md b/docs/backlog.md index 5e4a85c..9b90f8a 100644 --- a/docs/backlog.md +++ b/docs/backlog.md @@ -23,6 +23,3 @@ 6. **Избранные инструменты (fav tools)** — оценка S/M. Тоггл-звёздочка на карточках каталога, результатах поиска и в шапке страницы инструмента; список id в localStorage. Избранное показывается отдельной секцией сверху каталога и поднимается в выдаче поиска (бонус к popularity при скоринге). - -7. **Светлая/тёмная тема** — оценка S/M. - Переключатель в шапке рядом с языком; выбор в localStorage, по умолчанию — системная. Все цвета на CSS-переменных, включая шахматку прозрачности — нужна палитра тёмных токенов и защита от вспышки светлого при загрузке. diff --git a/docs/plan-inline-params.md b/docs/plan-inline-params.md new file mode 100644 index 0000000..e63a84e --- /dev/null +++ b/docs/plan-inline-params.md @@ -0,0 +1,50 @@ +# План: параметры между исходником и результатом + +> Статус: план к выполнению. + +## 1. Что получается + +Альтернативная раскладка этапа инструмента: три колонки «Исходник | Параметры | Результат» на широких экранах, вертикальный стек на узких. Цель — отдать вариант дизайнеру как отправную точку. Откат к текущей раскладке — замена одной строки в `ToolPage`. + +## 2. Решения + +- Два взаимозаменяемых компонента этапа с одинаковым набором пропсов; `ToolPage` рендерит один тег. Попробовать новое — поменять компонент в этом теге; вернуть старое — поменять обратно. Никаких флагов и конфигов. +- Общая типизация пропсов в одном файле рядом с компонентами; сами карточки (`SourceCard`, `ResultCard`, `TextInputCard`, `ParamsCard`) переиспользуются как есть — вся логика исполнения, маски, пипетки и автозапуска остаётся в `ToolPage` и приходит сверху. +- Chain-звенья не затрагиваются: у них своя раскладка «Вход | Результат», эксперимент только про базовый этап. +- Один порог отзывчивости: три колонки от ~75rem, ниже — стек «исходник → параметры → результат». Промежуточные перестроения не придумываем до фидбека дизайнера. + +## 3. Компоненты + +```txt +src/lib/components/stage/ + stage-props.ts # интерфейс StageProps + сборщик дефолтов + ToolStageClassic.svelte # текущая разметка .tool-stage, перенесена 1:1 из ToolPage + ToolStageInline.svelte # новая сетка [source | params | result] +``` + +- `ToolStageClassic` — вырезка существующего шаблона со стилями; после извлечения страница должна быть пиксель-в-пиксель прежней. +- `ToolStageInline` — grid-колонки `minmax(0, 1fr) | фикс-ширина параметров | minmax(0, 1fr)`; легенда «Параметры» над средней колонкой в том же стиле edge-legend. +- Модификаторы состояний через классы на корне компонента: `no-params` (инструменты без параметров → две колонки), `no-source` (генераторы → параметры и результат), текстовый вход до декодирования занимает левую ячейку как сейчас. + +## 4. Этапы и проверки + +Каждый этап заканчивается зелёными test/check/build и ревью. + +- **A. Извлечение классики** — перенос разметки и стилей этапа из `ToolPage` в `ToolStageClassic` без изменений поведения; пропсы собираются в одном объекте. Критерий: страница неотличима, diff по логике `ToolPage` нулевой. +- **B. Инлайн-раскладка** — `ToolStageInline`, переключение в `ToolPage` на новый компонент, прогон смоука §5. Ревью в браузере; решение дизайнера — потом, код уже позволяет жить в обоих вариантах. + +## 5. Смоук + +1. Замена компонента этапа — одна строка; обе версии собираются без предупреждений. +2. Инструмент без параметров (например Автоконтраст): две колонки, пустой середины нет. +3. Генератор без исходника: параметры и результат в две колонки. +4. Текстовый инструмент до декодирования: вход слева, параметры в центре, пустое состояние результата справа. +5. Маска, пипетка, слайдеры в средней колонке; изменение параметра перезапускает инструмент как раньше. +6. Узкий экран: стек без горизонтального скролла, порядок исходник → параметры → результат. +7. Легенды присутствуют у всех трёх зон в обеих раскладках. + +## 6. Что сознательно не делаем + +- Редизайн визуального языка (цвета, типографика, формы) — материал для дизайнера, не для этого плана. +- Перестройка chain-звеньев под новую сетку. +- Новая логика: исполнение, автосохранение, пресеты — раскладка ничего не знает про исполнение.