import React from 'react'
import PropTypes from 'prop-types'

const Logo = props =>
  <svg width='27px' height='27px' viewBox='0 0 27 27' className='linkedin-icon'>
    <g id='inhouselearning-myopain-1440' stroke='none' strokeWidth='1' fill='none' fillRule='evenodd' transform='translate(-156.000000, -1919.000000)'>
      <g id='Group-3' transform='translate(96.000000, 1597.000000)'>
        <g id='Group-2' transform='translate(40.000000, 319.000000)'>
          <g id='logolinkedin' transform='translate(20.000000, 3.000000)'>
            <rect id='Rectangle-8' fill={props.letterColor} x='1.42105263' y='1.77631579' width='23.8026316' height='23.4473684' />
            <path d='M24.5576309,0 L2.44236911,0 C1.0935,0 0,1.0935 0,2.44236911 L0,24.5575602 C0,25.9065 1.0935,27 2.44236911,27 L24.5575602,27 C25.9065,27 27,25.9065 27,24.5575602 L27,2.44236911 C27,1.0935 25.9065,0 24.5576309,0 Z M8.35494503,23.3135812 C8.35494503,23.7061414 8.03674084,24.0243455 7.64418063,24.0243455 L4.61862565,24.0243455 C4.22606545,24.0243455 3.90786126,23.7061414 3.90786126,23.3135812 L3.90786126,10.6305785 C3.90786126,10.2380183 4.22606545,9.91981414 4.61862565,9.91981414 L7.64418063,9.91981414 C8.03674084,9.91981414 8.35494503,10.2380183 8.35494503,10.6305785 L8.35494503,23.3135812 Z M6.13140314,8.72425131 C4.54398691,8.72425131 3.25710471,7.43736911 3.25710471,5.84995288 C3.25710471,4.26253665 4.54398691,2.97565445 6.13140314,2.97565445 C7.71881937,2.97565445 9.00570157,4.26253665 9.00570157,5.84995288 C9.00570157,7.43736911 7.71889005,8.72425131 6.13140314,8.72425131 Z M24.1664136,23.3708325 C24.1664136,23.7317277 23.8737958,24.0243455 23.5129005,24.0243455 L20.2662565,24.0243455 C19.9053613,24.0243455 19.6127435,23.7317277 19.6127435,23.3708325 L19.6127435,17.4217853 C19.6127435,16.5343194 19.8730602,13.5328665 17.2935,13.5328665 C15.2926021,13.5328665 14.8867539,15.5872696 14.8052592,16.5092277 L14.8052592,23.3708325 C14.8052592,23.7317277 14.512712,24.0243455 14.1517461,24.0243455 L11.0116885,24.0243455 C10.6507932,24.0243455 10.3581754,23.7317277 10.3581754,23.3708325 L10.3581754,10.5733272 C10.3581754,10.2124319 10.6507932,9.91981414 11.0116885,9.91981414 L14.1517461,9.91981414 C14.5126414,9.91981414 14.8052592,10.2124319 14.8052592,10.5733272 L14.8052592,11.6798325 C15.5471937,10.5664005 16.6498115,9.70699476 18.9974686,9.70699476 C24.1961702,9.70699476 24.1664136,14.5638848 24.1664136,17.2325026 L24.1664136,23.3708325 Z' id='Shape' fill={props.rectangleColor} fillRule='nonzero' />
          </g>
        </g>
      </g>
    </g>
  </svg>

Logo.propTypes = {
  rectangleColor: PropTypes.string,
  letterColor: PropTypes.string
}

Logo.defaultProps = {
  letterColor: '#F26522',
  rectangleColor: '#FFF'
}

export default Logo
