import * as React from 'react';

import s from './GradientLine.module.scss';

interface IGradientLineProps {
  height?: number;
}

export const GradientLine = ({ height = 5 }: IGradientLineProps) => {
  return (
    <svg className={s.gradientLine} height={height} fill="none" xmlns="http://www.w3.org/2000/svg">
      <rect width="100%" height={height} fill="url(#paint0_linear)" />
      <defs>
        <linearGradient id="paint0_linear" x1="0" y1="0" gradientUnits="userSpaceOnUse">
          <stop stopColor="#FFD500" />
          <stop offset={(1 / 7).toString(10)} stopColor="#FF6A00" />
          <stop offset={(2 / 7).toString(10)} stopColor="#FE3C72" />
          <stop offset={(3 / 7).toString(10)} stopColor="#A100FF" />
          <stop offset={(4 / 7).toString(10)} stopColor="#B62684" />
          <stop offset={(5 / 7).toString(10)} stopColor="#00C5F1" />
          <stop offset={(6 / 7).toString(10)} stopColor="#00E0AA" />
          <stop offset="1" stopColor="#20C420" />
        </linearGradient>
      </defs>
    </svg>
    // </div>
  );
};