/* Категорийные чипсы и featured/editor's-pick статья убраны (15.07.2026) — страница сразу переходит в сетку 4×4 карточек статей, как на Products. */ /* ---------- Сайдбар рубрик (22.07.2026, по прямому запросу) ---------- Новый, отдельный заход — вертикальная навигация вместо убранных выше горизонтальных чипсов. Была сетка из 4 равных колонок карточек; теперь 3 колонки карточек (.grid-3, общий с Home) + фиксированная по ширине колонка сайдбара справа, а не 4-я "1fr"-колонка — список рубрик по тексту не нуждается в четверти всей ширины страницы. Разметка в home.php идёт карточки → сайдбар (в этом же порядке в DOM), колонки сетки просто отражают это же слева направо. */ .articles-layout { display: grid; grid-template-columns: 1fr 220px; gap: var(--space-6); align-items: start; } /* Плавает только баннер, НЕ кнопки рубрик (23.07.2026, уточнение по прямому запросу — первая попытка сделала плавающим весь сайдбар целиком, это было неверно). Кнопки остаются в обычном статичном потоке и просто прокручиваются вместе со страницей как раньше. align-self:stretch — растягивает САМ .articles-category-nav (невидимый контейнер, у него нет своего фона/рамки, поэтому визуально это не заметно) на всю высоту строки грида (переопределяет align-items:start у .articles-layout только для этого элемента), иначе — без явной высоты у непосредственного родителя — sticky у баннера внутри буквально не имело бы места, чтобы "плавать" (упёрлось бы в свой же короткий бокс сразу после кнопок). См. .articles-sidebar-banner в 05-page-shell.css — сам sticky/top:50px висит уже на баннере, не здесь. */ .articles-category-nav { align-self: stretch; } .articles-category-nav__title { font-size: var(--fs-small); text-transform: uppercase; letter-spacing: .04em; color: var(--color-text-primary); margin: 0 0 var(--space-3); } .articles-category-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; } /* Тот же язык состояний, что у .sort-select__option (05-page-shell.css) — бледно-зелёный hover, зелёный + жирный текст на активном пункте — только слева акцентная полоска вместо подсветки всего пункта, т.к. это вертикальный список, а не выпадающее меню. */ /* Кнопка — на ленте /articles (клик фильтрует через AJAX), ссылка — на архиве рубрики (03.08.2026, category.php): выглядят одинаково, отличаются только поведением, поэтому и правила общие. Селектор именно `ul a`, а не `.articles-category-nav a`: внутри этого же блока лежит баннер, и его ссылка попала бы под все правила ниже вместе с рамкой и отступами. Ровно на этом уже обжигались 23.07.2026 — «серая полоса слева от баннера» на странице статьи оказалась не багом рендеринга, а такой же утечкой широкого селектора (см. .toc > a в 08-article-detail.css). */ .articles-category-nav ul a { text-decoration: none; } .articles-category-nav button, .articles-category-nav ul a { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); width: 100%; text-align: left; background: none; border: none; border-left: 3px solid transparent; padding: 8px 10px 8px 11px; font-family: inherit; font-size: var(--fs-body); color: var(--color-text-primary); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; cursor: pointer; } .articles-category-nav button:hover, .articles-category-nav ul a:hover { background: var(--color-tint-green); color: var(--color-primary-active); } .articles-category-nav button.is-active, .articles-category-nav ul a.is-active { border-left-color: var(--color-primary); color: var(--color-primary); font-weight: 700; } .articles-category-nav__count { font-size: var(--fs-caption); color: var(--color-text-secondary); font-weight: 400; } .articles-category-nav button.is-active .articles-category-nav__count, .articles-category-nav ul a.is-active .articles-category-nav__count { color: var(--color-primary); } .articles-results.is-loading { opacity: .5; pointer-events: none; } /* ========================================================================== Лента статей на телефоне (03.08.2026). Две колонки складываются в одну, но простым складыванием тут не обойтись: в разметке (home.php) сайдбар идёт ПОСЛЕ карточек, поэтому в одну колонку рубрики уехали бы под весь список статей — то есть фильтр оказался бы там, где его никто не увидит. Разнести же рубрики и баннер по разным местам страницы нельзя, пока они лежат в одном