Open
Description
While trying to remove this horrible background image from the site with stylus to make the site work with my dark mode extension, i was unable to remove it even when setting background-image: none !important
.
I'm not sure what is going on, but it seems to me that having this background image inline in the html, makes it reaally hard to override.
I eventually found this to work:
@-moz-document domain("lapce.dev") {
[style="background-image: url('assets/img/pattern-light-big.svg'); background-position: center;"],
[style="background-image: url('assets/img/pattern-light1.svg'); background-position: center;"] {
filter: invert(1);
}
[style="background-image: url('assets/img/pattern-light-big.svg'); background-position: center;"] *,
[style="background-image: url('assets/img/pattern-light1.svg'); background-position: center;"] * {
filter: invert(1);
}
}
So i basically invert the element and then invert all child elements again, so only the element containing the background image is inverted.
I would suggest removing the background image, as it adds very little value to how the page looks, and makes it way harder for dark mode extensions to correctly dark mode the site.
Metadata
Metadata
Assignees
Labels
No labels