remove grid and adjust UI to fit width

decentdao · Jul 11, 2024 · e0f453a · e0f453a
1 parent 0a62463
commit e0f453a
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 14 deletions.
diff --git a/src/components/pages/Roles/forms/RoleFormCreateProposal.tsx b/src/components/pages/Roles/forms/RoleFormCreateProposal.tsx
@@ -44,12 +44,13 @@ export default function RoleFormCreateProposal({ close }: { close: () => void })
   };
 
   return (
-    <Box>
+    <Box maxW="736px">
       <Flex
         flexDir="column"
         gap="1rem"
         p="1rem"
         bg="neutral-2"
+        maxW="736px"
         boxShadow={CARD_SHADOW}
         borderRadius="0.5rem"
       >

diff --git a/src/pages/daos/[daoAddress]/roles/edit/summary/index.tsx b/src/pages/daos/[daoAddress]/roles/edit/summary/index.tsx
@@ -1,4 +1,4 @@
-import { Box, Flex, Grid, GridItem, Icon, Portal, Show, Text } from '@chakra-ui/react';
+import { Box, Flex, Icon, Portal, Show, Text } from '@chakra-ui/react';
 import { ArrowLeft } from '@phosphor-icons/react';
 import { useTranslation } from 'react-i18next';
 import { useNavigate } from 'react-router-dom';
@@ -64,10 +64,12 @@ export default function EditProposalSummary() {
             position="absolute"
             top={`calc(1rem + ${headerHeight})`}
             left={{ base: SIDEBAR_WIDTH, '3xl': `calc(${SIDEBAR_WIDTH} + 9rem)` }}
-            h={`100vh`}
             bg="neutral-1"
             px="1rem"
-            width={`calc(100% - ${SIDEBAR_WIDTH})`}
+            width={{
+              base: `calc(100% - ${SIDEBAR_WIDTH})`,
+              '3xl': `calc(100% - 9rem - ${SIDEBAR_WIDTH})`,
+            }}
           >
             <PageHeader
               title={t('proposalNew', { ns: 'breadcrumbs' })}
@@ -78,16 +80,9 @@ export default function EditProposalSummary() {
                 },
               ]}
             />
-            <Grid
-              gridTemplateAreas={`"form details"`}
-              gridTemplateColumns="minmax(1fr, 736px) 1fr"
-            >
-              <GridItem area="form">
-                <RoleFormCreateProposal
-                  close={() => navigate(DAO_ROUTES.rolesEdit.relative(addressPrefix, daoAddress))}
-                />
-              </GridItem>
-            </Grid>
+            <RoleFormCreateProposal
+              close={() => navigate(DAO_ROUTES.rolesEdit.relative(addressPrefix, daoAddress))}
+            />
           </Box>
         </Portal>
       </Show>