[🐛 Bug]: Apply color change to background-color, not background.

[wiseaidev]

👶 Getting Started
Please search the history to see if an issue already exists for the same problem.

• I have searched the existing issues.
• I have tested the latest version.

📝 Describe the bug
While testing this extension on twitter, I noticed that it overrides background pictures.

🕹 Steps to reproduce
Steps:

1. Go to a Twitter page.
2. Change the background color.
3. Notice how it overrides all pictures because Twitter displays pics as background images for divs, not using the img tag.

😯 Current behavior
Overrides all background images

🤔 Expected behavior
Change only the background color.

📸 Screenshots

🔦 Additional context
All you need is to change the following line to use background-color instead of background:

https://github.com/wiseaidev/flexify/blob/5e728a750d7b972e77ff2637ac59c57c215afe79/scripts/popup.js#L2837

[mud1tx]

Can you please describe what we have to do in this issue, please?

[wiseaidev]

As mentioned, the current implementation overrides all background images when changing the background color for a given web page. One way to fix it is by replacing background: ${color}!important; with background-color: ${color}!important; in this line:

flexify/scripts/popup.js

Line 2837 in 5e728a7

style.innerHTML = `body.set-background-colors *, body.set-background-colors h1, body.set-background-colors h1 span, body.set-background-colors h2, body.set-background-colors h2 span, body.set-background-colors h3, body.set-background-colors h3 span, body.set-background-colors h4, body.set-background-colors h4 span, body.set-background-colors h5, body.set-background-colors h5 span, body.set-background-colors h6, body.set-background-colors h6 span, body.set-background-colors p, body.set-background-colors a, body.set-background-colors li, body.set-background-colors label, body.set-background-colors input, body.set-background-colors select, body.set-background-colors textarea, body.set-background-colors legend, body.set-background-colors code, body.set-background-colors pre, body.set-background-colors dd, body.set-background-colors dt, body.set-background-colors span, body.set-background-colors blockquote {background: ${color}!important;}`;