Current behaviour
It looks like the shadowColor of the Surface component has been hardcoded to pure black here.
That causes the shadow not to show up on other components that are backed by Surface (e.g. Card).
Expected behaviour
I'm not 100% sure of what the spec says but I believe the shadowColor should be set to something like theme.colors.onBackground by default to provide the necessary contrast.
How to reproduce?
- set a dark theme (e.g. where
theme.colors.background = 'black')
- place a
Card on the screen
Preview
- With the current
shadowColor:
- With the
shadowColor set to theme.colors.onBackground:
What have you tried so far?
I need to manually set shadowColor on each elevated component that requires a shadow.
Your Environment
| software |
version |
| ios |
Unnecessary |
| android |
Unnecessary |
| react-native |
Unnecessary |
| react-native-paper |
5.13.1 |
| node |
Unnecessary |
| npm or yarn |
Unnecessary |
| expo sdk |
Unnecessary |
Current behaviour
It looks like the
shadowColorof theSurfacecomponent has been hardcoded to pure black here.That causes the shadow not to show up on other components that are backed by
Surface(e.g.Card).Expected behaviour
I'm not 100% sure of what the spec says but I believe the
shadowColorshould be set to something liketheme.colors.onBackgroundby default to provide the necessary contrast.How to reproduce?
theme.colors.background = 'black')Cardon the screenPreview
shadowColor:shadowColorset totheme.colors.onBackground:What have you tried so far?
I need to manually set
shadowColoron each elevated component that requires a shadow.Your Environment