fix(client): make top navigation menu replaceable (#35943)

* fix(client): Stop using react-responsive and use media queries to display menu

* Change guide to show menu

* DRYed out a bit

* Restore main, top-right nav to guide

* fix: Separate guide and top menu state

* Update client/src/components/Header/index.js

Co-Authored-By: Valeriy <ValeraS@users.noreply.github.com>

* Update client/src/components/Header/index.js

Co-Authored-By: Valeriy <ValeraS@users.noreply.github.com>

* Update client/src/components/Header/index.js

Co-Authored-By: Valeriy <ValeraS@users.noreply.github.com>

* Update client/src/components/Header/index.js

Co-Authored-By: Valeriy <ValeraS@users.noreply.github.com>

* fix: Refactor menu button and links

* feat(client): make top navigation menu replaceable

* fix: Refactor nav menu logic out of Header

* fix(client): use default nav menu in header and use landingPage props instead of disableSettings
This commit is contained in:
Oliver Eyton-Williams
2019-05-26 18:36:23 +01:00
committed by Valeriy
parent 02427ad982
commit 17e112d25e
12 changed files with 310 additions and 265 deletions

View File

@ -5,12 +5,9 @@ import { Provider } from 'react-redux';
import headComponents from './src/head';
import { createStore } from './src/redux/createStore';
import { wrapPageElement } from './gatsby-browser';
import {
CertificationLayout,
DefaultLayout,
GuideLayout
} from './src/components/layouts';
export { wrapPageElement };
const store = createStore();
@ -22,39 +19,6 @@ wrapRootElement.propTypes = {
element: PropTypes.any
};
export const wrapPageElement = ({ element, props }) => {
const {
location: { pathname }
} = props;
if (pathname === '/') {
return (
<DefaultLayout disableSettings={true} landingPage={true}>
{element}
</DefaultLayout>
);
}
if (/^\/certification(\/.*)*/.test(pathname)) {
return <CertificationLayout>{element}</CertificationLayout>;
}
if (/^\/guide(\/.*)*/.test(pathname)) {
return (
<DefaultLayout onGuide={true}>
<GuideLayout>{element}</GuideLayout>
</DefaultLayout>
);
}
if (/^\/learn(\/.*)*/.test(pathname)) {
return <DefaultLayout showFooter={false}>{element}</DefaultLayout>;
}
return <DefaultLayout>{element}</DefaultLayout>;
};
wrapPageElement.propTypes = {
element: PropTypes.any,
location: PropTypes.objectOf({ pathname: PropTypes.string }),
props: PropTypes.any
};
export const onRenderBody = ({ setHeadComponents, setPostBodyComponents }) => {
setHeadComponents([...headComponents]);
setPostBodyComponents(