Add detailed roadmap

pull/1657/head
Kamran Ahmed 5 years ago
parent 2468a97856
commit 19910ac318
  1. 17
      components/detailed-roadmap/index.js
  2. 9
      components/detailed-roadmap/style.js
  3. 4
      pages/[roadmap]/index.js

@ -1,15 +1,6 @@
import { Sidebar, Summary, SummaryContainer, UpcomingContainer } from './style'; import { Sidebar, Summary, SummaryContainer } from './style';
import GuideBody from 'components/guide-body';
const RoadmapBody = ({ roadmap }) => {
if (roadmap.upcoming) {
return (
<UpcomingContainer>
<GuideBody guide={{ fileName: 'upcoming' }} />
</UpcomingContainer>
);
}
const DetailedRoadmap = ({ roadmap }) => {
const RoadmapPages = Object.keys(roadmap.sidebar || {}).map(groupTitle => { const RoadmapPages = Object.keys(roadmap.sidebar || {}).map(groupTitle => {
return ( return (
<div className='links-group'> <div className='links-group'>
@ -31,7 +22,7 @@ const RoadmapBody = ({ roadmap }) => {
}); });
return ( return (
<SummaryContainer> <SummaryContainer className="border-top">
<Summary className="container text-left"> <Summary className="container text-left">
<Sidebar className="sidebar"> <Sidebar className="sidebar">
{ RoadmapPages } { RoadmapPages }
@ -44,4 +35,4 @@ const RoadmapBody = ({ roadmap }) => {
) )
}; };
export default RoadmapBody; export default DetailedRoadmap;

@ -2,15 +2,6 @@ import styled from 'styled-components';
export const SummaryContainer = styled.div``; export const SummaryContainer = styled.div``;
export const UpcomingContainer = styled.div`
text-align: center;
padding: 40px 0 50px;
.container {
position: relative;
}
`;
export const Summary = styled.div` export const Summary = styled.div`
text-align: center; text-align: center;
min-height: 400px; min-height: 400px;

@ -6,7 +6,7 @@ import { serverOnlyProps } from 'lib/server';
import { getRequestedRoadmap } from 'lib/roadmap'; import { getRequestedRoadmap } from 'lib/roadmap';
import Helmet from 'components/helmet'; import Helmet from 'components/helmet';
import RoadmapSummary from 'components/roadmap-summary'; import RoadmapSummary from 'components/roadmap-summary';
import RoadmapBody from '../../components/roadmap-body'; import DetailedRoadmap from '../../components/detailed-roadmap';
const Roadmap = ({ roadmap }) => { const Roadmap = ({ roadmap }) => {
if (!roadmap) { if (!roadmap) {
@ -18,7 +18,7 @@ const Roadmap = ({ roadmap }) => {
<DefaultLayout> <DefaultLayout>
<Helmet title={ roadmap.title } description={ roadmap.description } /> <Helmet title={ roadmap.title } description={ roadmap.description } />
<SiteNav /> <SiteNav />
{ showSummary ? <RoadmapSummary roadmap={roadmap} /> : <RoadmapBody roadmap={roadmap} /> } { showSummary ? <RoadmapSummary roadmap={roadmap} /> : <DetailedRoadmap roadmap={roadmap} /> }
<PageFooter /> <PageFooter />
</DefaultLayout> </DefaultLayout>
); );

Loading…
Cancel
Save