import React from 'react';
import './Loader.scss'

interface LoaderProps {
    color?: string
    big?: boolean
}

const Loader = ({color='#040059', big=false} : LoaderProps) => {


    const containerBigStyle:React.CSSProperties= {
        display: 'flex',
        alignItems: 'center',
        justifyContent:'center',
        flex: 1,
        width: '100%',
        paddingBottom: '140px'
    }

    const style:React.CSSProperties  = {
        borderColor: `${color} transparent transparent transparent`,
        width: big ? '120px': '22px',
        borderWidth: big ? '5px': '3px'
    }

    return (
        <div className="lds-ring" style={big ? containerBigStyle : {}}>
            <div style={style}></div>
            <div style={style}></div>
            <div style={style}></div>
            <div style={style}></div>
        </div>
    );
}

export default Loader;