Files

3.0 KiB
Raw Permalink Blame History

Design: Переключатель темы справа + карточка первого поста

Context

  • Тема rDedInit (PaperMod). Шапка: themes/rDedInit/layouts/partials/header.html, контейнер .nav — display:flex; flex-wrap:wrap; justify-content:space-between.
  • DOM-порядок в .nav: <div class="logo"> → <div class="logo-switches"> (theme-toggle + lang-switch) → <ul id="menu">.
  • .post-entry (все посты, кроме первого) имеет: background:var(--entry); border:1px solid var(--border); border-radius:var(--radius); padding:var(--gap).
  • .first-entry (первый пост) — НЕ имеет этих свойств (только flex/min-height).

Changes (все в assets/css/extended/typewriter.css)

Этот файл подключён на всех страницах через layouts/partials/extend_head.html (корневой override хука темы):

.nav { flex-wrap: nowrap; }
.nav > .logo { order: 0; margin-inline-end: auto; }
.nav > #menu { order: 1; margin-inline-start: auto; }
.nav > .logo-switches { order: 2; margin-inline-start: 8px; }

article.first-entry {
    background: var(--entry);
    border-radius: var(--radius);
    border: 1px solid var(--border);
    padding: var(--gap);
}

Почему flex order, а не изменение темы

  • Не трогаем themes/rDedInit/ — обновления темы не затрут правки.
  • DOM не меняется, меняется только визуальный порядок — переключатель уходит вправо за меню, логотип остаётся слева.

Важное открытие (2026-09-19)

resources.Match "css/extended/*.css" в теме ищет ТОЛЬКО в themes/rDedInit/assets/, НЕ в корне сайта. Поэтому прошлый CSS assets/css/extended/typewriter.css не подхватывался Hugo (JS работал, стили — нет). Исправлено через layouts/partials/extend_head.html: resources.Get "css/extended/typewriter.css" | minify | fingerprint (корневой override хука {{- partial "extend_head.html" . }}, который тема вызывает в head.html:149).

Apply

make build

Verify

# CSS подключён в head всех страниц
grep -o 'typewriter.min.[^"]*\.css' public/index.html
# order-правила
grep -o 'order:[012]' public/css/extended/typewriter.min.*.css
# карточка первого поста
grep -o 'article.first-entry{[^}]*}' public/css/extended/typewriter.min.*.css

В браузере на /: солнышко — крайнее справа; первый пост — карточка с фоном/рамкой как у остальных.

Rollback

Удалить два блока CSS из typewriter.css (или git checkout файла), пересобрать — вернётся поведение темы по умолчанию.