added svcapi ui and camunda code

[it/otf.git] / otf-frontend / client / src / styles / _spinner.scss

diff --git a/otf-frontend/client/src/styles/_spinner.scss b/otf-frontend/client/src/styles/_spinner.scss
new file mode 100644 (file)
index 0000000..8d24c4d
--- /dev/null
+++ b/otf-frontend/client/src/styles/_spinner.scss
@@ -0,0 +1,60 @@
+/*  Copyright (c) 2019 AT&T Intellectual Property.                             #\r
+#                                                                              #\r
+#   Licensed under the Apache License, Version 2.0 (the "License");            #\r
+#   you may not use this file except in compliance with the License.           #\r
+#   You may obtain a copy of the License at                                    #\r
+#                                                                              #\r
+#       http://www.apache.org/licenses/LICENSE-2.0                             #\r
+#                                                                              #\r
+#   Unless required by applicable law or agreed to in writing, software        #\r
+#   distributed under the License is distributed on an "AS IS" BASIS,          #\r
+#   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.   #\r
+#   See the License for the specific language governing permissions and        #\r
+#   limitations under the License.                                             #\r
+##############################################################################*/\r
+\r
+\r
+.spinner {\r
+    position: absolute;\r
+    top: 50%;\r
+    left: 50%;\r
+    -ms-transform: translate(-50%,-50%); /* IE 9 */\r
+    -webkit-transform: translate(-50%,-50%); /* Safari */\r
+    transform: translate(-50%,-50%); /* Standard syntax */\r
+    width: 70px;\r
+    height: 70px;\r
+    > div {\r
+        width: 18px;\r
+        height: 18px;\r
+        background-color: #333;\r
+\r
+        border-radius: 100%;\r
+        display: inline-block;\r
+        -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;\r
+        animation: sk-bouncedelay 1.4s infinite ease-in-out both;\r
+    }\r
+    .bounce1 {\r
+        -webkit-animation-delay: -0.32s;\r
+        animation-delay: -0.32s;\r
+    }\r
+\r
+    .bounce2 {\r
+        -webkit-animation-delay: -0.16s;\r
+        animation-delay: -0.16s;\r
+    }\r
+}\r
+\r
+@-webkit-keyframes sk-bouncedelay {\r
+    0%, 80%, 100% { -webkit-transform: scale(0) }\r
+    40% { -webkit-transform: scale(1.0) }\r
+}\r
+\r
+@keyframes sk-bouncedelay {\r
+    0%, 80%, 100% {\r
+        -webkit-transform: scale(0);\r
+        transform: scale(0);\r
+    } 40% {\r
+        -webkit-transform: scale(1.0);\r
+        transform: scale(1.0);\r
+    }\r
+}\r