import * as React from 'react';

import AccessibleSVG from '../accessible-svg';

import { Icon } from '../iconTypes';

const IconSettingInverted = ({ className = '', color = '#444444', height = 16, title, width = 16 }: Icon) => (
    <AccessibleSVG
        className={`icon-setting-inverted ${className}`}
        height={height}
        title={title}
        viewBox="0 0 16 16"
        width={width}
    >
        <g className="fill-color" fill={color}>
            <path d="M15.1 9.4l-1.3-.9V8v-.5l1.3-1c.3-.3.4-.7.2-1L13.8 3l-.1-.1c-.2-.2-.6-.3-.9-.2l-1.6.6c-.2-.1-.4-.3-.8-.5l-.2-1.5c.1-.5-.4-.9-.8-.9H6.5c-.4 0-.9.3-.9.8l-.2 1.6c-.1.1-.2.2-.4.3-.1 0-.3.2-.4.3l-1.5-.7c-.4-.1-.8 0-1 .2l-.1.2L.6 5.5c-.2.3-.1.7.2 1l1.3 1v1l-1.3 1c-.3.3-.4.7-.2 1L2 13l.1.1c.2.2.6.3.9.2l1.6-.6c.2.1.5.3.8.5l.2 1.6c0 .4.4.7.9.7h2.9c.4 0 .9-.3.9-.8l.2-1.5c.4-.2.6-.3.8-.5l1.5.6c.3.2.9 0 1.1-.4l1.4-2.4c.3-.4.2-.9-.2-1.1zM1.4 6.1l.1-.1.1-.1-.2.2zm.8 2.8zm3.5 4.4zm7.5-.9l-1.7-.7-.3-.1-.2.2c-.3.2-.5.3-1.1.6l-.2.1v.3l-.3 1.7H6.7l-.3-1.7v-.3l-.2-.1c-.6-.3-.9-.4-1.1-.6l-.2-.2-.3.1-1.7.7-1.3-2.2L3 9.1l.3-.2-.2-.3v-.5-.3-.7L3 6.9l-1.4-1 1.3-2.2 1.6.7.2.1.2-.1s.5-.3.6-.4c.2-.2.4-.3.5-.3l.3-.1v-.3l.3-1.8h2.5l.3 1.8v.3l.2.1c.6.3.9.4 1.1.6l.2.2.3-.1 1.7-.7 1.3 2.2L12.8 7l-.3.2.1.3.1.1V9l.3.2 1.5 1-1.3 2.2z" />
            <path d="M8 4.5C6.1 4.5 4.5 6.1 4.5 8s1.6 3.5 3.5 3.5 3.5-1.6 3.5-3.5S9.9 4.5 8 4.5zm0 6c-1.4 0-2.5-1.1-2.5-2.5S6.6 5.5 8 5.5s2.5 1.1 2.5 2.5-1.1 2.5-2.5 2.5z" />
        </g>
    </AccessibleSVG>
);

export default IconSettingInverted;
