ayo/lion
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(overlay-manager): disable transition when reduced motion enabled

Browse source
This commit is contained in:
Jose C. Perea 2022-11-18 08:21:28 +01:00 committed by Thijs Louisse
parent edc6920a90
commit e090d2d861
2 changed files with 15 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/five-dolls-begin.md Normal file
View file

@ -0,0 +1,5 @@
---
'@lion/ui': patch
---
adds support for reduced motion capabilities in overlay manager by disabling the opacity transition when a modal is opened/closed

10
packages/ui/components/overlays/src/globalOverlaysStyle.js
View file

@ -126,4 +126,14 @@ export const globalOverlaysStyle = css`
html.global-overlays-scroll-lock-ios-fix { html.global-overlays-scroll-lock-ios-fix {
height: 100vh; height: 100vh;
} }
@media screen and (prefers-reduced-motion: reduce) {
.global-overlays .global-overlays__backdrop--animation-in {
animation: global-overlays-backdrop-fade-in 1ms;
}
.global-overlays .global-overlays__backdrop--animation-out {
animation: global-overlays-backdrop-fade-out 1ms;
}
}
`; `;