If you set either foreground or background color by default, please also set the other

[AndydeCleyre]

I checked that...

• ... the documentation does not mention anything about my problem
• ... the problem does occur with the default MkDocs template
• ... the problem is not in any of my customizations (CSS, JS, template)
• ... there are no open or closed issues that are related to my problem

Description

It looks like, by default, foreground color is set to black, while background color is left to the user's browser-set preference. This means the viewing experience from user to user is unpredictable, and sometimes unreadable.

Expected behavior

If either the fg or bg colors are specified by default, the other ought to be as well, to ensure readability.

Actual behavior

If the user's browser's preferred colors feature a dark bg (and light fg), the default presentation ranges from uncomfortable to impossible to read.

Steps to reproduce the bug

1. Open a new profile with Firefox
   firefox -ProfileManager
2. Navigate to about:preferences, and under the "Language and Appearance" > "Fonts and Colors" click "Colors..."
3. Change Text to something light, like #C2B790, and Background to something dark, like #262C2E
4. Visit https://squidfunk.github.io/mkdocs-material/

Alternatively you can do the same thing using the about:config interface, by changing the values of browser.display.foreground_color and browser.display.background_color.

Package versions

Whatever is used at https://squidfunk.github.io/mkdocs-material/

Project configuration

https://github.com/squidfunk/mkdocs-material/blob/master/mkdocs.yml

System information

• OS: Arch Linux
• Browser: Firefox 72.0.1

[squidfunk]

I guess this happens on a lot of websites. However, we can explicitly set background color to white to mitigate it.

[squidfunk]

Fixed in e1c5953, will be part of v5. See #1306 for updates.

[AndydeCleyre]

You're right, many sites make this mistake, and I appreciate your fixing it here.

[squidfunk]

Material for MkDocs 5.0.0rc1 is out which fixes this issue 😀 Let's test and improve it together!