React-loader-spinner

import React from 'react';
import "react-loader-spinner/dist/loader/css/react-spinner-loader.css";
import Loader from "react-loader-spinner";
import '../style.css';
const LoaderComponent = () => {
    return (
        <div className="loader">
            <Loader
                type="Circles"
                color="#dc1c2c"
                height={50}
                width={100}
                //timeout={1000} //3 secs
            />
        </div>
    );
};

export default LoaderComponent;

style.css
===
.loader {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  animation: bg 1s;
}

Source: npmjs.com

Similar codes

0 vote144 views1 answer
./node_modules/react-chartjs-2/dist/index.modern.js Module not found: Can't resolve 'chart.js/auto' in 'C:\Users\shadi\WebstormProjects\PI_HR_HUB\node_modules\react-chartjs-2\dist'
Javascript React
0 vote142 views1 answer
How to filter items in react state
Javascript React
0 vote142 views1 answer
Deploy react to azure : web.config
Javascript React
2 votes201 views2 answers
React native settimeout
Javascript React
8 votes155 views3 answers
React js props
Javascript React
0 vote151 views1 answer
Empty div react
Javascript React
-2 votes115 views1 answer
React timepicker example
Javascript React
0 vote98 views1 answer
How to make a textarea unwritable in react native
Javascript React
1 vote134 views2 answers
Edit todo list react-redux
Javascript React
0 vote154 views1 answer
How to imporrt Browserrouter in react
Javascript React