add SCSS styling to ThreeDotsLoader

Author: Bartek532

components/Snippets/ThreeDotsLoader.js

@@ -121,4 +121,49 @@ const cssStyling = `
 }
 `;
 
-export { stitchesStyling, cssStyling, Component };
+const scssStyling = `
+.exampleClass {
+  position: relative;
+  width: 14px;
+  height: 14px;
+  border-radius: 50%;
+  background-color: white;
+  color: white;
+  animation: flashing 0.8s infinite linear alternate 0.4s;
+
+  &::before,
+  &::after {
+    content: '';
+    display: inline-block;
+    position: absolute;
+    top: 0;
+    width: 14px;
+    height: 14px;
+    border-radius: 50%;
+    background-color: white;
+    color: white;
+  }
+
+  &::before {
+    left: -21px;
+    animation: flashing 0.8s infinite alternate;
+  }
+
+  &::after {
+    left: 21px;
+    animation: flashing 0.8s infinite alternate 0.8s;
+  }
+}
+
+@keyframes flashing {
+  0% {
+    background-color: white;
+  }
+  50%,
+  100% {
+    background-color: rgba(255, 255, 255, 0.3);
+  }
+}
+`;
+
+export { stitchesStyling, cssStyling, scssStyling, Component };