Гайд по стилю страниц

## Поля frontmatter

| Поле | Тип | Что делает |
|---|---|---|
| `intro` | markdown | Опционально. Рендерится в `.mc-authcore-intro` — без фона, над основным блоком. |
| `logo` | путь к PNG | Опционально. Добавляет плавающее логотип в правом верхнем углу основного блока. |
| `template` | строка | Всегда `mc-page` для этого шаблона. |

## Карточки

Для подсекций внутри основного блока используйте `<div class="mc-card">…</div>`:

<div class="mc-card">

<h3>Заголовок карточки</h3>

<p>Любой контент — параграфы, списки, код.</p>

<pre><code>команда в чате</code></pre>

</div>

<div class="mc-card">

<h3>Ещё одна карточка</h3>

<p>Можно ставить подряд — между ними автоматический отступ.</p>

<ul>
<li>Маркированный список</li>
<li>Работает в карточках</li>
<li>И в основном блоке тоже</li>
</ul>

</div>

## Таблицы

Таблицы стилизованы под тёмную тему — заголовки серые uppercase, строки читаются:

<table>
<thead>
<tr><th>Команда</th><th>Что делает</th></tr>
</thead>
<tbody>
<tr><td><code>/login</code></td><td>Войти в аккаунт</td></tr>
<tr><td><code>/register</code></td><td>Создать аккаунт</td></tr>
<tr><td><code>/logout</code></td><td>Выйти</td></tr>
</tbody>
</table>

## Blockquote и pre

<blockquote>
<strong>Важно:</strong> blockquote используется для заметок и предупреждений.
Слева цветная полоска emerald, текст светлый.
</blockquote>

<pre><code>// пример кода — моноширинный шрифт, тёмный фон
authcore admin setPlayerPassword &lt;ник&gt; &lt;новый_пароль&gt;</code></pre>

## Рекомендованный паттерн для всех страниц

**Все `mc-page`-страницы** должны иметь `template: mc-page` + `intro:` с H1
внутри. Тогда заголовок получает правильный стиль (`.mc-authcore-intro h1`)
и попадает в общий шаблон. Без `intro:` шаблон рендерит H1 дефолтным
стилем quark2 — это видно не как «наш» заголовок.

```markdown
---
title: Полное название для вкладки браузера
template: mc-page
summary: Краткое описание для SEO и превью
logo: /user/themes/mevercraft-theme/images/site/<icon>.png   # опц.
intro: |
    # Короткий заголовок для страницы
    Вводный абзац в одно-два предложения — что это и зачем.
---

## Первая секция (h2)

<div class="mc-card">

<h3>Карточка</h3>
<p>Контент…</p>

</div>

## Вторая секция (h2)

<p>Ещё контент.</p>

Что важно:

• template: mc-page — обязателен (без него рендерится default.html.twig, без стилей)
• intro: — обязателен для единого стиля H1 (можно опустить, тогда шаблон рендерит <h1></h1> без наших стилей — не делайте так)
• # H1 идёт внутри intro, не в основном контенте
• title (в frontmatter) — длинное название для <title> в HTML и OG-превью
• # H1 (в intro) — короткое название, которое видит посетитель
• logo — опциональный плавающий логотип в правом верхнем углу
• Тело markdown — только H2/H3 и .mc-card блоки, без <h1>, без обёрток .mc-authcore-intro/.mc-content-page (шаблон добавляет сам)

Готовые сниппеты

Минимальная страница (только основной блок)

---
title: О сервере
template: mc-page
---

## О сервере

Mevercraft — модифицированный Minecraft под NeoForge 26.2.

## Правила

- Без читов
- Без гриферства
- Уважайте других игроков

С intro

---
title: Регистрация
template: mc-page
intro: |
    ## Регистрация на сервере

    Мод AuthCore защищает аккаунты от взлома и кражи ников.
---

## Что нужно сделать при первом заходе

основной контент…

С intro + логотип

---
title: AuthCore
template: mc-page
intro: |
    ## Регистрация на сервере
    AuthCore — бесплатный мод для регистрации и входа.
logo: /user/themes/mevercraft-theme/images/site/authcore-hero.png
---

## Что нужно сделать при первом заходе

<div class="mc-card">

<h3>Шаг 1. Зайти на сервер</h3>

<p>Подключитесь к <code>play.mevercraft.ru</code>.</p>

</div>

Полная страница (как /authcore)

---
title: Полная страница
template: mc-page
intro: |
    ## Заголовок интро
    Описание в одну-две строки.
logo: /user/themes/mevercraft-theme/images/site/authcore-hero.png
---

## Первая секция (h2)

<div class="mc-card">

<h3>Подсекция (h3)</h3>

<p>Текст…</p>

<pre><code>команда</code></pre>

</div>

## Вторая секция (h2)

<table>
<thead>
<tr><th>Колонка 1</th><th>Колонка 2</th></tr>
</thead>
<tbody>
<tr><td>значение</td><td>значение</td></tr>
</tbody>
</table>

<blockquote>
<strong>Заметка.</strong> Цитаты работают для предупреждений.
</blockquote>

## Третья секция

<ul>
<li>Элемент списка</li>
<li>Ещё элемент</li>
<li>И ещё</li>
</ul>

Где какие классы

Чего избегать

• ❌ Не вставляйте <div class="mc-authcore-intro">…</div> в контент — для этого есть поле intro в frontmatter.
• ❌ Не вставляйте <div class="mc-content-page">…</div> — это тоже автоматически.
• ❌ Не забывайте template: mc-page и intro: с H1 — без них заголовок рендерится без нашего шрифта и отступов (это видно как «чужой» блок на странице).
• ❌ Markdown внутри <div class="mc-card">…**жирный**…</div> не обработается — пишите HTML напрямую.