javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

.reverse for .nav-title-slide-ios7

Browse Source
This commit is contained in:
Adam Bradley
2014-01-07 19:52:55 -06:00
parent 1b07a7a87a
commit fe0862a126
1 changed files with 3 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
scss/_animations.scss
View File

@@ -197,12 +197,10 @@ $slide-in-up-function: cubic-bezier(.1, .7, .1, 1);
> .ng-enter.ng-enter-active, &.ng-enter.ng-enter-active {
/* NEW content ACTIVELY sliding IN from the RIGHT */
@include translate3d(0, 0, 0);
//.scroll { background: purple; } //for debugging
}
> .ng-leave.ng-leave-active, &.ng-leave.ng-leave-active {
/* OLD content ACTIVELY sliding OUT to the LEFT */
@include translate3d(-100%, 0, 0);
//.scroll { background: green; } //for debugging
}
&.reverse {
@@ -221,12 +219,10 @@ $slide-in-up-function: cubic-bezier(.1, .7, .1, 1);
> .ng-enter.ng-enter-active, &.ng-enter.ng-enter-active {
/* NEW content ACTIVELY sliding IN from the LEFT */
@include translate3d(0, 0, 0);
//.scroll { background: blue; } //for debugging
}
> .ng-leave.ng-leave-active, &.ng-leave.ng-leave-active {
/* OLD content ACTIVELY sliding OUT to the RIGHT */
@include translate3d(100%, 0, 0);
//.scroll { background: yellow; } //for debugging
}
}
}
@@ -258,12 +254,10 @@ $ios7-transition-duration: 250ms;
> .ng-enter.ng-enter-active, &.ng-enter.ng-enter-active {
/* NEW content ACTIVELY sliding IN from the RIGHT */
@include translate3d(0, 0, 0);
//.scroll { background: red; } //for debugging
}
> .ng-leave.ng-leave-active, &.ng-leave.ng-leave-active {
/* OLD content ACTIVELY sliding OUT to the LEFT */
@include translate3d(-15%, 0, 0);
//.scroll { background: blue; } //for debugging
}
&.reverse {
@@ -284,12 +278,10 @@ $ios7-transition-duration: 250ms;
> .ng-enter.ng-enter-active, &.ng-enter.ng-enter-active {
/* NEW content ACTIVELY sliding IN from the LEFT */
@include translate3d(0, 0, 0);
//.scroll { background: orange; } //for debugging
}
> .ng-leave.ng-leave-active, &.ng-leave.ng-leave-active {
/* OLD content ACTIVELY sliding OUT to the RIGHT */
@include translate3d(15%, 0, 0);
//.scroll { background: maroon; } //for debugging
}
}
}
@@ -476,7 +468,7 @@ $ios7-transition-duration: 250ms;
/**
* Some component specific animations
*/
$nav-title-slide-ios7-delay: 350ms;
$nav-title-slide-ios7-delay: 250ms;
.nav-title-slide-ios7 {
> .ng-enter, &.ng-enter,
> .ng-leave, &.ng-leave {
@@ -497,13 +489,10 @@ $nav-title-slide-ios7-delay: 350ms;
opacity: 0;
}
}
.reverse {
.nav-title-slide-ios7 {
&.reverse {
> .ng-enter, &.ng-enter,
> .ng-leave, &.ng-leave {
@include transition(all $nav-title-slide-ios7-delay);
@include transition-timing-function($ios7-timing-function);
@include transition(all ease-in-out $transition-duration);
opacity: 1;
}
> .ng-enter, &.ng-enter {