klarna/ui-react-components

View on GitHub
components/icons/KlarnaLogo.jsx

Summary

Maintainability
A
0 mins
Test Coverage
import React, { PropTypes } from 'react'
import Icon, { icon } from './Icon.jsx'

const KlarnaLogo = (hexColor, {width, ...otherProps}) => {
  const height = width / KlarnaLogo.ratio

  return (
    <Icon
      width={width}
      height={height}
      viewBox='0 0 101 28'
      fill={hexColor}
      {...otherProps}>
      <path d='M43.502 8.803c-1.353-1.047-3.373-1.579-6-1.579-2.265 0-4.717.382-6.129.712-.356.084-.556.3-.556.605v2.768c0 .312.158.46.484.46h.177c1.057-.097 3.608-.238 5.918-.238 1.699 0 2.836.426 2.836 2.511v1.384h-2.09c-3.035 0-5.19.45-6.58 1.365-1.36.903-2.028 2.298-2.028 4.262v.31c0 4.984 3.718 5.728 5.937 5.728 1.896 0 3.308-.44 4.863-1.51l.255-.177v.846c0 .293.244.533.55.533h3.996c.302 0 .552-.24.552-.533V14.042c0-2.35-.74-4.115-2.185-5.239zm-3.2 13.766l-.084.047c-1.056.581-2.022.863-2.939.863-1.497 0-2.36-.34-2.36-2.092v-.348c0-2.169.876-2.978 3.232-2.978h2.152v4.508zm19.19-15.345c-1.7 0-3.407.59-4.66 1.63l-.257.21V8.039c0-.299-.251-.54-.549-.54h-4.204a.545.545 0 0 0-.546.54v18.478c0 .294.284.575.582.575h4.271c.293 0 .553-.27.553-.575V12.842l.079-.04c1.563-.834 3.077-1.236 4.626-1.236h.286c.215 0 .372-.268.372-.508v-3.3a.545.545 0 0 0-.554-.534zM95.55 8.803c-1.355-1.047-3.372-1.579-6-1.579-2.261 0-4.718.382-6.13.712-.356.084-.553.3-.553.605v2.768c0 .312.156.46.481.46h.178c1.057-.097 3.607-.238 5.919-.238 1.7 0 2.832.426 2.832 2.511v1.384h-2.085c-3.042 0-5.19.45-6.578 1.365-1.366.903-2.033 2.298-2.033 4.262v.31c0 4.984 3.718 5.728 5.939 5.728 1.897 0 3.302-.44 4.861-1.51l.255-.177v.846c0 .293.248.533.549.533h3.995c.308 0 .553-.24.553-.533V14.042c0-2.35-.736-4.115-2.183-5.239zm-3.2 13.766l-.094.047c-1.052.581-2.013.863-2.936.863-1.49 0-2.355-.34-2.355-2.092v-.348c0-2.169.873-2.978 3.23-2.978h2.154v4.508zM73.376 7.224c-2.39 0-4.004.475-5.962 1.777l-.262.17V8.038c0-.299-.256-.54-.572-.54h-4.159c-.322 0-.582.241-.582.54v18.478c0 .294.301.575.616.575h4.49c.315 0 .584-.27.584-.575V12.74l.087-.041c1.369-.68 2.5-1.133 3.57-1.133 2.49 0 2.911 1.042 2.911 3.386v11.564c0 .305.272.575.578.575h4.49c.322 0 .621-.281.621-.575V14.952c0-5.416-1.92-7.728-6.41-7.728zM27.23 0h-4.298c-.305 0-.577.258-.577.55V26.5c0 .302.28.591.577.591h4.298c.31 0 .51-.307.51-.591V.55c0-.314-.222-.55-.51-.55zm72.031 6.859h-.401v1.38c0 .024-.02.046-.043.046h-.227a.046.046 0 0 1-.046-.046V6.86h-.4c-.024 0-.048-.015-.048-.04v-.182c0-.025.024-.042.048-.042h1.117c.024 0 .046.017.046.042v.182c0 .025-.022.04-.046.04zm1.7 1.426h-.228c-.02 0-.035-.022-.035-.046V7.182a.061.061 0 0 0-.006-.027l-.015.017-.219.437a.088.088 0 0 1-.074.042h-.232a.089.089 0 0 1-.072-.042l-.221-.437s-.009-.017-.014-.017c0 0-.004.01-.004.027V8.24c0 .024-.018.046-.036.046h-.23c-.022 0-.04-.013-.04-.034V6.683c0-.048.042-.088.093-.088h.184c.038 0 .069.022.087.052l.345.7c.01.02.015.03.022.03.011 0 .017-.01.026-.03l.345-.7c.018-.03.047-.052.085-.052h.19c.049 0 .088.04.088.088V8.25c0 .021-.017.034-.04.034zM7.266 14.342c.053 4.533 2.479 8.747 6.35 11.023a12.543 12.543 0 0 0 6.19 1.726 13.021 13.021 0 0 0-1.696-6.295c-2.242-3.935-6.387-6.399-10.844-6.454zm0-1.593c4.457-.057 8.602-2.52 10.844-6.46A13.007 13.007 0 0 0 19.807 0a12.533 12.533 0 0 0-6.19 1.727C9.745 4.003 7.319 8.214 7.267 12.75zM5.114 0H1.571C.707 0 0 .719 0 1.6V26.5c0 .28.243.59.631.59h3.545c.866 0 1.573-.713 1.573-1.604V.552C5.749.236 5.475 0 5.114 0z' />
    </Icon>
  )
}

KlarnaLogo.ratio = 101 / 28
KlarnaLogo.propTypes = {
  width: PropTypes.number
}

KlarnaLogo.defaultProps = {
  width: 63,
  color: 'blue'
}

export default icon(KlarnaLogo)