blob: 260b6df4691bdc8aa5a82371108890f0c2053033 [file] [log] [blame]
Matteo Scandolo46b56102015-12-16 14:23:08 -08001body {
2 padding-top: 50px;
Matteo Scandolo35488182015-12-17 11:16:57 -08003}
4
5.list-group-item.active > a {
6 color: white;
7}
8
9/* ANIMATION */
10.animate-repeat{
11 /*background: red;*/
12}
13
14.animate-repeat.ng-move,
15.animate-repeat.ng-enter,
16.animate-repeat.ng-leave {
17 transition:all linear 0.5s;
18}
19
20/* Element Exit */
21.animate-repeat.ng-leave.ng-leave-active,
22.animate-repeat.ng-move,
23.animate-repeat.ng-enter {
24 /*opacity:0;*/
Matteo Scandolo7564bcb2015-12-17 14:34:20 -080025 /*animation:1.5s bounceOutDown ease;*/
Matteo Scandolo35488182015-12-17 11:16:57 -080026}
27
28/* Element Enter */
29.animate-repeat.ng-leave,
30.animate-repeat.ng-move.ng-move-active,
31.animate-repeat.ng-enter.ng-enter-active {
32 /*opacity:1;*/
Matteo Scandolo7564bcb2015-12-17 14:34:20 -080033 /*animation:1.5s bounceOutUp ease;*/
Matteo Scandolo35488182015-12-17 11:16:57 -080034}
35
Matteo Scandolo7564bcb2015-12-17 14:34:20 -080036@keyframes bounceInUp {
Matteo Scandolo35488182015-12-17 11:16:57 -080037 from, 60%, 75%, 90%, to {
38 animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
39 }
40
41 from {
42 opacity: 0;
Matteo Scandolo7564bcb2015-12-17 14:34:20 -080043 transform: translate3d(0, 3000px, 0);
Matteo Scandolo35488182015-12-17 11:16:57 -080044 }
45
46 60% {
47 opacity: 1;
Matteo Scandolo7564bcb2015-12-17 14:34:20 -080048 transform: translate3d(0, -20px, 0);
Matteo Scandolo35488182015-12-17 11:16:57 -080049 }
50
51 75% {
Matteo Scandolo7564bcb2015-12-17 14:34:20 -080052 transform: translate3d(0, 10px, 0);
Matteo Scandolo35488182015-12-17 11:16:57 -080053 }
54
55 90% {
Matteo Scandolo7564bcb2015-12-17 14:34:20 -080056 transform: translate3d(0, -5px, 0);
Matteo Scandolo35488182015-12-17 11:16:57 -080057 }
58
59 to {
Matteo Scandolo7564bcb2015-12-17 14:34:20 -080060 transform: translate3d(0, 0, 0);
Matteo Scandolo35488182015-12-17 11:16:57 -080061 }
62}
63
Matteo Scandolo7564bcb2015-12-17 14:34:20 -080064@keyframes bounceOutUp {
Matteo Scandolo35488182015-12-17 11:16:57 -080065 20% {
Matteo Scandolo7564bcb2015-12-17 14:34:20 -080066 transform: translate3d(0, -10px, 0);
67 }
68
69 40%, 45% {
Matteo Scandolo35488182015-12-17 11:16:57 -080070 opacity: 1;
Matteo Scandolo7564bcb2015-12-17 14:34:20 -080071 transform: translate3d(0, 20px, 0);
Matteo Scandolo35488182015-12-17 11:16:57 -080072 }
73
74 to {
75 opacity: 0;
Matteo Scandolo7564bcb2015-12-17 14:34:20 -080076 transform: translate3d(0, -2000px, 0);
77 }
78}
79
80/* LOADER */
81.loader {
82 font-size: 10px;
83 margin: 150px auto;
84 text-indent: -9999em;
85 width: 11em;
86 height: 11em;
87 border-radius: 50%;
88 background: #ffffff;
89 background: -moz-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
90 background: -webkit-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
91 background: -o-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
92 background: -ms-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
93 background: linear-gradient(to right, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
94 position: relative;
95 -webkit-animation: load3 1.4s infinite linear;
96 animation: load3 1.4s infinite linear;
97 -webkit-transform: translateZ(0);
98 -ms-transform: translateZ(0);
99 transform: translateZ(0);
100}
101.loader:before {
102 width: 50%;
103 height: 50%;
104 background: #105E9E;
105 border-radius: 100% 0 0 0;
106 position: absolute;
107 top: 0;
108 left: 0;
109 content: '';
110}
111.loader:after {
112 background: #fff;
113 width: 75%;
114 height: 75%;
115 border-radius: 50%;
116 content: '';
117 margin: auto;
118 position: absolute;
119 top: 0;
120 left: 0;
121 bottom: 0;
122 right: 0;
123}
124
125@keyframes load3 {
126 0% {
127 -webkit-transform: rotate(0deg);
128 transform: rotate(0deg);
129 }
130 100% {
131 -webkit-transform: rotate(360deg);
132 transform: rotate(360deg);
Matteo Scandolo35488182015-12-17 11:16:57 -0800133 }
Matteo Scandolo46b56102015-12-16 14:23:08 -0800134}