A bug was reported by wil93 in the visualization of the Discourse badge inside the avatar, providing screenshots to illustrate the issue. The problem occurs when the badge is displayed in certain cases, but not others. Yuun suggested that custom CSS for specific groups may be the cause, while codinghorror acknowledged it as a bug that needs to be addressed.
Neil mentioned that the CSS is awkward and may need a markup change to be fixed. Wil93 suspected that the badge is a DOM element and not added with CSS, requiring a change in the markup. Cpradio proposed a solution by adding the ‘group-team’ class to the topic-avatar markup.
Codinghorror assigned the task to Neil, who later confirmed that the issue was already fixed, providing a screenshot as proof. Riking reminded Neil not to remove the class from its original location, as some users rely on it for custom styling.
I’m not sure if this is a bug, but take a look at these two screenshots:
In this case, my avatar shows the discourse symbol even if it normally would not.
In this other case, @mpalmer’s avatar doesn’t show the discourse symbol even if it normally would.
Yeah, you have to handle the expanded-reply area (embedded posts? sorry spacing on the terminology) if you want to use custom css for the poster-avatar-extra div for specific groups. In my forum I just don’t use poster-avatar-extra within the expanded replies, but it would be nice if that could be worked around.
Hmm if we can repro this it is a bug @neil and should be folded into improvements with group avatar overlays – along with mobile support, and user page support..
Oh so that’s what the C in CSS means. I’ll look at the CSS again.
The markup is very awkward so I don’t think the CSS can be fixed until the markup is changed somehow.
From a quick look with dev tools I think that the badge is actually a DOM
element, it’s not added with CSS (maybe it can be done with ::after?). So
if it is as I think it is, the change needs to be done on the mark-up, not
just CSS
Yes and No. If the ‘group-team’ class gets added to the markup for ‘topic-avatar’, it should solve the problem, as then you could use topic-avatar.group-team so it only applies to that div/group of elements instead of the entire post/article that it is applying to now.
So duplicating the class onto the topic-avatar, changing the CSS to use .topic-avatar.group-team, should resolve the issue.
Sure @neil is on it. Perhaps next week?
Remember to not remove it from the other location, some customers are using it to e.g. put a special border around staff posts.
@neil perhaps worth adding to your list?
