import styled from 'styled-components';

export const LineStyle = styled.div`
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 100%;
  overflow-x:hidden;
  background: gray;
  z-index: 10;
  &:before {
    animation:left-to-right 0.5s alternate infinite linear;
    background-image:linear-gradient(to right, #1890FF, #9C7AFF, #F15A5A, #FAAD14, #23CBB7);
    content:"";
    height:100%;
    left:-100%;
    overflow:hidden;
    position:absolute;
    top:0;
    width: 300%;
  }

  @keyframes left-to-right {
    0% {
      transform:translateX(0%);
    }
    100% {
      transform:translateX(-30%);
    }
  }
`;

export const Container = styled.div`
  padding: 30px;
  text-align: center;
`;

