executablebooks / sphinx-design

A sphinx extension for designing beautiful, screen-size responsive web components.
https://sphinx-design.readthedocs.io/en/furo-theme/
MIT License
200 stars 61 forks source link

Support more PyData theme colors for badges #215

Open user27182 opened 3 months ago

user27182 commented 3 months ago

Context

I have found that the existing dark and light colors have low-contrast when viewing a site with the dark and light themes applied, respectively, and are therefore hard to see/read. E.g. see this badge :

image from https://github.com/pyvista/pyvista/pull/6475.

I went looking for an alternative, but found that dark and light are the only grayscale options with outlines supported by Sphinx Design: https://sphinx-design.readthedocs.io/en/latest/badges_buttons.html

Proposal

Additional colors are available from the PyData theme: https://pydata-sphinx-theme.readthedocs.io/en/stable/user_guide/styling.html#color-variables

Something like the surface and on-surface colors might be good alternatives since these change with the theme.

Perhaps all the other PyData theme colors could be supported as well.

Tasks and updates

No response

user27182 commented 3 months ago

Looks like there are three undocumented colors: muted, black, and white https://github.com/executablebooks/sphinx-design/blob/0b178a9d9face523611fb916440b418c416c05a2/sphinx_design/shared.py#L19-L31

Here's what all the colors look like (including undocumented ones) with the light and dark PyData theme applied: image

Based on this it looks like muted produces the best results for what I'm looking for, as the outline version is clearly visible with either the dark or light theme.

So, at the very least, this issue is a documentation issue. It would be good to update the docs to include the three undocumented colors muted, black, and white.