Open allistairlee opened 1 year ago
We had them go white for dark mode, but it was a little wonky looking. Dark mode's shadows could just be darker, but that's still something to flesh out more. Open to suggestions in a PR.
Just ran into this myself. I was reading around for recommendations and found this helpful Atmos blog article, with the following advice for communicating depth/elevation:
In light mode, we usually use shadows to communicate depth. The higher the surface is, the closer it is to the light source and the bigger shadow it casts. While this approach wouldn't work in a dark mode, we can use the same "light source" theory and apply it to the surface color.
So instead of changing only the shadow size, we can also make the surface lighter the higher it is. Think about the light source being closer and shining brighter on the surface.
with the great comparison image shown below. So maybe Bootstrap could take a similar approach. I certainly find the dark theme shadows in this image (even the "lowest" ones) to pop a lot more than the current Bootstrap dark theme ones.
which file?
Prerequisites
Describe the issue
When dark mode is enabled (data-bs-theme="dark"), shadows remain black, which makes it difficult to see.
Reduced test cases
https://codepen.io/allistairlee/pen/ZEmgMaq
What operating system(s) are you seeing the problem on?
Windows
What browser(s) are you seeing the problem on?
No response
What version of Bootstrap are you using?
5.3.1