Add prefers-reduced-motion support

This commit is contained in:
Jay Trees 2022-04-11 08:29:43 +02:00
parent b7bb658236
commit 43838285a5

View file

@ -57,10 +57,11 @@ img {
background-color: #fff; background-color: #fff;
} }
@media (hover: hover) { @media (hover: hover) {
.ui.card > .image > img.preview { @media (prefers-reduced-motion: no-preference) {
transition: height 0.2s linear; .ui.card > .image > img.preview {
transition: height 0.2s linear;
}
} }
.ui.card:hover > .image > img.preview { .ui.card:hover > .image > img.preview {
height: calc(1em + 3 * var(--padding)); height: calc(1em + 3 * var(--padding));
} }
@ -132,9 +133,12 @@ img {
overflow: auto; overflow: auto;
} }
@media (hover: hover) { @media (hover: hover) {
@media (prefers-reduced-motion: no-preference) {
.ui.card > .content:not(.extra) {
transition: height 0.2s linear;
}
}
.ui.card > .content:not(.extra) { .ui.card > .content:not(.extra) {
transition: height 0.2s linear;
overflow: hidden; overflow: hidden;
} }