Proyectos de Subversion LeadersLinked - Backend

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
16825 efrain 1 
// Animation mixins
2 
 
3 
@keyframes dropdownAnimation {
4 
  from {
5 
    opacity: 0;
6 
    transform: translate3d(0, 20px, 0);
7 
  }
8 
  to {
9 
    opacity: 1;
10 
    transform: none;
11 
    transform: translate3d(0, 0px , 0);
12 
  }
13 
}
14 
 
15 
.dropdownAnimation {
16 
  -webkit-animation-name: dropdownAnimation;
17 
          animation-name: dropdownAnimation;
18 
  -webkit-animation-duration: $action-transition-duration;
19 
  animation-duration: $action-transition-duration;
20 
  -webkit-animation-fill-mode: both;
21 
  animation-fill-mode: both;
22 
}
23 
 
24 
@keyframes fadeOut {
25 
  from {
26 
    opacity: 1;
27 
  }
28 
  to {
29 
    opacity: 0;
30 
  }
31 
}
32 
 
33 
.fadeOut {
34 
  animation-name: fadeOUt;
35 
}
36 
 
37 
@keyframes fadeInUp {
38 
  from {
39 
    opacity: 0;
40 
    transform: translate3d(0, 100%, 0);
41 
  }
42 
  to {
43 
    opacity: 1;
44 
    transform: none;
45 
  }
46 
}
47 
 
48 
.fadeInUp {
49 
  animation-name: fadeInUp;
50 
}
51 
 
52 
.infinite-spin {
53 
  @keyframes spin {
54 
    from {
55 
      transform: rotate(0deg);
56 
    }
57 
    to {
58 
      transform: rotate(360deg);
59 
    }
60 
  }
61 
  animation-name: spin;
62 
  animation-duration: 3s;
63 
  animation-iteration-count: infinite;
64 
  animation-timing-function: linear;
65 
}
66 
 
67 
@mixin transition($settings) {
68 
  -webkit-transition: $settings;
69 
  -moz-transition: $settings;
70 
  -ms-transition: $settings;
71 
  -o-transition: $settings;
72 
  transition: $settings;
73 
}
74 
 
75 
.pulse {
76 
  $dim : 7px;
77 
  $mult : 4;
78 
  @keyframes pulse{
79 
    0% {
80 
      opacity: 1;
81 
      width: $dim;
82 
      height: $dim;
83 
      left: 0;
84 
      top: 0;
85 
    }
86 
 
87 
    95% {
88 
      opacity: 0.1;
89 
      left: -(($dim * $mult) - $dim) * .5;
90 
      top: -(($dim * $mult) - $dim) * .5;
91 
      width: $dim * $mult;
92 
      height: $dim * $mult;
93 
    }
94 
 
95 
    100% {
96 
      opacity: 0;
97 
      width: $dim;
98 
      height: $dim;
99 
      left: 0;
100 
      top: 0;
101 
    }
102 
  }
103 
  animation-name: pulse;
104 
  animation-duration: .9s;
105 
  animation-iteration-count: infinite;
106 
  animation-timing-function: ease-out;
107 
}