Ошибка темы Horizon: контейнер заголовка категории закреплен в списках тем

Всем привет

Когда я добавляю изображение, иконку или эмодзи в категорию, заголовок категории (category-heading) фиксируется при прокрутке вниз и занимает много места.

CleanShot 2025-10-31 at 14.03.16

Также затрагивается компонент темы заголовка категории — см. мой пост ниже для справки.

Протестировано на версии 3.6.0.beta2

3 лайка

Да, согласен, это неприятный побочный эффект.

К сожалению, у меня нет решения для этого. Заголовок категории находится в том же липком элементе, что и навигация, и я не могу переместить свойство sticky на уровень ниже, потому что sticky не работает внутри flex-элемента…

Советую скрыть или уменьшить логотип с помощью CSS на мобильных устройствах.

1 лайк

Меня тоже раздражает липкая навигация. Занимает слишком много места.

Как это отключить?

Для этого нет настройки. Вам придется переопределить CSS.

Тема Horizon обладает интересной особенностью: описание категории остаётся видимым при прокрутке списка тем:

Хотя это выглядит отлично на десктопе, при нехватке места (например, на мобильных устройствах) список тем становится довольно трудно читать (особенно если текст довольно объёмный):

2 лайка

Это непреднамеренный побочный эффект от желания оставить навигацию видимой. Не уверен, что это можно исправить (возможно, оба элемента находятся в одном контейнере или что-то в этом роде? :thinking: ), и если мне придется выбирать, я останусь при своём первоначальном намерении.

Однако, если кто-то захочет взглянуть, пожалуйста, не стесняйтесь.

1 лайк

Я решил это с помощью CSS.

/* Отключить липкое управление списком Horizon на мобильных устройствах */
@media (max-width: 767px) {
  .list-controls {
    position: static !important;
    top: auto !important;
    transform: none !important;
    margin-top: 0 !important;
  }
}

3 лайка

Разве это не просто «разлипает» и описание, и навигацию на мобильных устройствах?

Нам действительно нужно, чтобы описание исчезало, а навигация оставалась зафиксированной.

2 лайка

Навигация тоже занимала слишком много места.

В данный момент мы рассматриваем возможность использования прокручиваемых вкладок.

Я бы хотел сделать их закрепленными, но пока не смог этого реализовать.

1 лайк

Верно, к сожалению, нет простого способа сделать это с помощью CSS, не изменив при этом структуру макета.

Тема Horizon в настоящее время делает весь контейнер .list-controls зафиксированным, включая заголовок категории. Мы не можем сделать дочерний элемент .navigation-container зафиксированным отдельно, поскольку зафиксированные элементы «прилипают» в пределах своего родительского контекста прокрутки.

Мы могли бы перестроить эту область, но это одно из тех изменений, которое затронет все темы, использующие существующую структуру для стилизации… поэтому высока вероятность регрессии для других тем и пользовательских настроек, даже если у них нет такой зафиксированной навигации.

1 лайк

Итак, какой путь движения вперёд для этого?

Мне интересно, не стоит ли просто скрыть описание категории на мобильных устройствах для Horizon. В любом случае это дублирование информации в очень ограниченном пространстве.

Я добился этого с помощью простого CSS во вкладке Mobile в TC:

.category-heading.--has-logo {
    display: none;
}

Возможно, это стоит включить в Horizon?

Вы сами указали путь: используйте пользовательский CSS, чтобы настроить всё под свои предпочтения :+1:

1 лайк

Да, но в данном случае это более широкая проблема темы, а не просто моё личное предпочтение. Мне трудно представить человека, которому действительно понравится большое липкое описание категории на мобильных устройствах — я не думаю, что это когда-либо было вашей целью при разработке дизайна.

1 лайк

Действительно, невозможно предугадать, что именно хотят люди в своём сообществе. Я решил оставить всё как есть: если кто-то захочет, это легко можно скрыть, и такой подход менее запутан, чем вопрос «почему баннер категории не отображается на мобильных устройствах».

А как насчёт тарифов на хостинг (например, бесплатного тарифа), где администраторы не могут добавлять пользовательские CSS-стили?

Если некоторые люди действительно этого хотят (что я сомневаюсь), возможно, можно было бы добавить настройку темы, управляющую этим?

2 лайка