SVGS in react

logo.js

import React, { PropTypes } from 'react'

export default class Navbar extends React.Component {

  static propTypes = {
    scale: PropTypes.string,
  }

  static defaultProps = {
    scale: '1.0',
  }

  render() {
    const scale = `scale(${this.props.scale})`

    return (
      <svg
        width="179.47" height="23.45" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink"
      >
        <g fillRule="nonzero" fill="#FFFFFF" transform={scale}>
          <polygon points="0.278101473 0.0869067103 16.4462848 0.0869067103 16.4462848 4.33826514 5.33489362 4.33826514 5.33489362 9.65253682 14.9647463 9.65253682 14.9647463 13.5818985 5.33489362 13.5818985 5.33489362 23.0830115 0.278101473 23.0830115" />
          <path d="M25.0450409,5.98094926 C30.2945008,5.98094926 33.6764975,9.45898527 33.6764975,14.773257 C33.6764975,20.0554173 30.2947954,23.533748 25.0450409,23.533748 C19.8282815,23.533748 16.4462848,20.0554173 16.4462848,14.773257 C16.4462848,9.45898527 19.8282815,5.98094926 25.0450409,5.98094926 Z M25.0450409,20.0875286 C28.1692635,20.0875286 29.103437,17.4143372 29.103437,14.773257 C29.103437,12.1003601 28.1695581,9.42716858 25.0450409,9.42716858 C21.9529296,9.42716858 21.0190507,12.1006547 21.0190507,14.773257 C21.0190507,17.4143372 21.9532242,20.0875286 25.0450409,20.0875286 Z" />
          <path d="M35.1353519,6.43168576 L39.4833388,6.43168576 L39.4833388,9.52379705 L39.5481506,9.52379705 C40.385401,7.43037643 42.6399673,5.98124386 44.8621277,5.98124386 C45.1841244,5.98124386 45.5703437,6.04576105 45.8608183,6.14209493 L45.8608183,10.3934534 C45.4416039,10.2968249 44.7652046,10.2323077 44.2181342,10.2323077 C40.8691326,10.2323077 39.7090016,12.6480196 39.7090016,15.5786907 L39.7090016,23.0830115 L35.1353519,23.0830115 L35.1353519,6.43168576 L35.1353519,6.43168576 Z" />
          <path d="M47.338527,0.0869067103 L59.7379051,0.0869067103 C63.8605237,0.0869067103 66.469198,2.95364975 66.469198,6.43168576 C66.469198,9.13757774 65.3741735,11.1664812 62.8300164,12.1969885 L62.8300164,12.2615057 C65.3102455,12.9054992 66.0187561,15.3212111 66.1799018,17.6397054 C66.2762357,19.0891326 66.2447136,21.7944354 67.145892,23.0830115 L62.089689,23.0830115 C61.4772177,21.6335843 61.5420295,19.4114239 61.2842553,17.5757774 C60.9301473,15.1603601 59.9959738,14.0974468 57.4512275,14.0974468 L52.3950245,14.0974468 L52.3950245,23.0833061 L47.3388216,23.0833061 L47.3388216,0.0869067103 L47.338527,0.0869067103 Z M52.3950245,10.4897872 L57.9349591,10.4897872 C60.1892308,10.4897872 61.4132897,9.52350245 61.4132897,7.20441899 C61.4132897,4.98255319 60.1895254,4.01656301 57.9349591,4.01656301 L52.3950245,4.01656301 L52.3950245,10.4897872 Z" />
          <path d="M72.4634043,15.8682815 C72.5924386,18.7668412 74.0088707,20.0875286 76.553617,20.0875286 C78.3886743,20.0875286 79.870802,18.9600982 80.1606874,17.9295908 L84.1857938,17.9295908 C82.8983961,21.8589525 80.1606874,23.533748 76.3924714,23.533748 C71.1427169,23.533748 67.8897545,19.926383 67.8897545,14.773257 C67.8897545,9.7812766 71.3356792,5.98094926 76.3924714,5.98094926 C82.0605565,5.98094926 84.7985597,10.7475614 84.4756792,15.8682815 L72.4634043,15.8682815 L72.4634043,15.8682815 Z M79.9020295,12.9694272 C79.4836989,10.6506383 78.4855974,9.42716858 76.263437,9.42716858 C73.3645827,9.42716858 72.5273322,11.6817349 72.4634043,12.9697218 L79.9020295,12.9697218 L79.9020295,12.9694272 Z" />
          <path d="M85.7666121,6.43168576 L90.1143044,6.43168576 L90.1143044,8.75076923 L90.2109329,8.75076923 C91.3707692,6.88301146 93.3672668,5.98094926 95.2998363,5.98094926 C100.162782,5.98094926 101.386841,8.71836334 101.386841,12.840982 L101.386841,23.0830115 L96.8131915,23.0830115 L96.8131915,13.6782324 C96.8131915,10.9408183 96.0080524,9.58801964 93.8822259,9.58801964 C91.4028805,9.58801964 90.3405565,10.9729296 90.3405565,14.3543372 L90.3405565,23.0827169 L85.7666121,23.0827169 L85.7666121,6.43168576 Z" />
          <path d="M109.247332,6.43168576 L112.596923,6.43168576 L112.596923,9.49139116 L109.247332,9.49139116 L109.247332,17.7366285 C109.247332,19.2826841 109.633552,19.6686088 111.179607,19.6686088 C111.66275,19.6686088 112.113486,19.6367921 112.597218,19.5398691 L112.597218,23.1151227 C111.823895,23.2438625 110.825499,23.2762684 109.923732,23.2762684 C107.1218,23.2762684 104.675155,22.6319804 104.675155,19.3147954 L104.675155,9.49139116 L101.904746,9.49139116 L101.904746,6.43168576 L104.675155,6.43168576 L104.675155,1.4397054 L109.247627,1.4397054 L109.247627,6.43168576 L109.247332,6.43168576 Z" />
          <path d="M143.071424,6.36981997 C147.869264,6.36981997 150.570442,10.2785597 150.570442,14.9167267 C150.570442,19.556072 147.869264,23.4642226 143.071424,23.4642226 C138.273879,23.4642226 135.5727,19.556072 135.5727,14.9167267 C135.5727,10.2782651 138.273879,6.36981997 143.071424,6.36981997 Z M143.071424,22.4154501 C147.17018,22.4154501 149.362291,18.8248773 149.362291,14.9164321 C149.362291,11.0082815 147.17018,7.41770867 143.071424,7.41770867 C138.972373,7.41770867 136.780262,11.0082815 136.780262,14.9164321 C136.780262,18.8248773 138.972373,22.4154501 143.071424,22.4154501 Z" />
          <path d="M152.896301,6.7510311 L154.104157,6.7510311 L154.104157,10.0876596 L154.167201,10.0876596 C154.675385,8.02222586 156.836858,6.36981997 159.283208,6.36981997 C162.396825,6.36981997 163.858331,8.14949264 164.20802,9.83312602 L164.272537,9.83312602 C165.224975,7.60890344 166.813748,6.36981997 169.450704,6.36981997 C172.405827,6.36981997 174.566121,8.08585925 174.566121,11.9303764 L174.566121,23.0830115 L173.358854,23.0830115 L173.358854,11.8982651 C173.358854,7.73617021 170.403732,7.41800327 169.450409,7.41800327 C166.495286,7.41800327 164.334697,9.51525368 164.334697,13.4236989 L164.334697,23.0827169 L163.126841,23.0827169 L163.126841,11.8982651 C163.126841,7.799509 160.331097,7.41800327 159.282913,7.41800327 C156.962651,7.41800327 154.103863,9.22949264 154.103863,13.4236989 L154.103863,23.0827169 L152.896007,23.0827169 L152.896007,6.7510311 L152.896301,6.7510311 Z" />
          <path d="M179.744877,6.5109329 C179.744877,7.78536825 178.717021,8.81381342 177.442291,8.81381342 C176.167267,8.81381342 175.139411,7.78536825 175.139411,6.5109329 C175.139411,5.23590835 176.167267,4.20775777 177.442291,4.20775777 C178.717021,4.20746318 179.744877,5.23590835 179.744877,6.5109329 Z M175.372733,6.5109329 C175.372733,7.67430442 176.272439,8.6105401 177.448478,8.6105401 C178.624517,8.6105401 179.51126,7.66811784 179.51126,6.50445172 C179.51126,5.32841244 178.630704,4.4110311 177.448478,4.4110311 C176.259476,4.4110311 175.372733,5.32193126 175.372733,6.5109329 Z M176.604452,5.14988543 L177.627005,5.14988543 C178.243011,5.14988543 178.513748,5.40854337 178.513748,5.90081833 C178.513748,6.34418985 178.199705,6.55983633 177.812308,6.62140753 L178.624812,7.87139116 L178.365859,7.87139116 L177.546579,6.61522095 L176.838658,6.61522095 L176.838658,7.87139116 L176.604746,7.87139116 L176.604746,5.14988543 L176.604452,5.14988543 Z M176.838363,6.41224223 L177.417545,6.41224223 C177.830278,6.41224223 178.279542,6.36923077 178.279542,5.89492635 C178.279542,5.47600655 177.916596,5.35315876 177.590475,5.35315876 L176.838363,5.35315876 L176.838363,6.41224223 Z" />
          <circle id="Oval" cx="116.875385" cy="21.0632406" r="1.88631751" />
          <path d="M132.489427,19.3374795 C131.553486,21.2146645 129.72108,22.4157447 127.413486,22.4157447 C123.187758,22.4157447 121.123208,19.1748609 121.123208,14.7582324 C121.123208,11.0406874 123.31473,7.41800327 127.413486,7.41800327 C130.002717,7.41800327 132.127365,8.56458265 132.764288,10.7929296 L133.974501,10.7929296 C133.238003,7.77770867 130.601637,6.36981997 127.413486,6.36981997 C122.584714,6.36981997 119.915057,10.2146318 119.915057,14.7582324 C119.915057,19.3015385 122.107758,23.4642226 127.413486,23.4642226 C130.283764,23.4642226 132.690344,21.9915221 133.778592,19.3374795 L132.489427,19.3374795 Z" />
        </g>
      </svg>
    )
  }
}