design page general and office information & head panel

app/component/EditField.js

@@ -2,11 +2,13 @@ import EditGrayA from "@/components/icons/EditGrayA"
 import EditOrangeA from "@/components/icons/EditOrangeA"
 import { Button, TextField } from "@mui/material"
 
-function EditField({ changeData, icon, placeholder, data, name, iconGray, isTransparent }) {
+function EditField({ changeData, multiline, icon, placeholder, data, name, iconGray, isTransparent }) {
     return (
         <div className="relative w-full">
             <TextField
                 value={data?.value}
+                rows={multiline}
+                multiline={multiline}
                 disabled={!data?.isEdit}
                 placeholder={placeholder || ''}
                 type='text'
@@ -19,9 +21,12 @@ function EditField({ changeData, icon, placeholder, data, name, iconGray, isTran
                         top: '-4px !important'
                     },
                     '& .MuiInputBase-input': { padding: '12.5px 14px' },
-                    '& .MuiInputBase-root': { borderRadius: '6px !important' },
                     '& .MuiOutlinedInput-notchedOutline': { border: '1px solid #D7D7D7 !important' },
-                    ".Mui-focused": {
+                    '& .MuiInputBase-root': {
+                        padding: '0 !important',
+                        borderRadius: '8px !important'
+                    },
+                    '.Mui-focused': {
                         '& .MuiOutlinedInput-notchedOutline': {
                             border: '1px solid #5559CE !important',
                             transition: '0.5s all'
@@ -30,7 +35,8 @@ function EditField({ changeData, icon, placeholder, data, name, iconGray, isTran
                 }}
             />
             <Button
-                className="!absolute !left-[8px] !top-1/2 !-translate-y-1/2 !min-w-fit !p-1"
+                className={`!absolute !left-[8px] !-translate-y-1/2 !min-w-fit !p-1
+                    ${multiline ? '!top-[24px]' : '!top-1/2'}`}
                 onClick={() => {
                     changeData(!data.isEdit, 'isEdit', name)
                 }}

app/panel/(layout)/add-doctor/page.js

@@ -0,0 +1,9 @@
+import AddDoctorPage from "@/components/panel/addDoctor"
+
+function AddDoctor() {
+    return (
+        <AddDoctorPage />
+    )
+}
+
+export default AddDoctor

app/panel/(layout)/layout.js

@@ -8,13 +8,16 @@ import { usePathname } from "next/navigation";
 
 function LayoutPanel({ children }) {
 
-    const pathname = usePathname()
+    const pathname = usePathname();
 
     return (
         <div className="flex min-h-screen">
             <Sidebar />
             <main className="w-full">
-                <Header />
+                <Header
+                    data={Information}
+                    disableProfile={pathname.includes('dashboard')}
+                />
                 <section className="my-[24px] opacity-element mx-[16px] bg-[#FAFAFA]">
                     {children}
                 </section>