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

animation speed ups

Browse Source
This commit is contained in:
Adam Bradley
2013-11-29 13:37:03 -06:00
parent 5afd85d255
commit 203304f374
3 changed files with 30 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
dist/css/ionic.css vendored
View File

@@ -1,4 +1,3 @@
@charset "UTF-8";
/*!
* Copyright 2013 Drifty Co.
* http://drifty.com/
@@ -5227,15 +5226,16 @@ a.button {
*/
.slide-left-right-ios7 > .ng-enter, .slide-left-right-ios7.ng-enter,
.slide-left-right-ios7 > .ng-leave, .slide-left-right-ios7.ng-leave {
-webkit-transition: all cubic-bezier(0.1, 0.75, 0.3, 0.95) 750ms;
-moz-transition: all cubic-bezier(0.1, 0.75, 0.3, 0.95) 750ms;
transition: all cubic-bezier(0.1, 0.75, 0.3, 0.95) 750ms;
-webkit-transition: all ease-in-out 250ms;
-moz-transition: all ease-in-out 250ms;
transition: all ease-in-out 250ms;
position: absolute;
top: 0;
right: 0;
right: -1px;
bottom: 0;
left: 0;
box-shadow: -1px 0px 2px rgba(0, 0, 0, 0.2), 1px 0px 2px rgba(0, 0, 0, 0.2); }
left: -1px;
border-left: 1px solid #ddd;
border-right: 1px solid #ddd; }
.slide-left-right-ios7 > .ng-enter, .slide-left-right-ios7.ng-enter {
/* NEW content placed far RIGHT BEFORE it slides IN from the RIGHT */
-webkit-transform: translate3d(100%, 0, 0);
@@ -5252,14 +5252,16 @@ a.button {
-moz-transform: translate3d(-15%, 0, 0);
transform: translate3d(-15%, 0, 0); }
.slide-left-right-ios7.reverse > .ng-enter, .slide-left-right-ios7.reverse.ng-enter, .slide-left-right-ios7.reverse > .ng-leave, .slide-left-right-ios7.reverse.ng-leave {
-webkit-transition: all cubic-bezier(0.1, 0.75, 0.3, 0.95) 750ms;
-moz-transition: all cubic-bezier(0.1, 0.75, 0.3, 0.95) 750ms;
transition: all cubic-bezier(0.1, 0.75, 0.3, 0.95) 750ms;
-webkit-transition: all ease-in-out 250ms;
-moz-transition: all ease-in-out 250ms;
transition: all ease-in-out 250ms;
position: absolute;
top: 0;
right: 0;
right: -1px;
bottom: 0;
left: 0; }
left: -1px;
border-left: 1px solid #ddd;
border-right: 1px solid #ddd; }
.slide-left-right-ios7.reverse > .ng-enter, .slide-left-right-ios7.reverse.ng-enter {
/* NEW content placed far LEFT BEFORE it slides IN from the LEFT */
-webkit-transform: translate3d(-100%, 0, 0);
@@ -5571,9 +5573,9 @@ a.button {
-webkit-transition: all 350ms;
-moz-transition: all 350ms;
transition: all 350ms;
-webkit-transition-timing-function: cubic-bezier(0.1, 0.75, 0.3, 0.95);
-moz-transition-timing-function: cubic-bezier(0.1, 0.75, 0.3, 0.95);
transition-timing-function: cubic-bezier(0.1, 0.75, 0.3, 0.95);
-webkit-transition-timing-function: ease-in-out;
-moz-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
opacity: 1; }
.nav-title-slide-ios7 > .ng-enter, .nav-title-slide-ios7.ng-enter {
-webkit-transform: translate3d(30%, 0, 0);
@@ -5596,9 +5598,9 @@ a.button {
-webkit-transition: all 350ms;
-moz-transition: all 350ms;
transition: all 350ms;
-webkit-transition-timing-function: cubic-bezier(0.1, 0.75, 0.3, 0.95);
-moz-transition-timing-function: cubic-bezier(0.1, 0.75, 0.3, 0.95);
transition-timing-function: cubic-bezier(0.1, 0.75, 0.3, 0.95);
-webkit-transition-timing-function: ease-in-out;
-moz-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
opacity: 1; }
.reverse .nav-title-slide-ios7 > .ng-enter, .reverse .nav-title-slide-ios7.ng-enter {
-webkit-transform: translate3d(-30%, 0, 0);

1
dist/css/themes/ionic-ios7.css vendored
View File

@@ -1,4 +1,3 @@
@charset "UTF-8";
/*!
* Copyright 2013 Drifty Co.
* http://drifty.com/

17
scss/_animations.scss
View File

@@ -89,8 +89,8 @@
* iOS7 style slide left to right
* --------------------------------------------------
*/
$ios7-timing-function: cubic-bezier(.10, .75, .30, .95);
$ios7-transition-duration: 750ms;
$ios7-timing-function: ease-in-out;
$ios7-transition-duration: 250ms;
.slide-left-right-ios7 {
> .ng-enter, &.ng-enter,
@@ -98,10 +98,11 @@ $ios7-transition-duration: 750ms;
@include transition(all $ios7-timing-function $ios7-transition-duration);
position: absolute;
top: 0;
right: 0;
right: -1px;
bottom: 0;
left: 0;
box-shadow: $menu-side-shadow;
left: -1px;
border-left: 1px solid #ddd;
border-right: 1px solid #ddd;
}
> .ng-enter, &.ng-enter {
/* NEW content placed far RIGHT BEFORE it slides IN from the RIGHT */
@@ -123,9 +124,11 @@ $ios7-transition-duration: 750ms;
@include transition(all $ios7-timing-function $ios7-transition-duration);
position: absolute;
top: 0;
right: 0;
right: -1px;
bottom: 0;
left: 0;
left: -1px;
border-left: 1px solid #ddd;
border-right: 1px solid #ddd;
}
> .ng-enter, &.ng-enter {
/* NEW content placed far LEFT BEFORE it slides IN from the LEFT */