Add prefers-reduced-motion support
This commit is contained in:
parent
b7bb658236
commit
43838285a5
1 changed files with 9 additions and 5 deletions
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue