Cajas con Subcategorías en Lista con Viñetas

[MichelleBarnett]

Hola,

Actualmente tengo activada la configuración “Cajas con subcategorías”, pero tengo muchas subcategorías, lo que hace que se vea un poco abarrotado. (ver imagen)

¿Existe alguna forma de convertir las subcategorías en una lista con viñetas? ¿O moverlas manualmente en lugar de usar la función “Reordenar categorías”? ¿O incluso si pudiera hacer los márgenes de cada lado más pequeños para que quepan más en una sola línea?

¡Gracias!

[Canapin (Coin-coin le Canapin)]

Editar: a partir del 9/11/2023: los estilos de categoría distintos de las viñetas cuadradas se descontinuarán o no estarán disponibles en un futuro próximo.

---

@MichelleBarnett

Cajas con Subcategorías

Responderé a esto más tarde, pero más vale tarde que nunca…

Para apilarlas unas encima de otras:

.category-box .subcategories {
    flex-direction: column;
    .subcategory {
        .subcategory-image-placeholder {
            display: none;
        }
    }
}

En cuanto a una lista con viñetas, dependerá del estilo que utilices para tus categorías. Supongamos que utilizas “bullet”:

Se verá así:

Si quieres mantener las viñetas de colores para las categorías principales pero no para las subcategorías:

Usando el carácter de viñeta real:

.category-box .subcategories {
    flex-direction: column;
    .subcategory {
        &:before {
            content: "•";
            margin-right: .25em;
            font-size: 1.5em;
            line-height: 0;
        }
        .badge-category-bg {
            display: none;
        }
        .subcategory-image-placeholder {
            display: none;
        }
    }
}

Más simple, remodelando la viñeta de categoría actual de Discourse:

.category-box .subcategories {
    flex-direction: column;
    .subcategory {
        .badge-category-bg {
            border-radius: 50%;
        }
        .subcategory-image-placeholder {
            display: none;
        }
    }
}