summaryrefslogtreecommitdiff
path: root/www/lib/ionic/scss/_animations.scss
blob: 67e0e18491569e9ff9ce11dc86e3c2932411e6bc (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48

// Slide up from the bottom, used for modals
// -------------------------------

.slide-in-up {
  @include translate3d(0, 100%, 0);
}
.slide-in-up.ng-enter,
.slide-in-up > .ng-enter {
  @include transition(all cubic-bezier(.1, .7, .1, 1) 400ms);
}
.slide-in-up.ng-enter-active,
.slide-in-up > .ng-enter-active {
  @include translate3d(0, 0, 0);
}

.slide-in-up.ng-leave,
.slide-in-up > .ng-leave {
  @include transition(all ease-in-out 250ms);
}


// Scale Out
// Scale from hero (1 in this case) to zero
// -------------------------------

@-webkit-keyframes scaleOut {
  from { -webkit-transform: scale(1); opacity: 1; }
  to { -webkit-transform: scale(0.8); opacity: 0; }
}
@keyframes scaleOut {
  from { transform: scale(1); opacity: 1; }
  to { transform: scale(0.8); opacity: 0; }
}


// Super Scale In
// Scale from super (1.x) to duper (1 in this case)
// -------------------------------

@-webkit-keyframes superScaleIn {
  from { -webkit-transform: scale(1.2); opacity: 0; }
  to { -webkit-transform: scale(1); opacity: 1 }
}
@keyframes superScaleIn {
  from { transform: scale(1.2); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}