Bug in the visualization of the discourse badge inside the avatar


(William Di Luigi) #1

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.


(Sam) #2

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.


(Jeff Atwood) #3

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…


(Neil Lalonde) #4

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.


(William Di Luigi) #6

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


(cpradio) #7

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.


(Jeff Atwood) #8

Sure @neil is on it. Perhaps next week?


(Kane York) #9

Remember to not remove it from the other location, some customers are using it to e.g. put a special border around staff posts.


(Sam Saffron) #10

@neil perhaps worth adding to your list?


(Neil Lalonde) #11

Already fixed it a while ago:


(Neil Lalonde) #12