Boxes with Subcategories into Bulleted List

Dev
2

:warning: Edit: as of 11/9/2023: Category styles other than squared bullets are or will be discontinued/unavailable in the short future.

I’m replying to this later, but better late than never… :slight_smile:

To stack them on top of each others:

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

image

As for a bulleted list, it will depend on what style you use for your categories. Let’s assume you’re using “bullet”:
image

It will look like this:
image

If you want to keep the colored bullets for the parent categories but not for the subcategories:

Using real bullet character:

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

image

Simpler, reshaping the current Discourse category bullet:

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

image

2 Likes