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

fix responsive design

Browse Source
This commit is contained in:
Ehsan
2024-10-18 20:26:17 +03:30
parent e777a2dfa4
commit 1b2340a0d9
17 changed files with 135 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/clinic/components/contact/index.js
+2 -1
View File
@@ -50,10 +50,11 @@ function Contact({ data, loading }) {
handleClose={handleClose}
>
<Button
className="!flex md:!hidden !p-2 !absolute !left-3 !bottom-3 !rounded-full !border !border-[#5559CE] !bg-[#5559CE] !shadow-[0px_1px_24.8px_0px_rgba(69,_69,_69,_0.54)]"
className="!flex md:!hidden !text-[#FAFAFA] !gap-[8px] !p-2 !absolute !left-3 !bottom-3 !rounded-[4px] !border !border-[#5559CE] !bg-[#5559CE] !shadow-[0px_1px_24px_0px_rgba(69,_69,_69,_0.54)]"
onClick={handleOpen}
>
<RoutingWhiteC />
مسیریابی
</Button>
</ModalOpenLocation>
</CustomLoading>
components/layout/sidebar/ModalLogout.js
+6 -6
View File
@@ -7,32 +7,32 @@ function ModalLogout({ open, handleClose }) {
<Modal open={open} onClose={handleClose}>
<Box
sx={styleDefault}
className="!w-fit !min-w-[328px] md:!w-fit md:!min-w-[552px] !py-[20px] !px-[24px]"
className="!w-fit dark:!bg-[#222433] dark:!shadow-[0px_4px_25px_10px_#1F1D2B] !min-w-[328px] md:!w-fit md:!min-w-[552px] !py-[20px] !px-[24px]"
>
<div className="flex items-center justify-between w-full">
<p className="text-[#3B3B3B] text-[14px] sm:text-[16px] md:text-[18px] lg:text-[20px] font-medium">
<p className="text-[#3B3B3B] text-[14px] dark:text-[#D7D8ED] sm:text-[16px] md:text-[18px] lg:text-[20px] font-medium">
خروج
</p>
<Button onClick={handleClose} className="!p-1" variant="text">
<CloseModalD />
</Button>
</div>
<span className="block h-px w-full bg-[#EFEFEF] my-[12px] md:my-[14px] lg:my-[16px]"></span>
<p className="text-[#525252] text-[12px] md:text-[14px] lg:text-[16px] font-normal">
<span className="block h-px w-full dark:bg-[#343645] bg-[#EFEFEF] my-[12px] md:my-[14px] lg:my-[16px]"></span>
<p className="text-[#525252] text-[12px] dark:text-[#A1A1A1] md:text-[14px] lg:text-[16px] font-normal">
آیا مطمئن هستید که می‌خواهید از حساب کاربری خود خارج شوید؟
</p>
<div className="flex items-center justify-end gap-[16px] mt-[12px] sm:mt-[16px] md:mt-[20px] lg:mt-[24px]">
<Button
variant="outlined"
onClick={handleClose}
className="!py-[4px] md:!py-[6px] lg:!py-[8px] !px-[8px] md:!px-[12px] lg:!px-[16px] !rounded-[4px] !border-[#828DE0] !text-[#828DE0] !text-[12px] md:!text-[14px] lg:!text-[16px] !font-medium"
className="!py-[4px] dark:!bg-[#C7CEF4] dark:!text-[#5559CE] md:!py-[6px] !min-h-[32px] md:!min-h-[39px] lg:!min-h-[46px] lg:!py-[8px] !px-[8px] md:!px-[12px] lg:!px-[16px] !rounded-[4px] !border-[#828DE0] !text-[#828DE0] !text-[12px] md:!text-[14px] lg:!text-[16px] !font-medium"
>
انصراف
</Button>
<Button
variant="contained"
onClick={handleClose}
className="!py-[4px] md:!py-[6px] lg:!py-[8px] !px-[10px] md:!px-[14px] lg:!px-[18px] !rounded-[4px] !text-[#EFEFEF] !text-[12px] md:!text-[14px] lg:!text-[16px] !font-medium"
className="!py-[4px] md:!py-[6px] !min-h-[32px] md:!min-h-[39px] lg:!min-h-[46px] lg:!py-[8px] !px-[10px] md:!px-[14px] lg:!px-[18px] !rounded-[4px] !text-[#EFEFEF] !text-[12px] md:!text-[14px] lg:!text-[16px] !font-medium"
>
خروج
</Button>
components/layoutPanel/sidebar/index.js
+8
View File
@@ -3,8 +3,14 @@ import HeadMd from "./HeadMd";
import HeadSm from "./HeadSm";
import { Button } from "@mui/material";
import LogoutOrangeP from "@/components/icons/LogoutOrangeP";
import ModalLogout from "@/components/layout/sidebar/ModalLogout";
import { useState } from "react";
function Sidebar({ active, setActive, open, setOpen }) {
const [modal, setModal] = useState(false);
const handleOpen = () => setModal(true);
const handleClose = () => setModal(false);
return (
<div
className={`
@@ -43,11 +49,13 @@ function Sidebar({ active, setActive, open, setOpen }) {
>
<Button
variant="text"
onClick={handleOpen}
className="!flex !w-fit !items-center !justify-center !gap-[10px] !py-[8px] !px-[16px] !text-[#F17732] !text-[16px] !font-medium"
>
<LogoutOrangeP />
خروج از حساب
</Button>
<ModalLogout open={modal} handleClose={handleClose} />
</div>
</div>
</aside>
components/panel/addDoctor/listMenu/generalInformation/Head.js
+7 -1
View File
@@ -1,9 +1,15 @@
import UploadFile from "@/app/component/UploadFile";
import { useState } from "react";
function Head() {
const [image, setImage] = useState({
file: "",
blob: "",
});
return (
<div className="flex items-center justify-center md:justify-start gap-[10px]">
<UploadFile />
<UploadFile image={image} setImage={setImage} />
</div>
);
}
components/panel/addDoctor/listMenu/generalInformation/form/index.js
+4 -3
View File
@@ -92,14 +92,15 @@ function Form({ setValue, parent, data, setData }) {
</div>
<div className="mt-[40px] w-full flex justify-end">
<Button
className={`!w-full md:!w-fit !shadow-none !rounded-[4px] !gap-[4px] !text-[#EFEFEF] !text-[14px] md:!text-[16px] !font-medium
${!checkAllValues(data) && "opacity-60"}`}
className="!w-full md:!w-fit !shadow-none !rounded-[4px] !gap-[4px] !text-[#EFEFEF] !text-[14px] md:!text-[16px] !font-medium"
onClick={() => setValue((prev) => prev + 1)}
disabled={!checkAllValues(data)}
variant="contained"
>
ثبت اطلاعات
<ArrowLeftPA />
<div className={!checkAllValues(data) ? "opacity-40" : "opacity-100"}>
<ArrowLeftPA />
</div>
</Button>
</div>
</div>
components/panel/addDoctor/listMenu/officeInformation/index.js
+3 -1
View File
@@ -16,7 +16,9 @@ function OfficeInformation({ setValue, parent, data, setData }) {
variant="contained"
>
ثبت اطلاعات
<ArrowLeftPA />
<div className={!checkAllValues(data) ? "opacity-40" : "opacity-100"}>
<ArrowLeftPA />
</div>
</Button>
</div>
</div>
components/panel/addDoctor/listMenu/workingDays/modal/Form.js
+2 -2
View File
@@ -77,14 +77,14 @@ function Form({
<Button
variant="outlined"
onClick={handleClose}
className="!text-[16px] !font-medium !border-[#5559CE] !py-[5px] md:!py-[7px] lg:!py-[9px] !shadow-none !px-[46px]"
className="!text-[16px] !max-w-[calc(50%_-_8px)] dark:!bg-[#C7CEF4] dark:!text-[#5559CE] !font-medium !border-[#5559CE] !py-[5px] md:!py-[7px] lg:!py-[9px] !shadow-none !px-[46px]"
>
انصراف
</Button>
<Button
variant="contained"
onClick={handleClose}
className="!text-[16px] !font-medium !shadow-none !py-[5px] md:!py-[7px] lg:!py-[9px] !px-[46px]"
className="!text-[16px] !max-w-[calc(50%_-_8px)] !font-medium !shadow-none !py-[5px] md:!py-[7px] lg:!py-[9px] !px-[46px]"
>
ذخیره
</Button>
components/panel/turns/head/SearchDoctor.js
+1 -1
View File
@@ -40,7 +40,7 @@ function SearchDoctor() {
</ButtonGroup>
<Button
variant="outlined"
className="!border-[#5559CE] dark:!bg-[#C7CEF4] !flex !text-[14px] md:!text-[16px] !items-center !gap-[4px] md:!gap-[5px] lg:!gap-[6px] !rounded-[4px] !py-[8px] md:!py-[9px] !px-[12px] sm:!px-[14px] md:!px-[16px] lg:!px-[18px]"
className="!border-[#5559CE] dark:!bg-[#C7CEF4] dark:!text-[#5559CE] !flex !text-[14px] md:!text-[16px] !items-center !gap-[4px] md:!gap-[5px] lg:!gap-[6px] !rounded-[4px] !py-[8px] md:!py-[9px] !px-[12px] sm:!px-[14px] md:!px-[16px] lg:!px-[18px]"
>
<ExportP />
خروجی گرفتن
components/panel/userAccount/account/Head.js
+7 -1
View File
@@ -1,11 +1,17 @@
"use client";
import UploadFile from "@/app/component/UploadFile";
import { useState } from "react";
function Head() {
const [image, setImage] = useState({
file: "",
blob: "",
});
return (
<div className="flex items-center justify-center md:justify-start gap-[10px]">
<UploadFile />
<UploadFile image={image} setImage={setImage} />
</div>
);
}
components/panel/userAccount/bank/cards/Item.js
+14 -10
View File
@@ -6,12 +6,12 @@ import { Button } from "@mui/material";
function Item({ data, loading }) {
return (
<li className="rounded-[8px] bg-[#FFF] p-[12px] shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)]">
<li className="rounded-[8px] bg-[#FFF] p-[12px] dark:shadow-transparent dark:bg-[#222433] shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)]">
<div className="w-full flex items-center justify-between">
<div className="flex items-center justify-start gap-[4px]">
<TextLoading width={50} height={18} loading={loading}>
<div className="flex items-center justify-start gap-[16px]">
<p className="text-[16px] min-w-[60px] font-medium text-[#616161]">
<p className="text-[16px] min-w-[60px] font-medium text-[#616161] dark:text-[#A1A1A1]">
{data.status ? "فعال" : "غیر فعال"}
</p>
<SwitchTable value={data.status} />
@@ -30,34 +30,38 @@ function Item({ data, loading }) {
<ul className="flex flex-col mt-[16px]">
<li className="flex items-center justify-between gap-[12px]">
<TextLoading loading={loading} width={60} height={18}>
<p className="text-[#7E7E7E] text-[14px] font-normal">
<p className="text-[#7E7E7E] text-[14px] font-normal dark:text-[#A1A1A1]">
شماره کارت:
</p>
</TextLoading>
<TextLoading loading={loading} width={90} height={18}>
<p className="text-[#616161] text-[12px] font-medium">
<p className="text-[#616161] text-[12px] font-medium dark:text-[#A1A1A1]">
{data.card_number}
</p>
</TextLoading>
</li>
<span className="block h-px w-[calc(100%-20px)] mx-auto bg-[#EFEFEF] my-[8px]"></span>
<span className="block h-px w-[calc(100%-20px)] dark:bg-[#343645] mx-auto bg-[#EFEFEF] my-[8px]"></span>
<li className="flex items-center justify-between gap-[12px]">
<TextLoading loading={loading} width={60} height={18}>
<p className="text-[#7E7E7E] text-[14px] font-normal">شماره شبا:</p>
<p className="text-[#7E7E7E] text-[14px] font-normal dark:text-[#A1A1A1]">
شماره شبا:
</p>
</TextLoading>
<TextLoading loading={loading} width={90} height={18}>
<p className="text-[#616161] text-[12px] font-medium">
<p className="text-[#616161] text-[12px] font-medium dark:text-[#A1A1A1]">
{data.shaba_number}
</p>
</TextLoading>
</li>
<span className="block h-px w-[calc(100%-20px)] mx-auto bg-[#EFEFEF] my-[8px]"></span>
<span className="block h-px w-[calc(100%-20px)] mx-auto bg-[#EFEFEF] my-[8px] dark:bg-[#343645]"></span>
<li className="flex items-center justify-between gap-[12px]">
<TextLoading loading={loading} width={60} height={18}>
<p className="text-[#7E7E7E] text-[14px] font-normal">بانک:</p>
<p className="text-[#7E7E7E] text-[14px] font-normal dark:text-[#A1A1A1]">
بانک:
</p>
</TextLoading>
<TextLoading loading={loading} width={90} height={18}>
<p className="text-[#616161] text-[12px] font-medium">
<p className="text-[#616161] text-[12px] font-medium dark:text-[#A1A1A1]">
{data.bank}
</p>
</TextLoading>