Web Viewer change background color of website

[TRU]

I’m using web viewer to use onelook thesaurus all the time. I’d like to change the background color to make it fit right into Obsidian.

I found this in the inspector:

I’d like the change white to var(–background-primary)

Anyone know how to target the iframe or whatever the element is to do this so that it’s persistent?

[ariehen]

You could give this a try. The !important is necessary here.

.webviewer-content webview {
    background-color: var(--background-primary) !important;
}

---

Depending on the theme, --background-primary may need changing, but that seems to do it.

[TRU]

Awesome. I didn’t even think about !important.

Thank you

[ariehen]

Great!

Yeah, next time, if you see element.style in the DOM, you’ll need an !important to override it.

element.style is a part of your browser devtools that indicates the inline style of the element which has a higher specificity value than any CSS selectors.

That inline styles may be added by a JavaScript code, if so, you can override that declarations by using !important keyword within your stylesheet

https://stackoverflow.com/questions/28353386/what-is-element-style-and-why-is-it-overriding-my-css-settings