Here on Meta the #planned tag is blue. It works properly when view a topic from /latest, as well as when scrolled to the top of the topic, but is currently not working when viewing the topic itself and the header has “collapsed”. In this instance the color is black, and only turns blue on mouse hover.
Latest: (works)
Top of topic: (works)
Scrolled down: (broken)
Probably, my guess is that a class is missing
header .discourse-tag is overriding .tag-planned, .tag-planned:visited, .tag-planned:hover because it is being more specific.
Both items have !important which is why that isn’t taking effect.
Some days I wish for !super-super-important CSS modifier, and then I gently lay my crack pipe down on the table and exhale
So playing around with this, removing the !important at
https://github.com/discourse/discourse/blob/master/app/assets/stylesheets/common/base/tagging.scss#L139
Seems to solve the issue.
I’ve been navigating Meta for a while with it removed and haven’t noticed anything obvious yet. I have a feeling that !important is unnecessary.
Sure submit a PR for it, as a general rule NONE of our stock CSS should ever include !important ever.
That is very true, there are a few places though it does make sense, when overriding select2 styles and anything else from a third party vendor. But stock elements that discourse creates, I 100% agree, it shouldn’t use !important.
PR submitted
https://github.com/discourse/discourse/pull/4579