Minimal refactor to make maps wider (#149)

Not particularly pretty, but it works.

client/src/components/layout.tsx

@@ -11,6 +11,11 @@ interface ILayoutProps {
 }
 
 const Layout = ({children, location}: ILayoutProps) => {
+  const isWidthFullPage = location.pathname.endsWith('/cejst');
+  const conditionalAside = isWidthFullPage ? <></> : <J40Aside/>;
+  const gridCssClass = isWidthFullPage ? ' desktop:grid-col-12' :
+    'desktop:grid-col-9';
+
   return (
     <URLFlagProvider location={location}>
       <J40Header/>
@@ -18,12 +23,10 @@ const Layout = ({children, location}: ILayoutProps) => {
         className={'j40-grid-container'}>
         <Grid row>
           <main id={'main-content'}
-            className={'usa-layout-docs desktop:grid-col-9 j40-main-content'}>
+            className={'usa-layout-docs j40-main-content ' + gridCssClass}>
-            <section className={'usa-prose'}>
             {children}
-            </section>
           </main>
-          <J40Aside/>
+          {conditionalAside}
         </Grid>
       </GridContainer>
       <J40Footer/>

client/src/components/map.module.scss

@@ -1,4 +1,5 @@
 .mapContainer {
   height: 676px;
   margin-bottom: 29px;
+  max-width: revert;
 }

client/src/pages/index.tsx

@@ -36,6 +36,7 @@ const IndexPage = ({location}: IndexPageProps) => {
   ];
 
   return (<Layout location={location}>
+    <section className={'usa-prose'}>
       <h1>About Justice40</h1>
       <p>
           In an effort to address historical environmental injustices,
@@ -137,7 +138,7 @@ const IndexPage = ({location}: IndexPageProps) => {
       being built and the processes for stakeholder and public
       engagement.
       </p>
-
+    </section>
   </Layout>
   );
 };

client/src/pages/timeline.tsx

@@ -10,6 +10,7 @@ interface TimelinePageProps {
 
 const TimelinePage = ({location}: TimelinePageProps) => {
   return (<Layout location={location}>
+    <section className={'usa-prose'}>
       <h1>Timeline</h1>
       <h2>Throughout the Process</h2>
       <div className="grid-col">
@@ -55,6 +56,7 @@ const TimelinePage = ({location}: TimelinePageProps) => {
               investments by February 2022.</p>
         </li>
       </ol>
+    </section>
   </Layout>
   );
 };