reports create, refactoring

src/components/Loader/Loader.js

@@ -1,15 +1,10 @@
-import SVGLoader from "react-loader-spinner";
-import './loader.css'
+import SVGLoader from 'react-loader-spinner'
+import './loader.scss'
 
-export const Loader = ({ width=50, height=50 }) => {
-    return (
-        <div className='loader'>
-            <SVGLoader
-                type="Circles"
-                color="#fff"
-                height={height}
-                width={width}
-            />
-        </div>
-    );
-}
+export const Loader = ({ width = 50, height = 50 }) => {
+  return (
+    <div className='loader'>
+      <SVGLoader type='Circles' color='#fff' height={height} width={width} />
+    </div>
+  )
+}

src/components/Loader/loader.css

@@ -1,11 +0,0 @@
-.loader {
-    height: 100%;
-    width: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
-.loader:hover path {
-        fill: #6aaf5c;
-}

src/components/Loader/loader.scss

@@ -0,0 +1,13 @@
+.loader {
+  height: 100%;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  &:hover {
+    path {
+      fill: #6aaf5c;
+    }
+  }
+}