move map controls when sidebar opens

CodeforLeipzig · Aug 23, 2024 · 26d37a2 · 26d37a2
1 parent 4f26ffe
commit 26d37a2
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 8 deletions.
diff --git a/src/components/App/index.tsx b/src/components/App/index.tsx
@@ -37,8 +37,6 @@ const ImprintAndPrivacyContainer = styled.div`
 
 const App: FC = () => {
   const overlay = useStoreState('overlay');
-  const isNavOpen = useStoreState('isNavOpen');
-
   const { data: communityData } = useCommunityData();
   const { data: rainGeoJson } = useRainGeoJson();
   const { data: pumpsGeoJson } = usePumpsGeoJson();
@@ -55,13 +53,12 @@ const App: FC = () => {
   );
   const showLoading = !showMap;
   const showMapUI = showMap && !showOverlay;
-  const isSidebarOpened = !isHome && isNavOpen;
 
   return (
     <AppContainer>
       {showLoading && <Loading />}
       {showMap && (
-        <Map isNavOpened={isSidebarOpened} showOverlay={showOverlay} />
+        <Map isNavOpened={!isHome} showOverlay={showOverlay} />
       )}
       {showMapUI && <Sidebar />}
       {showOverlay && <Overlay />}

diff --git a/src/components/Overlay/OverlayTop/index.tsx b/src/components/Overlay/OverlayTop/index.tsx
@@ -62,13 +62,13 @@ const OverlayTop: FC = () => {
         <img style={{ height: 160 }} src='images/leipzig-giesst-logo.png' />
         {!isMobile && (<div style={{ width: '60%', fontSize: '16pt', fontStyle: 'bold', color: 'blue' }}>
           Wo stehst Du im Gießranking? Erfahre das und mehr aus <a target="_blank" href="https://stiftung-ecken-wecken.de/projekte/leipzig-giesst/blog/das-sind-die-top-giesserinnen-eine-zwischenauswertung-der-giesssaison">unserem Blog.</a><br /><br />
-          <b>Kommender Termin:</b> <del>Samstag, den 24. August, ab 16:30</del> - <span style={{ color: 'red', fontStyle: 'bold' }}>ACHTUNG: wegen Hitze vorschoben auf Mitte/Ende September:</span> Pumpen, Gießen und Singen als Teil unserer <a style={{ cursor: 'pointer', textDecoration: 'underline' }} onClick={() => { history.push("/event/20240928_radeln_pumpen_giessen_singen")}}>Handschwengelpumpenradtour</a>.
+          <b>Kommender Termin:</b> <del>Samstag, den 24. August, ab 16:30</del> - <span style={{ color: 'red', fontStyle: 'bold' }}>ACHTUNG: wegen Hitze verschoben auf Mitte/Ende September:</span> Pumpen, Gießen und Singen als Teil unserer <a style={{ cursor: 'pointer', textDecoration: 'underline' }} onClick={() => { history.push("/event/20240928_radeln_pumpen_giessen_singen")}}>Handschwengelpumpenradtour</a>.
         </div>)}
       </Wrapper>
       <OverlayTitle size='small' title={""} />
       {isMobile && (<div style={{ paddingLeft: '40px', paddingBottom: '20px', width: '60%', fontSize: '16pt', fontStyle: 'bold', color: 'blue' }}>
         Wo stehst Du im Gießranking? Erfahre das und mehr aus <a target="_blank" href="https://stiftung-ecken-wecken.de/projekte/leipzig-giesst/blog/das-sind-die-top-giesserinnen-eine-zwischenauswertung-der-giesssaison">unserem Blog.</a><br /><br />
-        <b>Kommender Termin:</b> <del>Samstag, den 24. August, ab 16:30</del> - <span style={{ color: 'red', fontStyle: 'bold' }}>ACHTUNG: wegen Hitze vorschoben auf Mitte/Ende September:</span> Pumpen, Gießen und Singen als Teil unserer <a style={{ cursor: 'pointer', textDecoration: 'underline' }} onClick={() => { history.push("/event/20240928_radeln_pumpen_giessen_singen")}}>Handschwengelpumpenradtour</a>.
+        <b>Kommender Termin:</b> <del>Samstag, den 24. August, ab 16:30</del> - <span style={{ color: 'red', fontStyle: 'bold' }}>ACHTUNG: wegen Hitze verschoben auf Mitte/Ende September:</span> Pumpen, Gießen und Singen als Teil unserer <a style={{ cursor: 'pointer', textDecoration: 'underline' }} onClick={() => { history.push("/event/20240928_radeln_pumpen_giessen_singen")}}>Handschwengelpumpenradtour</a>.
         </div>)}
       <OverlayTitle size='xxl' title={subline} />
       {isMobile && <OverlayTitle size='medium' title={disclaimer} />}

diff --git a/src/components/TreesMap/DeckGLMap.tsx b/src/components/TreesMap/DeckGLMap.tsx
@@ -26,7 +26,7 @@ interface StyledProps {
 const ControlWrapper = styled.div<StyledProps>`
   position: absolute;
   bottom: 12px;
-  left: 12px;
+  left: 22px;
   z-index: 2;
   transition: transform 500ms;
 
@@ -69,7 +69,7 @@ interface DeckGLPropType {
   communityData: CommunityDataType['communityFlagsMap'];
   communityDataWatered: CommunityDataType['wateredTreesIds'];
   communityDataAdopted: CommunityDataType['adoptedTreesIds'];
-
+  
   showControls: boolean | undefined;
   onTreeSelect: (id: string) => void;
   onWaterSourceSelect: (id: string) => void;