// @flow
import React from 'react';

import ApoliticalBrand from '../../../Theme/ApoliticalBrand';

type Props = {
  className?: string,
}

const { color } = ApoliticalBrand;

const LinkedinIcon = ({ className }: Props) => (
  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" className={className}>
    <desc>Linkedin Icon</desc>
    <g fill="none" fillRule="evenodd">
      <g fill={`${color.slate}`}>
        <g>
          <g>
            <g>
              <path d="M.605 7.696h4.678v16.302H.605V7.696zm2.22-2.04h-.034C1.098 5.657 0 4.41 0 2.833 0 1.222 1.13 0 2.857 0c1.726 0 2.787 1.219 2.821 2.828 0 1.578-1.095 2.829-2.853 2.829zM24 24h-5.304v-8.438c0-2.208-.83-3.714-2.655-3.714-1.395 0-2.171 1.016-2.533 1.998-.135.35-.114.84-.114 1.332V24H8.14s.068-14.946 0-16.304h5.255v2.558c.31-1.118 1.99-2.715 4.67-2.715 3.324 0 5.936 2.347 5.936 7.395V24z" transform="translate(-323 -789) translate(0 120) translate(135 657) translate(188 12)" />
            </g>
          </g>
        </g>
      </g>
    </g>
  </svg>

);

LinkedinIcon.defaultProps = {
  className: '',
};

export default LinkedinIcon;