content: import React from 'react'
  // import { config } from 'config'
  import { rhythm } from '../../utils/typography'
  
  const OpenSource = ({ projects }) => {
    return (
      <div>
        <h2 style={{ marginTop: 0 }}>Open source </h2>
        <ul style={{ listStyle: 'none', margin: 0 }}>
          {projects.map((project, i) => {
            return (
              i < 4 && (
                <li key={project.url}>
                  <a href={project.url} target="_blank">
                    {project.name}
                  </a>{' '}
                  : {project.desc}
                </li>
              )
            )
          })}
        </ul>
        <p>
          Find more of them on{' '}
          <a href="https://github.com/YannickDot" target="_blank">
            Github
          </a>{' '}
          and{' '}
          <a href="https://www.npmjs.com/~yannickdot" target="_blank">
            NPM
          </a>.
        </p>
      </div>
    )
  }
  
  export default OpenSource
  