import React from 'react';
import { SBox } from '../../common/s-components/layout/s-box';
import { AnimatedGradient } from '../../common/components/animated-gradient';

export const SkeletonTotalBox: React.FC = () => {
  return (
    <SBox
      position="relative"
      mx={16}
      height={32}
      width={104}
      alignItems="center"
      overflow="hidden"
      bg="eastBay"
    >
      <SBox position="absolute" top={-16} left={0} height={64} flex={1}>
        <AnimatedGradient angle={8} gradientWidth={160} />
      </SBox>
    </SBox>
  );
};