CSS regresión: .navigation-container border-bottom no tiene espaciado después de la última actualización

UX
,
1

Hola equipo de Discourse :waving_hand:,

Después de la última actualización, noté una regresión de CSS relacionada con el elemento .navigation-container en las páginas de categorías.

Anteriormente, había un espacio natural o un margen entre el borde inferior de .navigation-container y el contenido debajo (como las cajas de categorías). Ahora, el borde está pegado al siguiente elemento, sin margen ni relleno, lo que se ve visualmente apretado e inconsistente.

Esto solo comenzó después de la actualización más reciente. Parece provenir de:

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

Lo arreglé manualmente agregando:

margin-bottom: 24px;

Esto restaura el espaciado, pero idealmente, esto debería ser manejado por el núcleo o el tema predeterminado.

Antes:

image
image1141×155 26.8 KB

Después:

image
image1119×131 15.5 KB

Saludos cordiales

3 Me gusta
3

Hola,

No puedo reproducir este problema. ¿Lo ves igual aquí en meta o solo en tu propio sitio?

¿Podrías compartir en qué páginas exactas lo ves? Por ejemplo, revisé https://meta.discourse.org/categories aquí en meta, que me parece bien.

4

Creo que puedo reproducir esto usando el tema “air” aquí en Meta

Screenshot_20250804_132525_Firefox
Screenshot_20250804_132525_Firefox1749×679 111 KB

3 Me gusta
5

Gracias, eso ayuda.

@jordan.vidrine ¿quizás causado por la nueva variable global?

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

El tema Air utiliza un componente personalizado custom-category-boxes-container, por lo que no creo que haya una solución general para el núcleo. Nuestros propios diseños de página de categorías se han ajustado a él, hasta donde sé: la vista normal de cuadros se ve bien.

@xkhalid ¿Estás usando algún componente personalizado en esa página?

1 me gusta
6

Hola,

Uso Air-Theme

Y estos son mis plugins:

image
image1290×850 77.8 KB

image
image1290×2323 104 KB

image
image1290×398 70.9 KB

7

De acuerdo, eso lo explica, gracias. Arreglaremos el tema del aire en breve.

1 me gusta
8

¡Gracias @chapoi por tu rápida respuesta!

Agregué esto dentro de CSS para solucionarlo temporalmente:

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

Corregido en

¡Gracias por el informe!

4 Me gusta
11

Este tema se cerró automáticamente después de 4 días. Ya no se permiten nuevas respuestas.