Problem to solve
Setting scrim with blur requires:
- overriding
opacity to 1
- setting color with alpha
- custom CSS to set the
backdrop-filter value
- repeating those adjustments for VOverlay and VNavigationDrawer
Proposed solution
Since it is very popular design choice, it would be great to have it baked into design system (even if MD3 does not include it in the spec) as app-level variable --v-scrim-blur along with variables for opacity and color.
Optional
Consider naming variables --v-backdrop-* as "scrim" is strictly from Material Design (well.. it depends on how we want to publish non-material "spins" of Vuetify).
Problem to solve
Setting scrim with blur requires:
opacityto 1backdrop-filtervalueProposed solution
Since it is very popular design choice, it would be great to have it baked into design system (even if MD3 does not include it in the spec) as app-level variable
--v-scrim-bluralong with variables for opacity and color.Optional
Consider naming variables
--v-backdrop-*as "scrim" is strictly from Material Design (well.. it depends on how we want to publish non-material "spins" of Vuetify).