mirror of
https://github.com/Ku6epXBOCTuK/easy-png-tools.git
synced 2026-09-14 21:46:35 +00:00
38 lines
2.7 KiB
Markdown
38 lines
2.7 KiB
Markdown
# 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`.
|