Регрессия CSS: у .navigation-container border-bottom нет отступа после последнего обновления

Внести вклад UX
,
1

Привет, команда Discourse :waving_hand:,

После последнего обновления я заметил регрессию в CSS, связанную с элементом .navigation-container на страницах категорий.

Ранее между нижней границей .navigation-container и контентом ниже (например, блоками категорий) было естественное расстояние или отступ. Теперь граница плотно прилегает к следующему элементу без каких-либо отступов или паддингов, из-за чего дизайн выглядит тесным и несогласованным.

Это началось только после самого последнего обновления. Похоже, проблема вызвана следующим кодом:

.navigation-categories .navigation-container,
.categories-list .navigation-container {
  border-bottom: 3px solid var(--primary-low-mid-or-secondary-high);
}

Я вручную исправил это, добавив:

margin-bottom: 24px;

Это восстанавливает отступ, но в идеале это должно быть исправлено в ядре или в теме по умолчанию.

До:

image
image1141×155 26.8 KB

После:

image
image1119×131 15.5 KB

С уважением,

3 лайка
3

Здравствуйте,

Мне не удаётся воспроизвести эту проблему. Вы видите то же самое здесь, на Meta, или только на своём сайте?

Можете ли вы указать точные страницы, где вы это наблюдаете? Например, я проверил https://meta.discourse.org/categories здесь, на Meta, и всё выглядит нормально.

4

Я думаю, что могу воспроизвести это с помощью темы Air здесь, на Meta

Screenshot_20250804_132525_Firefox
Screenshot_20250804_132525_Firefox1749×679 111 KB

3 лайка
5

Спасибо, это помогает.

@jordan.vidrine Возможно, это вызвано новой глобальной переменной?

.container.list-container.--categories {
  padding: 0 var(--list-container-categories-padding-x);
}

Тема Air использует пользовательский компонент custom-category-boxes-container, поэтому я не думаю, что существует общее исправление ядра для этой проблемы. Наши собственные макеты страниц категорий, насколько я могу судить, уже адаптированы к этому: обычный вид с блоками выглядит нормально.

@xkhalid Вы используете какие-либо пользовательские компоненты на этой странице?

1 лайк
6

Здравствуйте,

—-

Я использую тему Air

А вот мои плагины:

image
image1290×850 77.8 KB

image
image1290×2323 104 KB

image
image1290×398 70.9 KB

7

Хорошо, теперь всё понятно, спасибо. Мы скоро исправим тему «воздух».

1 лайк
8

Спасибо @chapoi за быстрый ответ!

Я добавил следующее в CSS как временное решение

.navigation-categories .navigation-container,
.categories-list .navigation-container {
    border-bottom: 3px solid var(--primary-low-mid-or-secondary-high);
    margin-bottom: 24px;
}
1 лайк
10

Исправлено в

Спасибо за сообщение!

4 лайка
11

Эта тема была автоматически закрыта через 4 дня. Новые ответы больше не принимаются.