gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix(footer): show only on non-learn pages

Browse Source
This commit is contained in:
Mrugesh Mohapatra 2019-02-17 16:26:10 +05:30 committed by Stuart Taylor
parent b94c87494c
commit 71cf52144e
4 changed files with 37 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
client/gatsby-browser.js
View File

@ -6,7 +6,7 @@ import { createStore } from './src/redux/createStore';
import AppMountNotifier from './src/components/AppMountNotifier';
import GuideNavContextProvider from './src/contexts/GuideNavigationContext';
import DefaultLayout from './src/components/layouts/Default';
import GuideLayout from './src/components/layouts/GuideLayout';
import GuideLayout from './src/components/layouts/Guide';
const store = createStore();
@ -30,18 +30,29 @@ export const wrapPageElement = ({ element, props }) => {
} = props;
if (pathname === '/') {
return (
<DefaultLayout disableSettings={true} landingPage={true}>
<DefaultLayout
disableSettings={true}
landingPage={true}
nonLearnPage={true}
>
{element}
</DefaultLayout>
);
}
if ((/^\/guide(\/.*)*/).test(pathname)) {
return (
<DefaultLayout>
<DefaultLayout nonLearnPage={true}>
<GuideLayout>{element}</GuideLayout>
</DefaultLayout>
);
}
if (false === (/^\/learn(\/.*)*/).test(pathname)) {
return (
<DefaultLayout nonLearnPage={true}>
{element}
</DefaultLayout>
);
}
return <DefaultLayout>{element}</DefaultLayout>;
};

17
client/gatsby-ssr.js
View File

@ -8,7 +8,7 @@ import { createStore } from './src/redux/createStore';
import GuideNavContextProvider from './src/contexts/GuideNavigationContext';
import DefaultLayout from './src/components/layouts/Default';
import GuideLayout from './src/components/layouts/GuideLayout';
import GuideLayout from './src/components/layouts/Guide';
const store = createStore();
@ -30,18 +30,29 @@ export const wrapPageElement = ({ element, props }) => {
} = props;
if (pathname === '/') {
return (
<DefaultLayout disableSettings={true} landingPage={true}>
<DefaultLayout
disableSettings={true}
landingPage={true}
nonLearnPage={true}
>
{element}
</DefaultLayout>
);
}
if ((/^\/guide(\/.*)*/).test(pathname)) {
return (
<DefaultLayout>
<DefaultLayout nonLearnPage={true}>
<GuideLayout>{element}</GuideLayout>
</DefaultLayout>
);
}
if (false === (/^\/learn(\/.*)*/).test(pathname)) {
return (
<DefaultLayout nonLearnPage={true}>
{element}
</DefaultLayout>
);
}
return <DefaultLayout>{element}</DefaultLayout>;
};

7
client/src/components/layouts/Default.js
View File

@ -21,7 +21,6 @@ import OfflineWarning from '../OfflineWarning';
import Flash from '../Flash';
import Header from '../Header';
import Footer from '../Footer';
import Spacer from '../helpers/Spacer';
import './global.css';
import './layout.css';
@ -70,6 +69,7 @@ const propTypes = {
isOnline: PropTypes.bool.isRequired,
isSignedIn: PropTypes.bool,
landingPage: PropTypes.bool,
nonLearnPage: PropTypes.bool,
onlineStatusChange: PropTypes.func.isRequired,
removeFlashMessage: PropTypes.func.isRequired
};
@ -139,6 +139,7 @@ class DefaultLayout extends Component {
flashMessages = [],
removeFlashMessage,
landingPage,
nonLearnPage,
isOnline,
isSignedIn
} = this.props;
@ -165,9 +166,7 @@ class DefaultLayout extends Component {
) : null}
{children}
</div>
<hr/>
<Spacer size={3}/>
<Footer />
{nonLearnPage ? (<Footer />) : null}
</Fragment>
);
}

11
client/src/components/layouts/GuideLayout.js → client/src/components/layouts/Guide.js
View File

@ -9,6 +9,7 @@ import Spacer from '../helpers/Spacer';
import 'prismjs/themes/prism.css';
import './guide.css';
import Footer from '../Footer';
const propTypes = {
children: PropTypes.any,
@ -29,7 +30,7 @@ const propTypes = {
location: PropTypes.object
};
class Layout extends React.Component {
class GuideLayout extends React.Component {
getContentRef = ref => (this.contentRef = ref);
handleNavigation = () => {
@ -41,7 +42,7 @@ class Layout extends React.Component {
return (
<StaticQuery
query={graphql`
query LayoutQuery {
query GuideLayoutQuery {
allNavigationNode {
edges {
node {
@ -110,7 +111,7 @@ class Layout extends React.Component {
}
}
Layout.displayName = 'Layout';
Layout.propTypes = propTypes;
GuideLayout.displayName = 'GuideLayout';
GuideLayout.propTypes = propTypes;
export default Layout;
export default GuideLayout;