diff --git a/docs/backlog.md b/docs/backlog.md index b7f72c6..5e4a85c 100644 --- a/docs/backlog.md +++ b/docs/backlog.md @@ -1,3 +1,28 @@ # Backlog -(пусто — выполненные волны лежат в docs/archive/; кандидат на следующую волну: текст и водяные знаки — add-text, watermark, штампы, см. roadmap фаза 1.5 и план wave3 §7.) +## Кандидат следующей волны + +Текст и водяные знаки — add-text, watermark, штампы (см. roadmap фаза 1.5 и план wave3 §7). + +## Идеи + +1. **Менять первый инструмент цепочки** — оценка M. + Сейчас базовый инструмент зафиксирован при открытии страницы; хочется заменить его на другой без разборки цепочки: шаги и их параметры сохраняются, вход перечитывается. Открытый вопрос: что делать с несовместимыми параметрами (text-source ↔ file). + +2. **UI-эксперимент: параметры между исходником и результатом** — оценка S/M. + Раскладка «Исходник → Параметры → Результат» в один ряд вместо параметров отдельным блоком снизу. Проверить на узких экранах; возможно за флагом/A-B, чтобы сравнить с текущей. + +3. **Сворачивать инструменты в chain** — оценка S. + Тоггл сворачивания звена до заголовка «Шаг n: название» (превью скрываются). Состояние свёрнутости помнить в workspace-pipeline. + +4. **Несколько цепочек: сохранение и загрузка** — оценка M. + Именованные цепочки в localStorage (список, создать/переименовать/удалить), быстрое переключение. Формат экспортного JSON расширить опциональным полем имени, старые файлы читаются как безымянные. + +5. **Batch-обработка архивов выбранным chain** — оценка L. + Вход — zip-архив картинок (распаковка в браузере), прогон текущего или выбранного сохранённого chain по каждому файлу, сборка результата обратно в zip для скачивания. Зависит от п.4 (выбор цепочки) и от экспортного формата pipeline JSON; прогресс и ошибки — пофайлово. + +6. **Избранные инструменты (fav tools)** — оценка S/M. + Тоггл-звёздочка на карточках каталога, результатах поиска и в шапке страницы инструмента; список id в localStorage. Избранное показывается отдельной секцией сверху каталога и поднимается в выдаче поиска (бонус к popularity при скоринге). + +7. **Светлая/тёмная тема** — оценка S/M. + Переключатель в шапке рядом с языком; выбор в localStorage, по умолчанию — системная. Все цвета на CSS-переменных, включая шахматку прозрачности — нужна палитра тёмных токенов и защита от вспышки светлого при загрузке. diff --git a/docs/plan-theme.md b/docs/plan-theme.md new file mode 100644 index 0000000..4eff7d5 --- /dev/null +++ b/docs/plan-theme.md @@ -0,0 +1,46 @@ +# План: светлая и тёмная тема + +> Статус: план к выполнению. + +## 1. Что получается + +Переключатель light/dark в шапке рядом с языковым. Выбор в localStorage (`theme`), первый визит — по `prefers-color-scheme`. Тёмная палитра — переопределение токенов селектором `[data-theme='dark']`; компоненты не правятся. + +## 2. Решения + +- Два состояния, без «авто»: ключ хранит только явный выбор, отсутствие ключа = системная тема. +- Анти-вспышка: инлайн-скрипт в `app.html` до гидрации ставит `data-theme` из localStorage или `matchMedia`; пререндеренная разметка остаётся светлой. +- `color-scheme: dark` на корне — нативные контролы (input[type=color], range, select, скроллбары) темнеют без правок. +- Модуль `theme.svelte.ts` по образцу locale: состояние, персист, применение атрибута. Стартовую установку делает скрипт из `app.html`, модуль синхронизирует runes-состояние после гидрации. + +## 3. Палитра + +- Переопределяем: `--bg`, `--surface`, `--border`, `--text`, `--text-muted`. +- Акцент `#2563eb` не меняется; `--accent-hover` — светлее для тёмного фона. +- `--danger` осветлить для читаемости. +- `--check-a`/`--check-b` шахматки — приглушённые серые: паттерн прозрачности остаётся узнаваемым, но не слепит. +- `--shadow-card` — почти чёрная с низкой альфой вместо синей. +- Все `color-mix(… var(--surface))` пересчитаются сами — проверить визуально легенды, recalc-бейдж, drag-оверлеи. + +## 4. Этапы и проверки + +Каждый этап заканчивается зелёными test/check/build и ревью. + +- **A. Инфраструктура** — `theme.svelte.ts`, скрипт в `app.html`, переключатель в шапке, черновая тёмная палитра. Тесты: персист выбора, игнор мусора в localStorage, применение атрибута (стаб document). +- **B. Палитра** — выверка значений: герой, каталог, страница инструмента, цепочка, баннер ошибки, маска, текстовые инструменты; фокус-ринги и hover; обе локали. + +## 5. Смоук + +1. Переключение мгновенное, без перезагрузки; выбор переживает её же. +2. При системной тёмной теме первый визит открывается сразу тёмным. +3. Нативные контролы выглядят тёмными. +4. Шахматка различима, легенды и бейджи читаемы. +5. Баннер ошибки и пипетка заметны на тёмных панелях. + +## 6. Критерий готовности + +Grep: ни одного цвета вне токенов в компонентах и маршрутах. + +## 7. Не делаем + +Три позиции в переключателе; пользовательские цветовые схемы; автосмену по времени суток; отдельную тему для превью изображений.