From 0183503425cec82eb94c45c800d9b67a6ff639d6 Mon Sep 17 00:00:00 2001
From: geoffsee <>
Date: Wed, 16 Jul 2025 21:21:16 -0400
Subject: [PATCH] Refactored layout components and styling: removed unused
 imports, adjusted positioning and padding for consistency.

---
 .../landing-component/LandingComponent.tsx    |  2 +-
 .../src/components/landing-component/Map.tsx  |  2 +-
 .../components/landing-component/MapNext.tsx  |  5 +--
 packages/client/src/layout/Content.tsx        |  2 +-
 packages/client/src/pages/index/+Page.tsx     | 42 +++++++++----------
 5 files changed, 26 insertions(+), 27 deletions(-)

diff --git a/packages/client/src/components/landing-component/LandingComponent.tsx b/packages/client/src/components/landing-component/LandingComponent.tsx
index aa54407..d2320ee 100644
--- a/packages/client/src/components/landing-component/LandingComponent.tsx
+++ b/packages/client/src/components/landing-component/LandingComponent.tsx
@@ -27,7 +27,7 @@ export const LandingComponent: React.FC = () => {
   }, []);
 
   return (
-    <Box as="section" bg="background.primary" overflow="hidden" position="relative">
+    <Box as="section" bg="background.primary" overflow="hidden">
       <Box position="fixed" right={0} maxWidth="300px" minWidth="200px" zIndex={1000}>
         <Tweakbox
           sliders={{
diff --git a/packages/client/src/components/landing-component/Map.tsx b/packages/client/src/components/landing-component/Map.tsx
index 6e6fc39..b917532 100644
--- a/packages/client/src/components/landing-component/Map.tsx
+++ b/packages/client/src/components/landing-component/Map.tsx
@@ -37,7 +37,7 @@ const key =
 function Map(props: { visible: boolean }) {
   return (
     /* Full-screen wrapper — fills the viewport and becomes the positioning context */
-    <Box w="100%" h="100vh" position="relative" overflow="hidden">
+    <Box position={'absolute'} top={0} w="100vw" h={'100vh'} overflow="hidden">
       {/* Button bar — absolutely positioned inside the wrapper */}
 
       <MapNext mapboxPublicKey={atob(key)} />
diff --git a/packages/client/src/components/landing-component/MapNext.tsx b/packages/client/src/components/landing-component/MapNext.tsx
index 9d51f96..154109b 100644
--- a/packages/client/src/components/landing-component/MapNext.tsx
+++ b/packages/client/src/components/landing-component/MapNext.tsx
@@ -1,4 +1,4 @@
-import { Box, Button, HStack, Input } from '@chakra-ui/react';
+import { Box } from '@chakra-ui/react';
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import Map, {
   FullscreenControl,
@@ -118,11 +118,10 @@ Type '{ city: string; population: string; image: string; state: string; latitude
           right: 0,
         }}
       >
-        <GeolocateControl position="top-left" />
+        <GeolocateControl position="top-left" style={{ marginTop: '6rem' }} />
         <FullscreenControl position="top-left" />
         <NavigationControl position="top-left" />
         <ScaleControl position="top-left" />
-
         {pins}
 
         {popupInfo && (
diff --git a/packages/client/src/layout/Content.tsx b/packages/client/src/layout/Content.tsx
index a322223..3005b16 100644
--- a/packages/client/src/layout/Content.tsx
+++ b/packages/client/src/layout/Content.tsx
@@ -6,7 +6,7 @@ import { useIsMobile } from '../components/contexts/MobileContext';
 function Content({ children }) {
   const isMobile = useIsMobile();
   return (
-    <Flex flexDirection="column" w="100%" h="100vh" p={!isMobile ? 4 : 1}>
+    <Flex flexDirection="column" w="100%" h="100vh">
       {children}
     </Flex>
   );
diff --git a/packages/client/src/pages/index/+Page.tsx b/packages/client/src/pages/index/+Page.tsx
index 1bf60ef..d5fc162 100644
--- a/packages/client/src/pages/index/+Page.tsx
+++ b/packages/client/src/pages/index/+Page.tsx
@@ -1,4 +1,4 @@
-import { Box, Grid, GridItem, Stack } from '@chakra-ui/react';
+import { Box } from '@chakra-ui/react';
 import React, { useEffect } from 'react';
 
 import Chat from '../../components/chat/Chat.tsx';
@@ -22,26 +22,26 @@ export default function IndexPage() {
   const component = useComponent();
 
   return (
-    <Grid templateColumns="1" height="100%" width="100%" gap={0}>
-      <GridItem>
-        <LandingComponent />
+    <Box height="100%" width="100%">
+      <LandingComponent />
 
-        <Box
-          display={component.enabledComponent === 'ai' ? undefined : 'none'}
-          width="100%"
-          height="100%"
-          overflowY="scroll"
-        >
-          <Chat />
-        </Box>
-        <Box
-          display={component.enabledComponent === 'gpsmap' ? undefined : 'none'}
-          width="100%"
-          height="100%"
-        >
-          <ReactMap visible={component.enabledComponent === 'gpsmap'} />
-        </Box>
-      </GridItem>
-    </Grid>
+      <Box
+        display={component.enabledComponent === 'ai' ? undefined : 'none'}
+        width="100%"
+        height="100%"
+        overflowY="scroll"
+        padding={'unset'}
+      >
+        <Chat />
+      </Box>
+      <Box
+        display={component.enabledComponent === 'gpsmap' ? undefined : 'none'}
+        width="100%"
+        height="100%"
+        padding={'unset'}
+      >
+        <ReactMap visible={component.enabledComponent === 'gpsmap'} />
+      </Box>
+    </Box>
   );
 }