@function hex-color($color) {
@if type-of($color) == 'color' {
$color: str-slice(ie-hex-str($color), 4);
}
@return '%23' + unquote($color)
}
@mixin boost-svg($color) {
background-image: url("data:image/svg+xml;utf8,");
}
@mixin boost-locked-svg($color) {
background-image: url("data:image/svg+xml;utf8,");
}
@mixin boost-svg-single($color) {
background-image: url("data:image/svg+xml;utf8,");
}
@mixin boost-locked-svg-single($color) {
background-image: url("data:image/svg+xml;utf8,");
}
@mixin envelope($color) {
background-image: url("data:image/svg+xml;utf8,");
}
button.icon-button i.fa-retweet {
@include boost-svg-single($ui-base-lighter-color);
}
.status-private button.icon-button i.fa-retweet {
@include boost-locked-svg-single($ui-base-lighter-color);
}
// Disabled variant
button.icon-button.disabled i.fa-retweet {
@include boost-locked-svg-single(lighten($ui-base-color, 13%));
}
// Disabled variant for use with DMs
.status-direct button.icon-button.disabled i.fa-retweet {
@include envelope(lighten($ui-base-color, 16%));
background-position: center center;
background-repeat: no-repeat;
}
.no-reduce-motion button.icon-button i.fa-retweet {
transition: none;
background-position: 0px 684px;
}
.no-reduce-motion button.icon-button.active i.fa-retweet {
@include boost-svg($ui-highlight-color);
transition: background-position 0.6s steps(36);
background-size: 22px 684px;
background-position: 0px 0px;
}
.no-reduce-motion .status-private button.icon-button.active i.fa-retweet {
@include boost-locked-svg($ui-highlight-color);
}