refactor: заменить shiki на самописный highlighter и обновить архитектуру

- Удалён shiki (9.5→0 МБ), создан regex-токенизатор для html/css/xml
- CLI переведён с аргументов на конфиг-файл svg-sprites.config.ts
- Превью переработано: React-приложение вместо инлайн HTML
- Добавлен футер с названием пакета и ссылкой на репозиторий
- Исправлена загрузка dev-data.js для Vite 8
- Футер прижат к низу, содержимое центрировано
This commit is contained in:
2026-04-22 16:54:35 +03:00
parent aad1c97f50
commit e77e7dfcf1
154 changed files with 9083 additions and 516 deletions

View File

@@ -0,0 +1,35 @@
---
title: Стилизовать компонент
---
# Стилизовать компонент
Инструкция по выбору подхода к стилизации и написанию стилей для компонента.
## Прочитай перед началом
- applied/styles.md — правила CSS: PostCSS Modules, токены, медиа-запросы
## Шаги
1. Определи подход (→ applied/styles.md):
- Mantine-компонент → используй пропсы Mantine, не пиши CSS
- CSS-токены достаточно → используй токены
- Нужна кастомная стилизация → PostCSS Modules
2. Создай файл стилей `{component-name}.module.css` рядом с компонентом.
3. Напиши стили по правилам (→ applied/styles.md).
4. Подключи стили в компоненте через `cl()`.
## Смежные триггеры
- triggers/develop/create-component.md — если компонент ещё не создан
- triggers/develop/add-icon.md — если нужна иконка в компоненте
## Проверь себя
- [ ] Приоритет стилизации соблюдён: Mantine → токены → PostCSS Modules
- [ ] Нет инлайн-стилей и магических значений
- [ ] Файл стилей именован `{component-name}.module.css`