Reduce motion for boost animation (tootsuite pr #5871)

rebase/4.0.0rc2
cwm 2017-12-26 14:04:52 -06:00
parent 337c2e77ee
commit 14243bf80a
1 changed files with 15 additions and 2 deletions

View File

@ -556,6 +556,10 @@
white-space: pre-wrap; white-space: pre-wrap;
padding-top: 5px; padding-top: 5px;
&:focus {
outline: 0;
}
&.status__content--with-spoiler { &.status__content--with-spoiler {
white-space: normal; white-space: normal;
@ -2368,7 +2372,7 @@
@import 'boost'; @import 'boost';
button.icon-button i.fa-retweet { .no-reduce-motion button.icon-button i.fa-retweet {
background-position: 0 0; background-position: 0 0;
height: 19px; height: 19px;
transition: background-position 0.9s steps(10); transition: background-position 0.9s steps(10);
@ -2381,11 +2385,20 @@ button.icon-button i.fa-retweet {
} }
} }
button.icon-button.active i.fa-retweet { .no-reduce-motion button.icon-button.active i.fa-retweet {
transition-duration: 0.9s; transition-duration: 0.9s;
background-position: 0 100%; background-position: 0 100%;
} }
.reduce-motion button.icon-button i.fa-retweet {
color: $ui-base-lighter-color;
transition: color 100ms ease-in;
}
.reduce-motion button.icon-button.active i.fa-retweet {
color: $ui-highlight-color;
}
.status-card { .status-card {
display: flex; display: flex;
cursor: pointer; cursor: pointer;