import React from 'react'

import './styles.css'

const SettingsIcon = () => (
  <div className="iconContainer">
    <svg
      width="24"
      height="24"
      viewBox="0 0 24 24"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path
        fillRule="evenodd"
        clipRule="evenodd"
        d="M4.40262 11.622C5.51862 12.005 6.40762 12.939 6.77962 14.123L6.81962 14.243C7.24562 15.499 7.07262 16.851 6.35862 17.865C6.22862 18.049 6.25762 18.269 6.39462 18.373L8.46662 19.947C8.53962 20.002 8.61062 20.002 8.65462 19.997C8.70462 19.989 8.77762 19.962 8.83662 19.878L9.06762 19.55C9.75662 18.573 10.8666 17.97 12.0386 17.936C13.3546 17.909 14.5366 18.512 15.2726 19.575L15.3906 19.746C15.4496 19.83 15.5216 19.858 15.5726 19.866C15.6166 19.875 15.6886 19.872 15.7606 19.816L17.8216 18.261C17.9656 18.153 17.9976 17.922 17.8906 17.767L17.6306 17.392C16.9606 16.424 16.7616 15.168 17.0986 14.033C17.4646 12.797 18.3956 11.819 19.5906 11.419L19.7916 11.351C19.9526 11.298 20.0396 11.098 19.9826 10.914L19.1956 8.393C19.1586 8.275 19.0826 8.222 19.0406 8.2C18.9806 8.169 18.9156 8.164 18.8536 8.185L18.5136 8.298C17.3506 8.685 16.0676 8.475 15.0826 7.734L14.9746 7.653C14.0386 6.949 13.4816 5.814 13.4856 4.618L13.4876 4.338C13.4876 4.205 13.4246 4.122 13.3866 4.084C13.3506 4.047 13.2896 4.003 13.2036 4.003L10.6566 4C10.5006 4 10.3736 4.149 10.3726 4.333L10.3716 4.575C10.3666 5.79 9.79762 6.946 8.84962 7.669L8.72062 7.767C7.67762 8.56 6.31762 8.784 5.08562 8.364C5.03862 8.348 4.99462 8.351 4.95262 8.373C4.92062 8.389 4.86262 8.43 4.83462 8.521L4.01762 11.117C3.95862 11.306 4.05562 11.503 4.23862 11.566L4.40262 11.622ZM8.61362 22C8.12762 22 7.65562 21.842 7.25762 21.539L5.18562 19.966C4.19562 19.216 3.97662 17.773 4.69662 16.75C5.07062 16.22 5.14762 15.539 4.92762 14.893L4.87262 14.725C4.68962 14.143 4.27162 13.691 3.75462 13.514H3.75362L3.59062 13.457C2.37262 13.04 1.72262 11.749 2.10962 10.517L2.92562 7.922C3.11062 7.335 3.50962 6.861 4.04962 6.588C4.57762 6.322 5.17462 6.281 5.73262 6.472C6.33162 6.676 6.99662 6.565 7.50962 6.175L7.63862 6.077C8.09462 5.729 8.36962 5.164 8.37162 4.567L8.37262 4.326C8.37762 3.042 9.40262 2 10.6556 2H10.6596L13.2066 2.003C13.8086 2.004 14.3766 2.242 14.8046 2.673C15.2476 3.118 15.4896 3.713 15.4876 4.348L15.4856 4.627C15.4836 5.193 15.7426 5.728 16.1796 6.056L16.2866 6.137C16.7456 6.482 17.3436 6.581 17.8806 6.401L18.2196 6.288C18.7966 6.096 19.4106 6.143 19.9516 6.42C20.5066 6.704 20.9166 7.193 21.1046 7.798L21.8916 10.319C22.2716 11.537 21.6136 12.851 20.4266 13.248L20.2256 13.315C19.6496 13.509 19.1966 13.989 19.0156 14.601C18.8496 15.162 18.9456 15.779 19.2746 16.253L19.5346 16.628C20.2486 17.66 20.0206 19.108 19.0266 19.857L16.9656 21.413C16.4706 21.787 15.8636 21.938 15.2546 21.841C14.6406 21.742 14.1046 21.402 13.7456 20.884L13.6276 20.712C13.2776 20.208 12.7176 19.902 12.1306 19.935C11.5426 19.951 11.0346 20.23 10.7026 20.702L10.4716 21.03C10.1096 21.543 9.57262 21.878 8.96162 21.974C8.84462 21.992 8.72862 22 8.61362 22ZM11.9998 10.4999C11.1728 10.4999 10.4998 11.1729 10.4998 11.9999C10.4998 12.8269 11.1728 13.4999 11.9998 13.4999C12.8268 13.4999 13.4998 12.8269 13.4998 11.9999C13.4998 11.1729 12.8268 10.4999 11.9998 10.4999ZM11.9998 15.4999C10.0698 15.4999 8.49982 13.9299 8.49982 11.9999C8.49982 10.0699 10.0698 8.4999 11.9998 8.4999C13.9298 8.4999 15.4998 10.0699 15.4998 11.9999C15.4998 13.9299 13.9298 15.4999 11.9998 15.4999Z"
        fill={'var(--navbar-icons)'}
      />
      <mask
        id="mask0_68_24908"
        maskUnits="userSpaceOnUse"
        x="1"
        y="2"
        width="21"
        height="20"
      >
        <path
          fillRule="evenodd"
          clipRule="evenodd"
          d="M4.40262 11.622C5.51862 12.005 6.40762 12.939 6.77962 14.123L6.81962 14.243C7.24562 15.499 7.07262 16.851 6.35862 17.865C6.22862 18.049 6.25762 18.269 6.39462 18.373L8.46662 19.947C8.53962 20.002 8.61062 20.002 8.65462 19.997C8.70462 19.989 8.77762 19.962 8.83662 19.878L9.06762 19.55C9.75662 18.573 10.8666 17.97 12.0386 17.936C13.3546 17.909 14.5366 18.512 15.2726 19.575L15.3906 19.746C15.4496 19.83 15.5216 19.858 15.5726 19.866C15.6166 19.875 15.6886 19.872 15.7606 19.816L17.8216 18.261C17.9656 18.153 17.9976 17.922 17.8906 17.767L17.6306 17.392C16.9606 16.424 16.7616 15.168 17.0986 14.033C17.4646 12.797 18.3956 11.819 19.5906 11.419L19.7916 11.351C19.9526 11.298 20.0396 11.098 19.9826 10.914L19.1956 8.393C19.1586 8.275 19.0826 8.222 19.0406 8.2C18.9806 8.169 18.9156 8.164 18.8536 8.185L18.5136 8.298C17.3506 8.685 16.0676 8.475 15.0826 7.734L14.9746 7.653C14.0386 6.949 13.4816 5.814 13.4856 4.618L13.4876 4.338C13.4876 4.205 13.4246 4.122 13.3866 4.084C13.3506 4.047 13.2896 4.003 13.2036 4.003L10.6566 4C10.5006 4 10.3736 4.149 10.3726 4.333L10.3716 4.575C10.3666 5.79 9.79762 6.946 8.84962 7.669L8.72062 7.767C7.67762 8.56 6.31762 8.784 5.08562 8.364C5.03862 8.348 4.99462 8.351 4.95262 8.373C4.92062 8.389 4.86262 8.43 4.83462 8.521L4.01762 11.117C3.95862 11.306 4.05562 11.503 4.23862 11.566L4.40262 11.622ZM8.61362 22C8.12762 22 7.65562 21.842 7.25762 21.539L5.18562 19.966C4.19562 19.216 3.97662 17.773 4.69662 16.75C5.07062 16.22 5.14762 15.539 4.92762 14.893L4.87262 14.725C4.68962 14.143 4.27162 13.691 3.75462 13.514H3.75362L3.59062 13.457C2.37262 13.04 1.72262 11.749 2.10962 10.517L2.92562 7.922C3.11062 7.335 3.50962 6.861 4.04962 6.588C4.57762 6.322 5.17462 6.281 5.73262 6.472C6.33162 6.676 6.99662 6.565 7.50962 6.175L7.63862 6.077C8.09462 5.729 8.36962 5.164 8.37162 4.567L8.37262 4.326C8.37762 3.042 9.40262 2 10.6556 2H10.6596L13.2066 2.003C13.8086 2.004 14.3766 2.242 14.8046 2.673C15.2476 3.118 15.4896 3.713 15.4876 4.348L15.4856 4.627C15.4836 5.193 15.7426 5.728 16.1796 6.056L16.2866 6.137C16.7456 6.482 17.3436 6.581 17.8806 6.401L18.2196 6.288C18.7966 6.096 19.4106 6.143 19.9516 6.42C20.5066 6.704 20.9166 7.193 21.1046 7.798L21.8916 10.319C22.2716 11.537 21.6136 12.851 20.4266 13.248L20.2256 13.315C19.6496 13.509 19.1966 13.989 19.0156 14.601C18.8496 15.162 18.9456 15.779 19.2746 16.253L19.5346 16.628C20.2486 17.66 20.0206 19.108 19.0266 19.857L16.9656 21.413C16.4706 21.787 15.8636 21.938 15.2546 21.841C14.6406 21.742 14.1046 21.402 13.7456 20.884L13.6276 20.712C13.2776 20.208 12.7176 19.902 12.1306 19.935C11.5426 19.951 11.0346 20.23 10.7026 20.702L10.4716 21.03C10.1096 21.543 9.57262 21.878 8.96162 21.974C8.84462 21.992 8.72862 22 8.61362 22ZM11.9998 10.4999C11.1728 10.4999 10.4998 11.1729 10.4998 11.9999C10.4998 12.8269 11.1728 13.4999 11.9998 13.4999C12.8268 13.4999 13.4998 12.8269 13.4998 11.9999C13.4998 11.1729 12.8268 10.4999 11.9998 10.4999ZM11.9998 15.4999C10.0698 15.4999 8.49982 13.9299 8.49982 11.9999C8.49982 10.0699 10.0698 8.4999 11.9998 8.4999C13.9298 8.4999 15.4998 10.0699 15.4998 11.9999C15.4998 13.9299 13.9298 15.4999 11.9998 15.4999Z"
          fill={'var(--navbar-icons)'}
        />
      </mask>
      <g mask="url(#mask0_68_24908)">
        <rect width="24" height="24" fill={'var(--navbar-icons)'} />
      </g>
    </svg>
  </div>
)

export default SettingsIcon
