Robosats/robosats
1
0
Fork 0
mirror of https://github.com/RoboSats/robosats.git synced 2025-08-05 16:20:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: Adjust component heights to prevent nav bar overlap

Browse Source
This commit is contained in:
sahil-tgs
2024-07-17 02:24:34 +05:30
committed by Reckless_Satoshi
parent 6fc5f906dc
commit 13a681b9b3
2 changed files with 10 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
frontend/src/basic/BookPage/index.tsx
View File

@ -3,17 +3,16 @@ import { useTranslation } from 'react-i18next';
import { Button, Grid, ButtonGroup, Dialog, Box } from '@mui/material'; import { Button, Grid, ButtonGroup, Dialog, Box } from '@mui/material';
import { useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import DepthChart from '../../components/Charts/DepthChart'; import DepthChart from '../../components/Charts/DepthChart';
import { NoRobotDialog } from '../../components/Dialogs'; import { NoRobotDialog } from '../../components/Dialogs';
import MakerForm from '../../components/MakerForm'; import MakerForm from '../../components/MakerForm';
import BookTable from '../../components/BookTable'; import BookTable from '../../components/BookTable';
// Icons // Icons
import { BarChart, FormatListBulleted, Map } from '@mui/icons-material'; import { BarChart, FormatListBulleted, Map } from '@mui/icons-material';
import { AppContext, type UseAppStoreType } from '../../contexts/AppContext'; import { AppContext, UseAppStoreType } from '../../contexts/AppContext';
import MapChart from '../../components/Charts/MapChart'; import MapChart from '../../components/Charts/MapChart';
import { FederationContext, type UseFederationStoreType } from '../../contexts/FederationContext'; import { FederationContext, UseFederationStoreType } from '../../contexts/FederationContext';
import { GarageContext, type UseGarageStoreType } from '../../contexts/GarageContext'; import { GarageContext, UseGarageStoreType } from '../../contexts/GarageContext';
const BookPage = (): JSX.Element => { const BookPage = (): JSX.Element => {
const { windowSize } = useContext<UseAppStoreType>(AppContext); const { windowSize } = useContext<UseAppStoreType>(AppContext);
@ -126,7 +125,7 @@ const BookPage = (): JSX.Element => {
<Grid item> <Grid item>
<BookTable <BookTable
maxWidth={maxBookTableWidth} // EM units maxWidth={maxBookTableWidth} // EM units
maxHeight={windowSize.height * 0.825 - 5} // EM units maxHeight={windowSize.height * 0.65} // Adjusted height to reduce rows
fullWidth={windowSize.width} // EM units fullWidth={windowSize.width} // EM units
fullHeight={windowSize.height} // EM units fullHeight={windowSize.height} // EM units
defaultFullscreen={false} defaultFullscreen={false}
@ -137,14 +136,14 @@ const BookPage = (): JSX.Element => {
<Grid item> <Grid item>
<DepthChart <DepthChart
maxWidth={chartWidthEm} // EM units maxWidth={chartWidthEm} // EM units
maxHeight={(windowSize.height * 0.825 - 5) / 2} // EM units maxHeight={(windowSize.height * 0.65) / 2} // Adjusted height
onOrderClicked={onOrderClicked} onOrderClicked={onOrderClicked}
/> />
</Grid> </Grid>
<Grid item> <Grid item>
<MapChart <MapChart
maxWidth={chartWidthEm} // EM units maxWidth={chartWidthEm} // EM units
maxHeight={(windowSize.height * 0.825 - 5) / 2} // EM units maxHeight={(windowSize.height * 0.65) / 2} // Adjusted height
onOrderClicked={onOrderClicked} onOrderClicked={onOrderClicked}
/> />
</Grid> </Grid>
@ -153,19 +152,19 @@ const BookPage = (): JSX.Element => {
) : view === 'depth' ? ( ) : view === 'depth' ? (
<DepthChart <DepthChart
maxWidth={windowSize.width * 0.8} // EM units maxWidth={windowSize.width * 0.8} // EM units
maxHeight={windowSize.height * 0.825 - 5} // EM units maxHeight={windowSize.height * 0.65} // Adjusted height
onOrderClicked={onOrderClicked} onOrderClicked={onOrderClicked}
/> />
) : view === 'map' ? ( ) : view === 'map' ? (
<MapChart <MapChart
maxWidth={windowSize.width * 0.8} // EM units maxWidth={windowSize.width * 0.8} // EM units
maxHeight={windowSize.height * 0.825 - 5} // EM units maxHeight={windowSize.height * 0.6} // Adjusted height
onOrderClicked={onOrderClicked} onOrderClicked={onOrderClicked}
/> />
) : ( ) : (
<BookTable <BookTable
maxWidth={windowSize.width * 0.97} // EM units maxWidth={windowSize.width * 0.97} // EM units
maxHeight={windowSize.height * 0.825 - 5} // EM units maxHeight={windowSize.height * 0.624} // Adjusted height to reduce rows
fullWidth={windowSize.width} // EM units fullWidth={windowSize.width} // EM units
fullHeight={windowSize.height} // EM units fullHeight={windowSize.height} // EM units
defaultFullscreen={false} defaultFullscreen={false}

2
frontend/src/basic/SettingsPage/index.tsx
View File

@ -9,7 +9,7 @@ import { FederationContext, UseFederationStoreType } from '../../contexts/Federa
const SettingsPage = (): JSX.Element => { const SettingsPage = (): JSX.Element => {
const { windowSize, navbarHeight } = useContext<UseAppStoreType>(AppContext); const { windowSize, navbarHeight } = useContext<UseAppStoreType>(AppContext);
const { federation, addNewCoordinator } = useContext<UseFederationStoreType>(FederationContext); const { federation, addNewCoordinator } = useContext<UseFederationStoreType>(FederationContext);
const maxHeight = (windowSize.height - navbarHeight) * 0.85 - 3; const maxHeight = (windowSize.height * 0.65)
const [newAlias, setNewAlias] = useState<string>(''); const [newAlias, setNewAlias] = useState<string>('');
const [newUrl, setNewUrl] = useState<string>(''); const [newUrl, setNewUrl] = useState<string>('');
const [error, setError] = useState<string>(); const [error, setError] = useState<string>();