Top featured works emoji bug

[Goorman (Sergey)]

Hey there, Sergey on the line

It’s a bit of an old bug, but anyway:

When surfing on Blenderartists forum, I found myself a little bug: there’s a section at the top of the website, where you are able to see 6 featured top works. When you hover on one of them, the title becomes visible. The thing I noticed is that if the title contains an emoji (as shown in the screenshot below) it’ll still be visible even if you haven’t hovered on it yet.

I did myself a little investigation and ended up with the next CSS-rules that might help to solve that problem.

The thing is the title of those featured row images has next rules:

.featured-topic h3 a {
    font-size: 14px;
    color: transparent;
    transition: color .6s,text-shadow .6s
}

I don’t think that “color: transparent” is a proper way to do this. So that’s why it affects only on text, but not on an emoji itself. Because the emoji is wrapped in an “img” tag.

So I think it would be a better way to remove “color: transparent” & make something like this:

.featured-topic h3 {
    position: absolute;
    top: 0;
    padding-top: 0;
    left: 5%;
    width: 90%;
    text-align: left;
    visibility: hidden;
}

.featured-topic:hover h3 {
    visibility: visible;
}

So the final code will look like this:

Hope that helps

[Arkshine]

Hi Sergey!

Thanks for the report, however, I could be wrong, but this is not what the default CSS looks like in the Homepage Feature component . From what I see, it’s your customizations.

[Goorman (Sergey)]

Hi, @Arkshine!

Sorry, didn’t know about that, I thought that was the Discourse feature. Pardon me

[nat (Natalie T)]

Please let your administrators know, thanks!

Closing this one.