Added spinner class to Trongate CSS. Now you can have a nice little s…

…pinner on your pages by simply adding a div with a class of 'spinner'. By default, the spinner with be aligned to the center. To have the spinner aligned left, add an additional class of 'spinner-lhs'. To have the spinner aligned to the right, add an additional class of 'spinner-rhs'.

public/css/trongate.css

@@ -351,6 +351,48 @@ hr {
     height: 100%;
 }
 
+.spinner {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    pointer-events: none;
+    position: relative;
+}
+
+.spinner::after {
+    animation: spinning 0.5s infinite linear;
+    width: 24px;
+    height: 24px;
+    background: 0 0;
+    border: 3px solid var(--primary);
+    border-radius: 50%;
+    border-right-color: transparent;
+    border-top-color: transparent;
+    content: "";
+    display: block;
+    opacity: 1;
+    padding: 0;
+    position: absolute;
+    z-index: 1;
+}
+
+.spinner-lhs {
+    justify-content: flex-start;
+}
+
+.spinner-rhs {
+    justify-content: flex-end;
+}
+
+@keyframes spinning {
+  0% {
+    transform: rotate(0);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
 @media screen and (max-width: 550px) {
   button, .button {
     width: 100%;