I’m going to be trying this! Thanks!! Had looked at a bunch of tag styling components and seemed fiddly to have to install multiple ones, so I’ll take yours for a spin next time I get around to working on my setup!
I get a bit lost in the FontAwesome stuff. Is it just the free ones? Which version? Is there a list of all the icons somewhere (or it is too long for that)?
color: how complicated would it be to provide a color picker, for people who aren’t fluent in RGB?
Don’t worry about getting lost, happy to help any way I am able to, that is what Discourse is for after all right?
Font Awesome
The component should automatically support any Font Awesome icon from the current version that is in the current version of Discourse. I believe they currently support v6. Which you can locate all of here Font Awesome.
For the second part of the question, yes its free, there is a premium verison, but I am not sure how that works with Discourse since Font Awesome is already included with the core.
Color Picker
I can take a look and see if I can implement one, but since its a theme component, I am not sure how much I can do before it becomes necessary to be a plugin. You can use this helpful tool though, you click on the “Use HTML 5” area where the color is, and for this component, you want to use the hex color. HTML Color Picker
Well, I made some progress. I still need to do a few things to tidy it up before pushed, such as The insert logic doesn’t work (copy does), and the button is visible on the whole site, and most notably as you can see is on the bottom corner.
I also figured out how to apply to all tags of a tag group.
The builder is pretty great! I managed to use it for a couple tags to start, and then when I hit the green check to save my settings, the Tag Style Builder disappeared.
If I refresh, the button appears for just a moment before disappearing again.
I’m also not able to get one of the icons (lock-keyhole, for example) to appear on the tag despite being suggested by the builder. I added it to the SVG icons list as well, saved, and still no joy.
This is so close to being a joy to use, thanks for the efforts. I’d love to see this permanently replace several other theme components for me.
I did this all at 1-2AM, and published at 6am, so forgive me on the few hiccups.
I can reproduce the button disappearing, darn thing is stubborn. I managed to fix it, I think.
I suppose I forgot something about the Font Awesome Icons. You need to go to your sites settings, and go to the SVG Subset, and manually add it. If Discourse doesn’t already have it in use, it won’t render by default. Though, even doing this I still had an issue with it not rendering. I will look into this further.
So I had to delete the component and reinstall (both times) to get the builder button to show up to begin with.
With the latest version, I can get the button to persist through the initial setup of my tags. And I can get it to persist through a refresh. But going back into the component edit screen from Themes & Components, the button is missing again. Sneaky bugger.
I’ll play around with the icons part. Since there’s a way to turn off default icons, would there be a way to discard the tag icon for colored tags? Like if it matches the default icon set or something? The colored tags component was nice in not needing to set an icon, I enjoyed the clean look of it, and replicating that would be a useful feature to me.
I am trying a few things, I sent you my latest beta bundle, feel free to let me know if you have any issues with it, as that is the codebase I am working off.
It should fix some of these things. I added a todo list to fall back on overrides e.g. Tag1,Pencil,NoColor would just render Tag1,Pencil, <Color if default is used, True or false default used, otherwise, no color applied>.