Rift.IO OSM R1 Initial Submission

[osm/UI.git] / skyquake / framework / widgets / loading-indicator / loading-indicator-animations.scss

diff --git a/skyquake/framework/widgets/loading-indicator/loading-indicator-animations.scss b/skyquake/framework/widgets/loading-indicator/loading-indicator-animations.scss
new file mode 100644 (file)
index 0000000..44222de
--- /dev/null
+++ b/skyquake/framework/widgets/loading-indicator/loading-indicator-animations.scss
@@ -0,0 +1,53 @@
+
+/*
+ * 
+ *   Copyright 2016 RIFT.IO Inc
+ *
+ *   Licensed under the Apache License, Version 2.0 (the "License");
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the License at
+ *
+ *       http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ *
+ */
+.line-scale-pulse-out-rapid > div {
+  background-color: #fff;
+  width: 4px;
+  height: 2rem;
+  border-radius: 2px;
+  margin: 2px;
+  animation-fill-mode: both;
+  display: inline-block;
+  animation: line-scale-pulse-out-rapid 0.9s -0.5s infinite cubic-bezier(0.11, 0.49, 0.38, 0.78); }
+  .line-scale-pulse-out-rapid > div:nth-child(2), .line-scale-pulse-out-rapid > div:nth-child(4) {
+    animation-delay: -0.25s !important; }
+  .line-scale-pulse-out-rapid > div:nth-child(1), .line-scale-pulse-out-rapid > div:nth-child(5) {
+    animation-delay: 0s !important; }
+
+
+.loader-animation-enter, .loader-animation-appear {
+  opacity: 0.01;
+}
+
+.loader-animation-enter.loader-animation-enter-active, .loader-animation-appear.loader-animation-appear-active {
+  opacity: 1.0;
+  transition: opacity 300ms ease-in;
+}
+
+.loader-animation-leave {
+  visibility:hidden;
+  height:0px;
+  width:0px;
+  opacity:1.0;
+}
+
+.loader-animation-leave.loader-animation-leave-active {
+  opacity:0;
+  transition: opacity 300ms ease-in;
+}