For some time the colours of the popup on about:addons has had the native colours (black on white) instead of the colours set in userContent.css. The addons page itself still has the colours set in the css file.
I opened the Browser Toolbox and disabled popup auto-hide but I wasn’t able to identify the selector(s) to use.
This is my code :
@-moz-document url-prefix("about:"), url-prefix("chrome://"), url-prefix("resource://"){ :root { --in-content-page-color: #000080 ; --in-content-text-color: #000080 ; --in-content-page-background: #dbc3a3 ; --in-content-box-background: #e2cfb6 ; --in-content-deemphasized-text: var(--in-content-text-color) ; scrollbar-color: #6495ed #d9d9d9 ; /*var(--in-content-text-color) var(--in-content-page-background) !important;*/ color:var(--in-content-text-color) ; }
What do I add to change the colours of the popup to conform with the page itself?
The options button menus (I guess those are the ones you mean) just are not using the variables you have listed. Probably the most easy solution would be to modify values of the varibles that that those menus are using - just add these two there with your other rules:
--background-color-box: var(--in-content-page-background) !important; --text-color: var(--in-content-text-color) !important;Although, I don’t know how other internal pages might respond to that since the rule set you have applies to pretty much all internal pages, not just about:addons.
Thank you. That had the desired result on the addons page. I have seen a post on Reddit suggesting the following to limit code to popups :
@media (width >= 700px) {...}Would it be appropriate to bracket the added lines with that?