gio-android-slides/themes/transition/horizontal-slide.scss
2020-06-25 12:43:58 -04:00

72 lines
1.5 KiB
SCSS

@mixin translate($x: 0, $y: 0, $z: 0) {
-webkit-transform:translate3d($x, $y, $z);
-ms-transform:translate($x, $y);
transform:translate3d($x, $y, $z);
}
@mixin transition($prop, $duration, $easing: ease-in-out, $delay: 0ms) {
-webkit-transition:$prop $duration $easing $delay;
transition:$prop $duration $easing $delay;
}
@mixin transform($val) {
-webkit-transform:$val;
-ms-transform:$val;
transform:$val;
}
.csstransitions.csstransforms {
overflow-x:hidden;
.deck-container > .slide {
-webkit-transition:-webkit-transform 500ms ease-in-out;
transition:transform 500ms ease-in-out;
}
.deck-container:not(.deck-menu) {
> .slide {
position:absolute;
top:0;
left:0;
.slide {
position:relative;
left:0;
top:0;
-webkit-transition:-webkit-transform 500ms ease-in-out, opacity 500ms ease-in-out;
transition:transform 500ms ease-in-out, opacity 500ms ease-in-out;
}
.deck-next, .deck-after {
visibility:visible;
@include translate(200%);
}
}
> .deck-previous {
@include translate(-200%);
}
> .deck-before {
@include translate(-400%);
}
> .deck-next {
@include translate(200%);
}
> .deck-after {
@include translate(400%);
}
> .deck-before, > .deck-previous {
.slide {
visibility:visible;
}
}
> .deck-child-current {
@include transform(none);
}
}
}