title: Gatsby Current Link Color
body: <p>I'm new to Gatsby, js and react but I'm trying to create a website to the best of my ability.  So far I've been able to figure most things out with a mixture of gatsby and css tutorials.  However, I'm stuck on one small change I'd like to make. I have a header on my website with navigation links that I added in with a ListLink</p>
  
  <pre><code>const ListLink = props =&gt;
  &lt;li style={{ display: `inline-block`, marginRight: `1rem` }}&gt;
      &lt;Link to={props.to} style={{ fontSize: '17px', textTransform: 'uppercase', fontFamily: 'Roboto-Thin', textShadow: `none`, margin: "0", color: '#4a71b6', backgroundImage: `none`}}&gt;
          {props.children}
      &lt;/Link&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p>I'd like to have the current link a different color, so if you're on the "Product" page, the link for "Product" is orange instead of blue.  I'm not sure how to implement this using the ListLink</p>