javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-07 06:57:02 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' of https://github.com/driftyco/ionic

Browse Source
This commit is contained in:
Max Lynch
2013-10-06 18:20:11 -05:00
parent 261321d988 c78fc6cbe6
commit 3e9ebbae35
4 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
dist/ionic-ios7.css vendored
View File

@ -2305,11 +2305,11 @@ a.button {
padding: 10px; } padding: 10px; }
.slide-in-up { .slide-in-up {
opacity: 0; opacity: 0.5;
-webkit-transform: translate3d(0, 100%, 0); -webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0);
-webkit-transition: -webkit-transform 0.25s, opacity 0.25s; -webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
transition: -webkit-transform 0.25s, opacity 0.25s; transition: -webkit-transform 0.3s, opacity 0.2s;
-webkit-transition-timing-function: cubic-bezier(0.1, 0.7, 0.1, 1); -webkit-transition-timing-function: cubic-bezier(0.1, 0.7, 0.1, 1);
transition-timing-function: cubic-bezier(0.1, 0.7, 0.1, 1); transition-timing-function: cubic-bezier(0.1, 0.7, 0.1, 1);
-webkit-animation-fill-mode: forwards; } -webkit-animation-fill-mode: forwards; }
@ -2321,7 +2321,7 @@ a.button {
@keyframes fadein { @keyframes fadein {
from { from {
opacity: 0; } opacity: 0.7; }
to { to {
opacity: 1; } } opacity: 1; } }

8
dist/ionic.css vendored
View File

@ -2387,11 +2387,11 @@ a.button {
padding: 10px; } padding: 10px; }
.slide-in-up { .slide-in-up {
opacity: 0; opacity: 0.5;
-webkit-transform: translate3d(0, 100%, 0); -webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0);
-webkit-transition: -webkit-transform 0.25s, opacity 0.25s; -webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
transition: -webkit-transform 0.25s, opacity 0.25s; transition: -webkit-transform 0.3s, opacity 0.2s;
-webkit-transition-timing-function: cubic-bezier(0.1, 0.7, 0.1, 1); -webkit-transition-timing-function: cubic-bezier(0.1, 0.7, 0.1, 1);
transition-timing-function: cubic-bezier(0.1, 0.7, 0.1, 1); transition-timing-function: cubic-bezier(0.1, 0.7, 0.1, 1);
-webkit-animation-fill-mode: forwards; } -webkit-animation-fill-mode: forwards; }
@ -2403,7 +2403,7 @@ a.button {
@keyframes fadein { @keyframes fadein {
from { from {
opacity: 0; } opacity: 0.7; }
to { to {
opacity: 1; } } opacity: 1; } }

8
scss/ionic/_animations.scss
View File

@ -2,13 +2,13 @@ $bezier-function: cubic-bezier(.1, .7, .1, 1);
.slide-in-up { .slide-in-up {
// Start hidden // Start hidden
opacity: 0; opacity: 0.5;
// Start it down low // Start it down low
-webkit-transform: translate3d(0, 100%, 0); -webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0);
-webkit-transition: -webkit-transform 0.25s, opacity 0.25s; -webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
transition: -webkit-transform 0.25s, opacity 0.25s; transition: -webkit-transform 0.3s, opacity 0.2s;
-webkit-transition-timing-function: $bezier-function; -webkit-transition-timing-function: $bezier-function;
transition-timing-function: $bezier-function; transition-timing-function: $bezier-function;
@ -23,7 +23,7 @@ $bezier-function: cubic-bezier(.1, .7, .1, 1);
} }
@keyframes fadein { @keyframes fadein {
from { opacity:0; } from { opacity:0.7; }
to { opacity:1; } to { opacity:1; }
} }
@-webkit-keyframes fadein { /* Safari and Chrome */ @-webkit-keyframes fadein { /* Safari and Chrome */

4
test/modals.html
View File

@ -24,14 +24,14 @@
</section> </section>
<div id="modal" class="modal slide-in-up"> <div id="modal" class="modal slide-in-up">
<header class="bar bar-header bar-success"> <header class="bar bar-header bar-secondary">
<h1 class="title">BOOM</h1> <h1 class="title">BOOM</h1>
<a href="#" class="button" id="modal-closer">Close</a> <a href="#" class="button" id="modal-closer">Close</a>
</header> </header>
<main class="content padded has-header"> <main class="content padded has-header">
<h2>I'm a thing</h2> <h2>I'm a thing</h2>
<div style="background-color: red; width: 100%; height: 1000px"></div> <div style="background-color: blue; width: 100%; height: 1000px"></div>
</main> </main>
</div> </div>