33 lines
1022 B
SCSS
33 lines
1022 B
SCSS
// Shorthand mixin. Supports multiple parentheses-deliminated values for each variable.
|
|
// Example: @include transition (all 2s ease-in-out);
|
|
// @include transition (opacity 1s ease-in 2s, width 2s ease-out);
|
|
// @include transition-property (transform, opacity);
|
|
|
|
@mixin transition ($properties...) {
|
|
@if length($properties) >= 1 {
|
|
@include prefixer(transition, $properties, spec);
|
|
}
|
|
|
|
@else {
|
|
$properties: all 0.15s ease-out 0s;
|
|
@include prefixer(transition, $properties, spec);
|
|
}
|
|
}
|
|
|
|
@mixin transition-property ($properties...) {
|
|
transition-property: transition-property-names($properties, false);
|
|
}
|
|
|
|
@mixin transition-duration ($times...) {
|
|
@include prefixer(transition-duration, $times, spec);
|
|
}
|
|
|
|
@mixin transition-timing-function ($motions...) {
|
|
// ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier()
|
|
@include prefixer(transition-timing-function, $motions, spec);
|
|
}
|
|
|
|
@mixin transition-delay ($times...) {
|
|
@include prefixer(transition-delay, $times, spec);
|
|
}
|