geoffsee/open-gsio
1
0
Fork 0
mirror of https://github.com/geoffsee/open-gsio.git synced 2025-09-08 22:56:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactored layout components and styling: removed unused imports, adjusted positioning and padding for consistency.

Browse Source
This commit is contained in:
geoffsee
2025-07-16 21:21:16 -04:00
committed by Geoff Seemueller
parent a7ad06093a
commit 0183503425
5 changed files with 26 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/client/src/components/landing-component/LandingComponent.tsx
View File

@@ -27,7 +27,7 @@ export const LandingComponent: React.FC = () => {
}, []); }, []);
return ( 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}> <Box position="fixed" right={0} maxWidth="300px" minWidth="200px" zIndex={1000}>
<Tweakbox <Tweakbox
sliders={{ sliders={{

2
packages/client/src/components/landing-component/Map.tsx
View File

@@ -37,7 +37,7 @@ const key =
function Map(props: { visible: boolean }) { function Map(props: { visible: boolean }) {
return ( return (
/* Full-screen wrapper — fills the viewport and becomes the positioning context */ /* 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 */} {/* Button bar — absolutely positioned inside the wrapper */}
<MapNext mapboxPublicKey={atob(key)} /> <MapNext mapboxPublicKey={atob(key)} />

5
packages/client/src/components/landing-component/MapNext.tsx
View File

@@ -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 { useCallback, useEffect, useMemo, useState } from 'react';
import Map, { import Map, {
FullscreenControl, FullscreenControl,
@@ -118,11 +118,10 @@ Type '{ city: string; population: string; image: string; state: string; latitude
right: 0, right: 0,
}} }}
> >
<GeolocateControl position="top-left" /> <GeolocateControl position="top-left" style={{ marginTop: '6rem' }} />
<FullscreenControl position="top-left" /> <FullscreenControl position="top-left" />
<NavigationControl position="top-left" /> <NavigationControl position="top-left" />
<ScaleControl position="top-left" /> <ScaleControl position="top-left" />
{pins} {pins}
{popupInfo && ( {popupInfo && (

2
packages/client/src/layout/Content.tsx
View File

@@ -6,7 +6,7 @@ import { useIsMobile } from '../components/contexts/MobileContext';
function Content({ children }) { function Content({ children }) {
const isMobile = useIsMobile(); const isMobile = useIsMobile();
return ( return (
<Flex flexDirection="column" w="100%" h="100vh" p={!isMobile ? 4 : 1}> <Flex flexDirection="column" w="100%" h="100vh">
{children} {children}
</Flex> </Flex>
); );

10
packages/client/src/pages/index/+Page.tsx
View File

@@ -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 React, { useEffect } from 'react';
import Chat from '../../components/chat/Chat.tsx'; import Chat from '../../components/chat/Chat.tsx';
@@ -22,8 +22,7 @@ export default function IndexPage() {
const component = useComponent(); const component = useComponent();
return ( return (
<Grid templateColumns="1" height="100%" width="100%" gap={0}> <Box height="100%" width="100%">
<GridItem>
<LandingComponent /> <LandingComponent />
<Box <Box
@@ -31,6 +30,7 @@ export default function IndexPage() {
width="100%" width="100%"
height="100%" height="100%"
overflowY="scroll" overflowY="scroll"
padding={'unset'}
> >
<Chat /> <Chat />
</Box> </Box>
@@ -38,10 +38,10 @@ export default function IndexPage() {
display={component.enabledComponent === 'gpsmap' ? undefined : 'none'} display={component.enabledComponent === 'gpsmap' ? undefined : 'none'}
width="100%" width="100%"
height="100%" height="100%"
padding={'unset'}
> >
<ReactMap visible={component.enabledComponent === 'gpsmap'} /> <ReactMap visible={component.enabledComponent === 'gpsmap'} />
</Box> </Box>
</GridItem> </Box>
</Grid>
); );
} }