Fixed loadout customization layout

dragoni7 · Sep 16, 2024 · aca8b3b · aca8b3b
1 parent 9c865ac
commit aca8b3b
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 9 deletions.
diff --git a/src/app/routes/Dashboard.tsx b/src/app/routes/Dashboard.tsx
@@ -1,7 +1,7 @@
 import React, { useEffect, useState, useMemo } from 'react';
 import { Box, styled } from '@mui/system';
 import { useDispatch, useSelector } from 'react-redux';
-import { AppDispatch, RootState, store } from '../../store';
+import { AppDispatch, RootState } from '../../store';
 import { generatePermutations } from '../../features/armor-optimization/generate-permutations';
 import {
   filterFromSharedLoadout,

diff --git a/src/components/LoadoutCustomization.tsx b/src/components/LoadoutCustomization.tsx
@@ -7,7 +7,6 @@ import EquipLoadout from '../features/loadouts/components/EquipLoadout';
 import AbilitiesModification from '../features/subclass/AbilitiesModification';
 import ShareLoadout from '../features/loadouts/components/ShareLoadout';
 import { SubclassConfig } from '../types/d2l-types';
-import SaveLoadout from '../features/loadouts/components/SaveLoadout';
 import TotalStatsDisplay from '../features/subclass/TotalStatsDisplay';
 
 interface LoadoutCustomizationProps {
@@ -38,9 +37,7 @@ const LoadoutCustomization: React.FC<LoadoutCustomizationProps> = ({
     <Box
       sx={{
         width: '100vw',
-        display: 'flex',
-        flexGrow: 1,
-        position: 'relative',
+        height: '100vh',
         overflow: 'auto',
         '&::before': {
           content: '""',
@@ -83,7 +80,7 @@ const LoadoutCustomization: React.FC<LoadoutCustomizationProps> = ({
         }}
       />
 
-      <Grid container columns={2} sx={{ position: 'relative', zIndex: 3 }}>
+      <Grid container columns={2} sx={{ position: 'relative', zIndex: 3, height: '100%' }}>
         <Grid item md={1}>
           <TransparentButton
             onClick={onBackClick}
@@ -113,7 +110,7 @@ const LoadoutCustomization: React.FC<LoadoutCustomizationProps> = ({
         >
           <TotalStatsDisplay />
         </Grid>
-        <Grid item md={1} sx={{ textAlign: 'center' }}>
+        <Grid item md={1} sx={{ textAlign: 'center', alignContent: 'end', paddingBottom: '6px' }}>
           <EquipLoadout />
           <ShareLoadout />
         </Grid>

diff --git a/src/features/armor-optimization/StatsTable.tsx b/src/features/armor-optimization/StatsTable.tsx
@@ -156,7 +156,7 @@ const StatsTable: React.FC<StatsTableProps> = ({ permutations, onPermutationClic
 
   useEffect(() => {
     if (large) {
-      setItemsPerPage(6);
+      setItemsPerPage(5);
     } else {
       setItemsPerPage(4);
     }

diff --git a/src/features/loadouts/components/SaveLoadout.tsx b/src/features/loadouts/components/SaveLoadout.tsx
@@ -191,7 +191,7 @@ export default function SaveLoadout() {
     <>
       <Button onClick={() => setLoadoutDrawerOpen(true)}>SAVE IN-GAME</Button>
       <Drawer open={loadoutDrawerOpen} anchor="right">
-        <Box sx={{ width: '24vw' }}>
+        <Box sx={{ width: '18vw' }}>
           {identifiersSet ? SelectLoadoutSlotDrawer : SetIdentifiersDrawer}
         </Box>
       </Drawer>