mango-v4-ui/components/shared/DirectionTriangles.tsx

export const UpTriangle = ({ size }: { size?: 'small' }) => (
  <div
    className={`h-0 w-0 ${
      size === 'small'
        ? 'border-l-[4px] border-r-[4px] border-b-[6.92px]'
        : 'border-l-[6px] border-r-[6px] border-b-[10.39px]'
    } border-b-th-up border-l-transparent border-r-transparent`}
  />
)

export const DownTriangle = ({ size }: { size?: 'small' }) => (
  <div
    className={`h-0 w-0 ${
      size === 'small'
        ? 'border-l-[4px] border-r-[4px] border-t-[6.92px]'
        : 'border-l-[6px] border-r-[6px] border-t-[10.39px]'
    } border-l-transparent border-r-transparent border-t-th-down`}
  />
)