Hi, I’ve just created a PR to add a new option to specify the colour for the icon as “catcol” which will cause it to pickup the colour of the category (as seen in the category stripe and set under edit category|general|background colour
Most useful with the partial name match so that, in the example, the same icon can be used for all categories with “test” in their slug but they will each pick up their own category colour rather than all using the same. Also provides a quick alternative to having to select a colour for a one-off icon (exact match) - simply use the category colour.
This will also be useful with a proposed further new option to have the icon replace the category stripe whilst maintaining the category colour hint - to be subject of a future PR
I don’t know if it may be useful for anyone else, but I’ve submitted a pull request for discourse-category-banners to show the discourse-category-icons icon beside the banner title. I’m using it in production here.
This is a nice addition, but it doesn’t work as expected if the category icon color is set to the same color as the category (you use default black for your category icons in your example, and they get inverted to white, same as the title).
The icon color in the title should probably be set explicitly to the same color as the title, so that any color icons could be used?
I had this same issue on my instance, but I realized that by omitting the color of the category icon it takes the appropriate color, being white when on the category renderer: and on the banner title, but black when the background is white: .
However, if you don’t use the box category style and the category icon color is set to the same color as the category background, you’re right, the icon becomes “invisible”.
We could explicitly set it to something else, sure. The banner title uses the category color, maybe this is the safest bet, as you suggested. @pmusaraj what do you think?
Hi. This is a great component. Is it possible to turn off the category icons when they appear in category lists? In our case we want to use the category icons everywhere else they appear but not in the category list drop-down.
Hi Penar. Note that we want to keep the icons for all categories but we want to disable the display of the icon only in the category list control drop-down. I’ve tried working with the “fa d-icon d-icon-lock svg-icon svg-string” and 'category-name" classes but had no luck. Where should I apply the CSS settings? Can you give me a suggestion of settings to try?
Sure, I can help. Can you post a screenshot of the UI element where you would like to hide the icons? I’m not 100% sure I understand exactly, with a screenshot I should be able to send you the CSS needed to hide the icons in that specific context only.
. This screenshot shows an arrow icon displaying in the category list drop-down control. We do want the icon to display in other locations on the site (see the second screen shot) Screen Shot 2021-02-08 at 9.59.36 AM|690x356 such as where posts appear. A few users here have requested having something like this back arrow icon so they can easily navigate back to the top of a category after looking at a post. I’ve suggested other ways to do this using the Discourse web interface, but they still would like this request implemented.
Carolina Health Informatics Program
University of North Carolina at Chapel Hill