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/; здесь только витрина.
Как перегенерировать
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.