Fastry поставляется с разумными настройками по умолчанию. В этом посте документирована каждая значимая опция, которую вы можете изменить — что она делает, где её найти и какое значение установить.
Основной конфигурационный файл
Почти всё находится в src/config/site.config.ts. Откройте его, и вы увидите полный объект siteConfig. Поля, которые вы, скорее всего, измените:
name: 'Название вашего сайта', // Логотип, заголовки, копирайт
url: 'https://yoursite.com', // Канонические URL и карта сайта
author: 'Ваше Имя',
email: 'hello@yoursite.com',
Поле name не только косметическое — оно используется в структурированных данных, Open Graph-тегах и автогенерируемом фавиконе. Установите его точно с самого начала.
Цветовые темы
Fastry поставляется с 12 цветовыми темами. Все 12 отображаются в виде цветных квадратиков в шапке через компонент ThemeSelector. Нажатие на квадратик мгновенно меняет активную тему — никаких правок файлов, никакой пересборки.
Изменение активной темы
Тема по умолчанию устанавливается с помощью data-theme на элементе <html> в src/layouts/BaseLayout.astro:
data-theme="indigo"
Доступные значения — все 12 тем: orange, amber, lime, emerald, teal, cyan, sky, blue, indigo, violet, purple, magenta.
Понимание OKLCH — три числа
Все цветовые значения в Fastry используют цветовое пространство OKLCH: oklch(светлота% хрома оттенок).
Настройка брендового цвета темы
Каждая тема — это CSS-файл в src/styles/themes/. Откройте соответствующий файл и настройте шкалу --brand-* — все десять шагов от 50 до 900:
html[data-theme="indigo"] {
--brand-50: oklch(97.5% 0.02 264);
--brand-500: oklch(60% 0.24 264); /* основной акцент в светлой теме */
--brand-900: oklch(26% 0.09 264);
}
Чтобы перейти к другому цвету, замените 264 (индиго) на нужный оттенок во всех десяти строках.
Шапка: плавающая капсула vs. фиксированная панель
Fastry имеет два варианта шапки. Макеты Landing и Marketing используют плавающую капсулу, а макеты блога и стандартных страниц — панель на всю ширину.
Подвал
Строка копирайта в подвале читается из пропса copyright. Передача пользовательского значения переопределяет его:
<Footer copyright="© {year} Ваше Имя. Все права защищены." />
Плейсхолдеры {year} и {siteName} заменяются автоматически во время сборки.
Навигация
Отредактируйте src/config/nav.config.ts, чтобы изменить навигацию в шапке и подвале в одном месте. Добавляйте, удаляйте или меняйте порядок пунктов свободно.
Быстрая справка
| Что | Где | Ключ |
|---|---|---|
| Имя сайта | src/config/site.config.ts | name |
| Цвет панели браузера | src/config/site.config.ts | branding.colors.themeColor |
| Цветовая тема по умолчанию | src/layouts/BaseLayout.astro | data-theme="indigo" |
| Элементы навигации | src/config/nav.config.ts | navItems |
| Все 12 файлов тем | src/styles/themes/ | Один CSS-файл на тему |
| Цветовая шкала бренда | src/styles/themes/*.css | --brand-50 → --brand-900 |
| Форма шапки | src/layouts/*.astro | пропс shape |
| Текст копирайта подвала | src/layouts/*.astro | пропс copyright |
| ID аналитики | .env | PUBLIC_GA_MEASUREMENT_ID |
Если Fastry сэкономил вам время, звезда на GitHub поможет другим разработчикам найти этот проект.