docs: add new design references

2026-08-27 16:02:08 +05:00
parent 83d3ce1198
commit 84534b2f58
28 changed files with 17131 additions and 0 deletions
@@ -0,0 +1,37 @@
+# refs-html — статические снимки нового дизайна
+
+Отформатированный HTML, вытащенный из Next-референса `refs/`, чтобы смотреть
+макеты как референс по разметке и классам: открыл файл в браузере — увидел
+дизайн.
+
+## Файлы
+
+| Файл                      | Маршрут в refs                       | Что показывает                                      |
+| ------------------------- | ------------------------------------ | --------------------------------------------------- |
+| `index.html`              | `/`                                  | Главная: пайплайн-воркспейс + панель превью         |
+| `demo.html`               | `/easy-png-tools/demo`               | То же, что главная (зеркало)                        |
+| `gradient.html`           | `/easy-png-tools/gradient`           | Инструмент «Градиент»: настройки + превью + CSS     |
+| `background-remover.html` | `/easy-png-tools/background-remover` | Инструмент «Удаление фона»: сравнение source/result |
+
+## Особенности
+
+- **Это статика без JS**: все `<script>` удалены, интерактивности нет.
+  Тумблеры/кнопки/слайдеры не кликаются — это витрина состояний по умолчанию.
+- Разметка отформатирована (отступы), CSS темы заинлайнен и причёсан —
+  файлы автономны, работают с `file://`.
+- Тема по умолчанию: `gradient.html` и `background-remover.html` отрисованы
+  в тёмной (так в коде рефа), `index.html`/`demo.html` — в светлой. Чтобы
+  посмотреть светлый вариант тёмных страниц — убрать класс `dark-mode` у
+  `.app-shell`; для тёмной главной — добавить его же.
+- Источник правды по пикселям — код в `refs/`; здесь только витрина.
+
+## Как перегенерировать
+
+```powershell
+cd refs
+pnpm install                                              # если ещё не ставили
+node node_modules\next\dist\bin\next build               # output: 'export' включён в next.config.mjs
+node extract-static.mjs .next\server\app ..\refs-html    # форматирование, инлайн-CSS, без скриптов
+```
+
+Скрипт: `refs/extract-static.mjs`.