import type { TIllustrationAssetProps } from "../helper";
import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";

export function WorklogHorizontalStackIllustration({
  className,
}: TIllustrationAssetProps) {
  return (
    <svg
      width="81"
      height="91"
      viewBox="0 0 81 91"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      className={className}
    >
      <g opacity="0.2">
        <path
          d="M47.6236 2.3561C46.7083 1.89056 45.5326 1.93023 44.2544 2.57724L9.01614 20.5356C6.12039 22.0111 3.76915 26.0669 3.76915 29.586V72.4699C3.76915 74.4346 4.49506 75.8156 5.63915 76.4074L2.12 74.6163C0.975906 74.0324 0.25 72.6435 0.25 70.6788V27.7949C0.25 24.2679 2.60134 20.2199 5.49709 18.7444L40.7353 0.786111C42.0214 0.13121 43.1971 0.0994326 44.1045 0.564965L47.6236 2.3561Z"
          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
          strokeWidth="0.5"
          strokeLinecap="round"
          strokeLinejoin="round"
        />
        <path
          d="M47.6237 2.35598C48.7678 2.93987 49.4937 4.32876 49.4937 6.29346V49.1774C49.4937 52.7044 47.1424 56.7523 44.2466 58.2278L9.00838 76.1865C7.72226 76.8414 6.54668 76.8728 5.63929 76.4073C4.49519 75.8234 3.76929 74.4345 3.76929 72.4698V29.5859C3.76929 26.0589 6.12053 22.0109 9.01628 20.5354L44.2545 2.57713C45.5406 1.92223 46.7163 1.89045 47.6237 2.35598Z"
          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
          strokeWidth="0.5"
          strokeLinecap="round"
          strokeLinejoin="round"
        />
      </g>
      <g opacity="0.6">
        <path
          d="M63.002 9.15102C62.0867 8.68549 60.911 8.72515 59.6328 9.37216L24.3946 27.3305C21.4988 28.806 19.1476 32.8618 19.1476 36.3809V79.2652C19.1476 81.2299 19.8735 82.6105 21.0176 83.2023L17.4984 81.4112C16.3543 80.8273 15.6284 79.4388 15.6284 77.4741V34.5898C15.6284 31.0628 17.9798 27.0149 20.8755 25.5394L56.1137 7.58103C57.3999 6.92613 58.5755 6.89435 59.4829 7.35989L63.002 9.15102Z"
          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
          strokeWidth="0.5"
          strokeLinecap="round"
          strokeLinejoin="round"
        />
        <path
          d="M63.0021 9.14895C64.1462 9.73284 64.8721 11.1217 64.8721 13.0864V55.9707C64.8721 59.4977 62.5208 63.5453 59.625 65.0208L24.3869 82.9795C23.1008 83.6344 21.9251 83.6658 21.0177 83.2002C19.8736 82.6163 19.1477 81.2278 19.1477 79.2631V36.3788C19.1477 32.8518 21.4989 28.8039 24.3947 27.3284L59.6329 9.3701C60.919 8.71519 62.0947 8.68342 63.0021 9.14895Z"
          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
          strokeWidth="0.5"
          strokeLinecap="round"
          strokeLinejoin="round"
        />
      </g>
      <path
        d="M78.3799 15.9441C77.4646 15.4786 76.2889 15.5179 75.0107 16.1649L39.7726 34.1236C36.8768 35.5991 34.5255 39.6546 34.5255 43.1737V86.0579C34.5255 88.0226 35.2514 89.4036 36.3955 89.9954L32.8764 88.2043C31.7323 87.6204 31.0063 86.2315 31.0063 84.2668V41.3825C31.0063 37.8555 33.3577 33.808 36.2534 32.3325L71.4917 14.3738C72.7778 13.7189 73.9535 13.6875 74.8608 14.153L78.3799 15.9441Z"
        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
        strokeWidth="0.5"
        strokeLinecap="round"
        strokeLinejoin="round"
      />
      <path
        d="M78.38 15.944C79.5241 16.5279 80.25 17.9164 80.25 19.8811V62.7654C80.25 66.2924 77.8987 70.3403 75.003 71.8158L39.7648 89.7742C38.4787 90.4291 37.303 90.4608 36.3956 89.9953C35.2515 89.4114 34.5256 88.0225 34.5256 86.0578V43.1735C34.5256 39.6465 36.877 35.599 39.7727 34.1235L75.0109 16.1648C76.297 15.5099 77.4726 15.4785 78.38 15.944Z"
        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
        strokeWidth="0.5"
        strokeLinecap="round"
        strokeLinejoin="round"
      />
      <path
        d="M61.4946 39.3628L57.1313 41.5881C56.5317 41.8958 56.0425 41.5487 56.0425 40.8149C56.0425 40.0811 56.5317 39.2367 57.1313 38.929L61.4946 36.704C62.0943 36.3963 62.5835 36.7434 62.5835 37.4772C62.5835 38.211 62.0943 39.055 61.4946 39.3628Z"
        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.quaternary}
      />
      <path
        d="M59.3091 56.3957C59.0329 56.5377 58.7489 56.5535 58.5359 56.3957C58.1098 56.0958 58.1098 55.2513 58.5359 54.5175L61.8104 48.8682C62.2364 48.1344 62.9309 47.7794 63.349 48.0792C63.7751 48.379 63.7751 49.2232 63.349 49.957L60.0745 55.6066C59.8615 55.9775 59.5854 56.2456 59.3013 56.3876L59.3091 56.3957Z"
        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.quaternary}
      />
      <path
        d="M59.3092 67.0181C53.8964 69.7798 49.4937 66.6628 49.4937 60.0744C49.4937 53.4859 53.8964 45.8875 59.3092 43.1258C64.7219 40.3642 69.1248 43.4811 69.1248 50.0696C69.1248 56.6581 64.7219 64.2565 59.3092 67.0181ZM59.3092 45.785C55.0957 47.9312 51.6714 53.8412 51.6714 58.9621C51.6714 64.0829 55.0957 66.5052 59.3092 64.359C63.5226 62.2128 66.9471 56.3028 66.9471 51.1819C66.9471 46.061 63.5226 43.6388 59.3092 45.785Z"
        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.quaternary}
      />
    </svg>
  );
}