Tema Aire

Varias personas han preguntado sobre cómo mostrar las subcategorías en la página de Categorías. Esto se relaciona con el componente Modern Category + Group Boxes, pero como no tiene un tema propio (¿verdad?), compartiré mis hallazgos aquí:

Esto funciona:

/* Muestra las subcategorías */
.custom-category-boxes:not(.above-discovery-categories-outlet) .subcategories {
  display: inline-flex;
  flex-flow: wrap;
}

.custom-category-boxes:not(.above-discovery-categories-outlet) .subcategory {
  display: inline-flex;
  align-items: baseline;
  margin-right: .3em;
}

/* Elimina las imágenes de categoría de la lista */
.custom-category-boxes:not(.above-discovery-categories-outlet) .subcategories .subcategory .subcategory-image-placeholder {
  display: none;
}

Además, si tienes muchas subcategorías, quizás quieras mostrar una categoría por fila.

/* Una categoría por fila */
.custom-category-boxes:not(.above-discovery-categories-outlet) {
  grid-template-columns: 1fr;
}

El resultado se ve así:

Creo que las cajas tienen un límite de altura, pero no he encontrado la manera de eliminarlo. Todavía no tenemos suficientes subcategorías para ver el problema en el escritorio, pero estamos alcanzando el límite en el móvil:

¿Alguna idea para resolver este problema?

2 Me gusta