import React from "react";
import styled, { css } from "styled-components";

const StyledSpinner = styled.div`
  width: 18px;
  height: 18px;
  margin: 2 auto;
  border: 1px solid transparent;
  border-top: 1px solid ${(props) => (props.color ? props.color : "#707070")};

  border-radius: 50%;
  animation: rotate 0.8s infinite linear;

  @keyframes rotate {
    from {
      transform: rotate(0);
    }
    to {
      transform: rotate(360deg);
    }
  }
`;

const SmallSpinner = (props: any) => {
  return (
    <>
      <StyledSpinner {...props} />
    </>
  );
};
export { SmallSpinner };
