update layout

src/pages/Payment/Search_GLD/SearchForm.js

@@ -19,22 +19,6 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
     const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo);
     const [status, setStatus] = React.useState(ComboData.paymentStatus[0]);
 
-    const _sx = {
-        padding: "4 2 4 2",
-        boxShadow: 1,
-        border: 1,
-        borderColor: '#DDD',
-        '& .MuiDataGrid-cell': {
-            borderTop: 1,
-            borderBottom: 1,
-            borderColor: "#EEE"
-        },
-        '& .MuiDataGrid-footerContainer': {
-            border: 1,
-            borderColor: "#EEE"
-        }
-    }
-
     const { reset, register, handleSubmit } = useForm()
 
     const onSubmit = (data) => {
@@ -57,21 +41,19 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
         <MainCard xs={12} md={12} lg={12}
             border={false}
             content={false}
-            sx={_sx}
             >
 
-            <form onSubmit={handleSubmit(onSubmit)}>
-                {/*row 1*/}
-                <Grid item justifyContent="space-between" alignItems="center" sx={{mt:1,ml:3,mb:2.5}}>
-                    <Typography variant="h5" >
-                        Search Form
-                    </Typography>
-                </Grid>
-
-
-                {/*row 2*/}
-                <Grid container alignItems={"center"}>
+            <form onSubmit={handleSubmit(onSubmit)} >
+                <Grid container sx={{ backgroundColor: '#ffffff', ml: 2, mt: 1, mb: 2.5}} width="98%">
+                    {/*row 1*/}
+                    <Grid item justifyContent="space-between" alignItems="center" sx={{mt:1,ml:3,mb:2.5}}>
+                        <Typography variant="h5" >
+                            Search Form
+                        </Typography>
+                    </Grid>
+                    {/*row 2*/}
 
+                    <Grid container display="flex" alignItems={"center"}>
                     <Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
                         <TextField
                             fullWidth
@@ -160,8 +142,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
                             }}
                         />
                     </Grid>
-
-
+                    </Grid>
                 </Grid>
 
 

src/pages/Payment/Search_GLD/index.js

@@ -64,11 +64,13 @@ const Index = () => {
         !onReady ?
             <LoadingComponent/>
             :
-            <Grid container sx={{minHeight: '85vh',backgroundColor:'#ffffff'}} direction="column">
+            <Grid container sx={{minHeight: '85vh', backgroundColor: 'backgroundColor.default'}} direction="column">
                 <Grid item xs={12}>
                     <div style={BackgroundHead}>
                         <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
-                            <Typography ml={15} color='#FFF' variant="h4">Payment Record</Typography>
+                            <Typography ml={15} color='#FFF' variant="h4">
+                                Payment Record
+                            </Typography>
                         </Stack>
                     </div>
                 </Grid>