all tabs page dashboard and responsive

app/component/CustomTable.js

@@ -2,8 +2,8 @@ import { Table, TableBody, TableCell, TableContainer, TableHead, TableRow } from
 
 function CustomTable({ tableHead, centerTable, children }) {
     return (
-        <TableContainer className='!shadow-none !rounded-[8px] !border !border-solid !border-[#DBDBDB]'>
-            <Table className='!rounded-[8px] !overflow-hidden'>
+        <TableContainer className='!shadow-none table-shadow-none !rounded-[8px] !border !border-solid !border-[#DBDBDB]'>
+            <Table className='!rounded-[8px] !shadow-none !overflow-hidden'>
                 <TableHead>
                     <TableRow
                         className='!bg-[#EFEFEF]'

app/component/EditField.js

@@ -2,14 +2,14 @@ import EditGrayA from "@/components/icons/EditGrayA"
 import EditOrangeA from "@/components/icons/EditOrangeA"
 import { Button, TextField } from "@mui/material"
 
-function EditField({ changeData, data, name, iconGray }) {
+function EditField({ changeData, data, name, iconGray, isTransparent }) {
     return (
         <div className="relative w-full">
             <TextField
                 value={data?.value}
                 disabled={!data?.isEdit}
                 type='text'
-                className="!bg-[#FFF] !w-full res-field-account"
+                className={`!w-full res-field-account ${isTransparent ? '!bg-transparent lg:!bg-[#FFF]' : '!bg-[#FFF]'}`}
                 onChange={e => {
                     changeData(e.target.value, 'value', name)
                 }}

app/component/Tabs.js

@@ -10,7 +10,7 @@ function a11yProps(index) {
 function Tabs({ value, handleChange, listTab, isSm, style }) {
     return (
         <Box
-            className="!border-none"
+            className="!border-none !w-full"
         >
             <TabsMUI
                 value={value}