feat: Add menu button to mobile header

src/components/HamburgerMenu.module.scss

@@ -1,8 +1,10 @@
 button.hamburgerMenu {
+  display: block;
   background: none;
   border: 0;
   cursor: pointer;
   width: 4rem;
+  outline: none;
 
   div {
     width: 100%;

src/components/Layout.module.scss

@@ -22,7 +22,7 @@
 }
 
 .hideOnDesktop {
-  @media (min-width: 760px) {
+  @media (min-width: 760px + 1) {
     display: none;
   }
 }

src/components/MobileHeader.js

@@ -1,16 +1,28 @@
-import React from 'react';
+import React, { useState } from 'react';
 import PropTypes from 'prop-types';
 import { Link } from 'gatsby';
 import cx from 'classnames';
 import Navigation from './Navigation';
+import HamburgerMenu from './HamburgerMenu';
 import styles from './MobileHeader.module.scss';
 
-const MobileHeader = ({ className }) => (
-  <aside className={cx(styles.container, className)}>
-    <Link to="/" className={styles.logo} />
-    {/* <Navigation /> */}
-  </aside>
-);
+const MobileHeader = ({ className }) => {
+  const [isOpen, setIsOpen] = useState(false);
+
+  return (
+    <aside className={cx(styles.container, className)}>
+      <Link to="/" className={styles.logo} />
+
+      <HamburgerMenu
+        className={styles.hamburgerMenu}
+        toggle={() => setIsOpen(!isOpen)}
+        isOpen={isOpen}
+      />
+
+      {/* <Navigation /> */}
+    </aside>
+  );
+};
 
 MobileHeader.propTypes = {
   className: PropTypes.string,