From 98f2ecfc825e5193f4e99783282d4f39a464bc58 Mon Sep 17 00:00:00 2001
From: LordMathis <namesny.matus@gmail.com>
Date: Thu, 10 May 2018 11:36:42 +0200
Subject: [PATCH] Update css spinners

---
 src/components/Blog.js              |  2 +-
 src/components/Spinner.js           | 12 +++++++-----
 src/components/Spinner.scss         | 10 +++++++++-
 src/static/stylesheets/content.scss |  1 -
 4 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/src/components/Blog.js b/src/components/Blog.js
index 9895abb..12ded2a 100644
--- a/src/components/Blog.js
+++ b/src/components/Blog.js
@@ -7,7 +7,7 @@ import contentStyle from '../static/stylesheets/content.scss';
 export default class Blog extends Component {
 
   render() {
-    if (this.props.isLoading || true) {
+    if (this.props.isLoading) {
       return (
         <div className={contentStyle.contentWrapper}>
           <Spinner/>
diff --git a/src/components/Spinner.js b/src/components/Spinner.js
index b2ab553..82425fd 100644
--- a/src/components/Spinner.js
+++ b/src/components/Spinner.js
@@ -5,11 +5,13 @@ import styles from './Spinner.scss';
 export default class Spinner extends Component {
   render() {
     return (
-      <div class={styles.ldsEllipsis}>
-        <div></div>
-        <div></div>
-        <div></div>
-        <div></div>
+      <div className={styles.spinnerWrapper}>
+        <div className={styles.ldsEllipsis}>
+          <div></div>
+          <div></div>
+          <div></div>
+          <div></div>
+        </div>
       </div>
     )
   }
diff --git a/src/components/Spinner.scss b/src/components/Spinner.scss
index ac9bb39..09d1fff 100644
--- a/src/components/Spinner.scss
+++ b/src/components/Spinner.scss
@@ -1,12 +1,20 @@
 /*
   from https://loading.io/css/
 */
+@import "../static/stylesheets/variables.scss";
+
+.spinnerWrapper {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+}
 
 .ldsEllipsis {
   display: inline-block;
   position: relative;
   width: 64px;
   height: 64px;
+  margin: 0 auto;
 }
 .ldsEllipsis div {
   position: absolute;
@@ -14,7 +22,7 @@
   width: 11px;
   height: 11px;
   border-radius: 50%;
-  background: #fff;
+  background: $black;
   animation-timing-function: cubic-bezier(0, 1, 1, 0);
 }
 .ldsEllipsis div:nth-child(1) {
diff --git a/src/static/stylesheets/content.scss b/src/static/stylesheets/content.scss
index 5db7e35..7ae6d77 100644
--- a/src/static/stylesheets/content.scss
+++ b/src/static/stylesheets/content.scss
@@ -13,5 +13,4 @@
 
 .content {
   box-sizing: border-box;
-  margin: 0 auto;
 }