Boîtes avec sous-catégories dans une liste à puces

Bonjour,

J’ai actuellement l’option « Boîtes avec sous-catégories » activée, mais j’ai beaucoup de sous-catégories, ce qui rend l’affichage un peu encombré. (voir image)

Existe-t-il un moyen de transformer les sous-catégories en une liste à puces ? Ou de les déplacer manuellement plutôt que d’utiliser la fonction « Réorganiser les catégories » ? Ou même de réduire les marges de chaque côté afin que plus d’éléments puissent tenir sur une seule ligne ?

Merci !

:warning: Mise à jour : à partir du 09/11/2023 : les styles de catégories autres que les puces carrées sont ou seront bientôt abandonnés/indisponibles.


Je réponds à cela plus tard, mais mieux vaut tard que jamais… :slight_smile:

Pour les empiler les unes sur les autres :

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

Quant à une liste à puces, cela dépendra du style que vous utilisez pour vos catégories. Supposons que vous utilisiez « puce » :
image

Cela ressemblera à ceci :

Si vous souhaitez conserver les puces colorées pour les catégories parentes mais pas pour les sous-catégories :

Utilisation du vrai caractère de puce :

.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;
        }
    }
}

Plus simple, en remodelant la puce de catégorie Discourse actuelle :

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