blob: 8ac0369f9ffd5c94969e645099b18cd7caa7e87d [file] [log] [blame]
Matteo Scandolof0c32262016-03-11 13:47:27 -08001.row + .row {
2 margin-top: 20px;
3}
4
Matteo Scandoloc105c1c2016-03-12 09:17:14 -08005/* ANIMATIONS */
6.animate-vertical.ng-hide-add {
7 animation:0.5s slideOutDown ease-in-out;
8}
9.animate-vertical.ng-hide-remove {
10 animation:0.5s slideInUp ease-in-out;
11}
12
13@keyframes slideInUp {
14 from {
15 transform: translate3d(0, 100%, 0);
16 opacity: 0;
17 }
18
19 to {
20 transform: translate3d(0, 0, 0);
21 opacity: 1;
22 }
23}
24
25
26@keyframes slideOutDown {
27 from {
28 transform: translate3d(0, 0, 0);
29 opacity: 1;
30 }
31
32 to {
33 opacity: 0;
34 transform: translate3d(0, 100%, 0);
35 }
36}
37
Matteo Scandolof0c32262016-03-11 13:47:27 -080038/* LOADER */
39.loader {
40 font-size: 10px;
41 margin: 0 auto;
42 text-indent: -9999em;
43 width: 11em;
44 height: 11em;
45 border-radius: 50%;
46 background: #ffffff;
47 background: -moz-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
48 background: -webkit-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
49 background: -o-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
50 background: -ms-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
51 background: linear-gradient(to right, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
52 position: relative;
53 animation: load3 1.4s infinite linear;
54 transform: translateZ(0);
55}
56.loader:before {
57 width: 50%;
58 height: 50%;
59 background: #105E9E;
60 border-radius: 100% 0 0 0;
61 position: absolute;
62 top: 0;
63 left: 0;
64 content: '';
65}
66.loader:after {
67 background: #fff;
68 width: 75%;
69 height: 75%;
70 border-radius: 50%;
71 content: '';
72 margin: auto;
73 position: absolute;
74 top: 0;
75 left: 0;
76 bottom: 0;
77 right: 0;
78}
79
80@keyframes load3 {
81 0% {
82 -webkit-transform: rotate(0deg);
83 transform: rotate(0deg);
84 }
85 100% {
86 -webkit-transform: rotate(360deg);
87 transform: rotate(360deg);
88 }
89}