Search bar Close button is not in Dark Mode

[ADTC]

This is the search bar shown above the chat when Search is clicked in the profile info, for searching messages. The Close button is light but has light text.

Thanks for this extension :)

[Kacper1263]

Thanks for the information, unfortunately this button is a bit off from the rest of the color standards on the site and I am not able to style it in a "nice" way, for the moment I changed its style through workaround, it should work but after some site update the problem may return and I will have to correct it again.

The update is now available, it should download automatically or you can force it in your browser's add-on tab

[ADTC]

Thanks @Kacper1263 it works. But I think this selector might be more permanent:

div[aria-label="Close"][role="button"] > div

[Kacper1263]

I thought about it, but "Close" is only for English, when another language is set, the word Close is translated, so I decided to search by classes :)

[ADTC]

Ah OK. Maybe to minimize the chance of breaking, you can target one or two (or all) of these classes. It looks like they are all individually unique to the Close button (not found anywhere in the rest of the site):

div.xi112ho.x17zwfj4.x585lrc.x1403ito.x14hiurz.x1r1pt67

That way if the other shared classes change, this button will still have the fix.

Just guessing, though it's possible that every class name is regenerated on a site update, even with a very minor change. I know that Facebook uses React. I'm not sure yet how React handles changes in CSS.

[ADTC]

Last suggestion (this also targets Close button specifically - other buttons don't have this specific structure):

div[role="button"] > div.__fb-light-mode {
	background-color: var(--dbfm-secondary-btn-background-color);
}

(btw roles aren't translated)

[Kacper1263]

Last suggestion (this also targets Close button specifically - other buttons don't have this specific structure):

div[role="button"] > div.__fb-light-mode {
	background-color: var(--dbfm-secondary-btn-background-color);
}

(btw roles aren't translated)

Thanks for the suggestion, I like the idea, I'll verify it later and let you know

[Kacper1263]

I checked and everything works cool, at first look it seems that there is only one such button (unless some can only appear after some action), I've uploaded the changes

Thanks for your help! :)

[ADTC]

Fixed in c23ec1c...8b6931d

You're welcome, and thank you for the quick response and update 🙂

[ADTC]

It's no longer in Mozilla Add-On site?

[Kacper1263]

It's no longer in Mozilla Add-On site?

I have no idea why. I have not noticed. I didn't even get any email.

I'll have to check it out...

Thanks for the info!

[Kacper1263]

I did receive an email but missed it. The add-on has been removed and it's unlikely to come back ☹️

[ADTC]

That sucks. It's because you used a blackened version of Messenger logo. If you create your own custom logo, maybe you can get it published again.

But FFS, they won't give us dark mode in messenger.com and now they are hunting down an obscure extension that does. Jeez.