Links are invisible on light colour schemes

[sixhobbits]

Contribution guidelines

• I've read the contribution guidelines and wholeheartedly agree

I've found a bug and checked that ...

• ... the problem doesn't occur with the mkdocs or readthedocs themes
• ... the problem persists when all overrides are removed, i.e. custom_dir, extra_javascript and extra_css
• ... the documentation does not mention anything about my problem
• ... there are no open or closed issues that are related to my problem

Description

I have tried to check the above four as much as possible, but I have not managed to fully reproduce a minimal example of this problem. We have seen it across a few sites since we upgraded the mkdocs-material version (without making other changes to the CSS etc, so I am fairly confident it is something that changed in MkDocs Material itself).

Links cannot be seen on light themes / when the background is white. Links show up when

• A user mouses over them
• When a dark theme is enabled

Expected behaviour

Links can be seen by all users, regardless of theme.

Actual behaviour

Links cannot be seen, unless a dark theme is enabled.

Steps to reproduce

You can see this in action currently at https://codecapsules.io/docs/comparisons/ and all other links across the site.

Package versions

• Python: python --version: Python 3.9.12
• MkDocs: mkdocs --version: mkdocs, version 1.3.0
• Material: pip show mkdocs-material | grep -E ^Version 8.2.15+insiders.4.16.0

Configuration

I have tried and can't do this right now. I will keep working on it, but maybe you already know the answer :)

System information

MacOS

FireFox and Safari

[facelessuser]

Configuration is very important. Are you using custom CSS? If so, that is the first thing I'd check.

Considering that the official MkDocs Material documentation is generated with the project itself and does not suffer from invisible links on light color schemes, it seems to be most likely a local issue and not an issue with the project.

[squidfunk]

Thanks for reporting. This can be reproduced by going to the primary color guide an clicking on white. It's most likely a regression that should be straight-forward to fix, possibly due to specificity issues.

[squidfunk]

Fixed in 221a869. I've taken the time and refactored the tints of links for each scheme, default and slate.

• For the default theme, the lighter colors like yellow or amber now define slightly darker link colors
• For the slate theme, the darker colors like indigo and teal now define slightly lighter link colors
• For both themes, neutral colors like grey or white will always define appropriate tints from the indigo palette

This should reduce problems with combining different primary colors with light and dark color schemes. Note that there might still be cases where colors don't work well, but it's just too many combinations to optimize. I think we now have reasonable defaults in-place. Furthermore, I tried to flatten the selectors, which should lead to fewer specificity issues, especially when customizing.

This change is currently only in Insiders but will be merged into the community edition in order to minimize friction. If all is fine with this change, I'll merge it when the next funding goal is reached (maybe mid-June).

[squidfunk]

Released as part of 8.2.16+insiders-4.16.1.

[sixhobbits]

thanks for the fast fix!!