Conditional Header

gatsby-browser.js

import React, { Fragment } from 'react';

export const wrapPageElement = ({ element, props }) => {
  const {
    location: { pathname },
  } = props

  return (
    <Fragment>
      <header className={`${pathname === '/' ? 'some-class' : 'some-other-class'} `}>
        <nav>...</nav>
      </header>
      <main>{element}</main>
    </Fragment>
  )
}