hamed/nobat724_front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

responsive page panel and add-doctor

Browse Source
This commit is contained in:
Ehsan
2024-10-15 00:49:07 +03:30
parent d6b08565a1
commit b561b111ec
21 changed files with 128 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/panel/addDoctor/Step.js
+4 -3
View File
@@ -15,7 +15,8 @@ function Step({ value }) {
<li className="flex items-center justify-center" key={idx}>
<div className="flex flex-col items-center justify-center gap-2">
<div
className={`flex items-center bg-[#F6F6F6] justify-center p-[18px] w-[75px] h-[75px] rounded-full
className={`flex items-center bg-[#F6F6F6] justify-center p-[18px]
w-[32px] h-[32px] sm:w-[46px] sm:h-[46px] md:w-[60px] md:h-[60px] lg:w-[75px] lg:h-[75px] rounded-full
relative overflow-hidden before:delay-500 before:transition-all before:duration-500
before:absolute before:w-full before:h-full before:bg-[#5559CE]
${value >= idx ? "before:right-0" : "before:-right-full"}`}
@@ -23,7 +24,7 @@ function Step({ value }) {
<div className="z-10 delay-500">{item.icon}</div>
</div>
<p
className={`text-[16px]
className={`text-[10px] sm:text-[12px] md:text-[14px] lg:text-[16px] text-nowrap
${
value >= idx
? "font-bold text-[#5559CE]"
@@ -35,7 +36,7 @@ function Step({ value }) {
</div>
{list.length > idx + 1 && (
<span
className={`block rounded-[16px] transition-all duration-500 h-[2px] bg-[#EFEFEF] w-[100px]
className={`block rounded-[16px] transition-all duration-500 h-[2px] bg-[#EFEFEF] w-[35px] sm:w-[56px] md:w-[77px] lg:w-[100px]
relative overflow-hidden before:transition-all before:duration-500
before:absolute before:w-full before:h-full before:bg-[#5559CE] before:ease-linear
components/panel/addDoctor/index.js
+4 -4
View File
@@ -9,7 +9,7 @@ import GeneralInformation from "./listMenu/generalInformation";
import Step from "./Step";
function AddDoctorPage() {
const [value, setValue] = useState(2);
const [value, setValue] = useState(0);
const [data, setData] = useState({
general: {
name: { value: "احسان احمدی", isEdit: false },
@@ -80,8 +80,6 @@ function AddDoctorPage() {
],
});
console.log(data);
const components = [
<GeneralInformation
data={data}
@@ -114,7 +112,9 @@ function AddDoctorPage() {
md:pt-[30px] pb-0 md:pb-[12px] lg:pb-[24px] px-0 md:px-[14px] lg:px-[26px] xl:px-[56px]"
>
<Step value={value} />
<div className="mt-[32px]">{components[value]}</div>
<div className="mt-[24px] md:mt-[28px] lg:mt-[32px]">
{components[value]}
</div>
</div>
</div>
);
components/panel/addDoctor/listMenu/generalInformation/form/index.js
+1 -1
View File
@@ -27,7 +27,7 @@ function Form({ setValue, parent, data, setData }) {
return (
<div>
<div className="mt-[28px] grid grid-cols-1 md:grid-cols-2 gap-x-[48px] gap-y-[24px]">
<div className="mt-[24px] md:mt-[26px] lg:mt-[28px] grid grid-cols-1 md:grid-cols-2 gap-x-[48px] gap-y-[24px]">
<ContentText text="نام و نام خانوادگی">
<EditField
isTransparent={true}
components/panel/addDoctor/listMenu/generalInformation/index.js
+1 -1
View File
@@ -3,7 +3,7 @@ import Head from "./Head";
function GeneralInformation({ setValue, parent, data, setData }) {
return (
<div className="opacity-page pb-[24px] px-[56px]">
<div className="opacity-page pb-[24px] px-0 md:px-[24px] lg:px-[56px]">
<Head />
<Form
parent={parent}
components/panel/addDoctor/listMenu/officeInformation/index.js
+1 -1
View File
@@ -5,7 +5,7 @@ import { checkAllValues } from "@/helper";
function OfficeInformation({ setValue, parent, data, setData }) {
return (
<div className="opacity-page pb-[24px] px-[56px]">
<div className="opacity-page pb-[24px] px-0 md:px-[24px] lg:px-[56px]">
<Form parent={parent} setData={setData} data={data.office} />
<div className="mt-[40px] w-full flex justify-end">
<Button