[ ADD ] react configuration
This commit is contained in:
14
react/src/components/Loader/Loader.js
Normal file
14
react/src/components/Loader/Loader.js
Normal file
@ -0,0 +1,14 @@
|
||||
import React from "react";
|
||||
import "./Loader.scss";
|
||||
|
||||
const Loader = () => {
|
||||
return (
|
||||
<div className="spinnerContainer d-flex justify-content-center align-items-center h-100">
|
||||
<div className="spinner-border text-primary" role="status">
|
||||
<span className="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Loader;
|
31
react/src/components/Loader/Loader.scss
Normal file
31
react/src/components/Loader/Loader.scss
Normal file
@ -0,0 +1,31 @@
|
||||
.spinnerContainer {
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.loading-indicator:before {
|
||||
content: "";
|
||||
background: #000000cc;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.loading-indicator:after {
|
||||
content: "\f1ce";
|
||||
font-family: FontAwesome;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
z-index: 1001;
|
||||
color: white;
|
||||
text-align: center;
|
||||
font-weight: 100;
|
||||
font-size: 4rem;
|
||||
-webkit-animation: fa-spin 1s infinite linear;
|
||||
animation: fa-spin 1s infinite linear;
|
||||
}
|
Reference in New Issue
Block a user