import React from 'react'
import Vector from '../../Vector'
import { wording } from './fixture'
import { PlayButtonIconWrap } from './_elements'

/**
 * @todo @fixme move icon into an icon, button uses the icon, otherwise this icon isn't usable on it's own
 * @todo @fixme wrong widths
 */
class PlayButtonIcon extends React.PureComponent {
  render() {
    const { width, height, className } = this.props
    return (
      <PlayButtonIconWrap>
        <Vector
          width="297"
          height="300"
          viewBox="0 0 297 300"
          className={className}
        >
          <path
            fill="#fff"
            fillOpacity="0.53"
            fillRule="evenodd"
            d="M148.5,5A145.5,145.5,0,1,1,3,150.5,145.5,145.5,0,0,1,148.5,5Zm77.1,137.287-107.916-65.2a15.269,15.269,0,0,0-13.562-.891c-4.374,1.838-7.11,5.579-7.11,9.615V216.18c0,4.071,2.736,7.805,7.11,9.631a15.179,15.179,0,0,0,5.911,1.179,14.834,14.834,0,0,0,7.651-2.106L225.6,159.736c3.41-2.084,5.387-5.3,5.387-8.725C231.021,147.531,228.961,144.33,225.6,142.287Z"
          />
        </Vector>
      </PlayButtonIconWrap>
    )
  }
}

export { PlayButtonIcon }
export default PlayButtonIcon