dark mode page panel/dashboard

This commit is contained in:
Ehsan
2024-09-28 13:35:12 +03:30
parent 8438b71538
commit 9992bdfa62
11 changed files with 118 additions and 31 deletions
+2
View File
@@ -9,6 +9,7 @@ function ArrowLeftP() {
>
<path
d="M9.57 5.92969L3.5 11.9997L9.57 18.0697"
className="dark:stroke-[#A1A1A1]"
stroke="#616161"
strokeWidth="1.5"
strokeMiterlimit="10"
@@ -17,6 +18,7 @@ function ArrowLeftP() {
/>
<path
d="M20.4999 12H3.66992"
className="dark:stroke-[#A1A1A1]"
stroke="#616161"
strokeWidth="1.5"
strokeMiterlimit="10"
+1 -1
View File
@@ -22,7 +22,7 @@ function CalendarTickGreenP() {
<path
d="M20 9.83984H4C3.45 9.83984 3 10.2898 3 10.8398V16.9998C3 19.9998 4.5 21.9998 8 21.9998H12.93C13.62 21.9998 14.1 21.3298 13.88 20.6798C13.68 20.0998 13.51 19.4598 13.51 18.9998C13.51 15.9698 15.98 13.4998 19.01 13.4998C19.3 13.4998 19.59 13.5198 19.87 13.5698C20.47 13.6598 21.01 13.1898 21.01 12.5898V10.8498C21 10.2898 20.55 9.83984 20 9.83984ZM9.21 18.2098C9.02 18.3898 8.76 18.4998 8.5 18.4998C8.24 18.4998 7.98 18.3898 7.79 18.2098C7.61 18.0198 7.5 17.7598 7.5 17.4998C7.5 17.2398 7.61 16.9798 7.79 16.7898C7.89 16.6998 7.99 16.6298 8.12 16.5798C8.49 16.4198 8.93 16.5098 9.21 16.7898C9.39 16.9798 9.5 17.2398 9.5 17.4998C9.5 17.7598 9.39 18.0198 9.21 18.2098ZM9.21 14.7098C9.16 14.7498 9.11 14.7898 9.06 14.8298C9 14.8698 8.94 14.8998 8.88 14.9198C8.82 14.9498 8.76 14.9698 8.7 14.9798C8.63 14.9898 8.56 14.9998 8.5 14.9998C8.24 14.9998 7.98 14.8898 7.79 14.7098C7.61 14.5198 7.5 14.2598 7.5 13.9998C7.5 13.7398 7.61 13.4798 7.79 13.2898C8.02 13.0598 8.37 12.9498 8.7 13.0198C8.76 13.0298 8.82 13.0498 8.88 13.0798C8.94 13.0998 9 13.1298 9.06 13.1698C9.11 13.2098 9.16 13.2498 9.21 13.2898C9.39 13.4798 9.5 13.7398 9.5 13.9998C9.5 14.2598 9.39 14.5198 9.21 14.7098ZM12.71 14.7098C12.52 14.8898 12.26 14.9998 12 14.9998C11.74 14.9998 11.48 14.8898 11.29 14.7098C11.11 14.5198 11 14.2598 11 13.9998C11 13.7398 11.11 13.4798 11.29 13.2898C11.67 12.9198 12.34 12.9198 12.71 13.2898C12.89 13.4798 13 13.7398 13 13.9998C13 14.2598 12.89 14.5198 12.71 14.7098Z"
fill="#14CC26"
className="dark:fill-[#FFFFFF] dark:stroke-[#FFFFFF]"
className="dark:fill-[#FFFFFF]"
/>
</svg>
);
@@ -4,7 +4,7 @@ import WarnP from "@/components/icons/WarnP";
function Activities({ data, loading }) {
return (
<div className="w-full mt-[16px] sm:mt-[24px] md:mt-[32px] lg:mt-[40px]">
<p className="text-[#525252] text-[14px] md:text-[16px] font-bold">
<p className="text-[#525252] text-[14px] md:text-[16px] font-bold dark:text-[#D7D8ED]">
فعالیت های امروز
</p>
<ul className="flex flex-col justify-start w-full mt-[24px]">
@@ -16,19 +16,19 @@ function Activities({ data, loading }) {
<WarnP />
</div>
<TextLoading width={110} height={18} loading={loading}>
<p className="text-[#616161] text-[16px] font-medium">
<p className="text-[#616161] dark:text-[#A1A1A1] text-[16px] font-medium">
{item.text}
</p>
</TextLoading>
</div>
<TextLoading width={55} height={18} loading={loading}>
<p className="text-[#7E7E7E] text-[12px] font-normal">
<p className="text-[#7E7E7E] dark:text-[#A1A1A1] text-[12px] font-normal">
{item.time}
</p>
</TextLoading>
</div>
{data.todays_activities.length > idx + 1 && (
<span className="block h-px w-full bg-transparent md:bg-[#EFEFEF] px-[13px] my-[16px] md:my-[20px] lg:my-[24px]"></span>
<span className="block h-px w-full bg-transparent md:bg-[#EFEFEF] dark:bg-[#343645] px-[13px] my-[16px] md:my-[20px] lg:my-[24px]"></span>
)}
</li>
))}
+3 -3
View File
@@ -42,13 +42,13 @@ function Cards({ data, loading }) {
{item.icon}
</div>
<div className="flex items-center justify-between">
<p className="text-[#525252] text-[14px] font-normal">
<p className="text-[#525252] text-[14px] font-normal dark:text-[#D7D8ED]">
{item.text}
</p>
<TextLoading width={70} height={20} loading={loading}>
<p className="text-[#3B3B3B] text-[24px] font-medium">
<p className="text-[#3B3B3B] text-[24px] font-medium dark:text-[#A1A1A1]">
{item.value}
<span className="text-[#616161] mr-[6px] text-[12px] font-normal">
<span className="text-[#616161] mr-[6px] text-[12px] font-normal dark:text-[#A1A1A1]">
{item.label}
</span>
</p>
@@ -15,7 +15,7 @@ function Head() {
return (
<div className="flex items-center justify-start gap-[12px] p-[16px]">
<p className="text-[#525252] text-[14px] md:text-[16px] font-bold">
<p className="text-[#525252] text-[14px] md:text-[16px] font-bold dark:text-[#D7D8ED]">
میزان درآمد
</p>
<Select
@@ -28,12 +28,12 @@ function Head() {
},
"&:hover": {
"& .MuiOutlinedInput-notchedOutline": {
border: "1px solid #D7D7D7 !important",
border: "1px solid #D7D7D7",
},
},
"& .MuiOutlinedInput-notchedOutline": {
borderColor: "#D7D7D7 !important",
border: "1px solid #D7D7D7 !important",
border: "1px solid #D7D7D7",
},
}}
>
@@ -3,7 +3,7 @@ import Head from "./Head";
function AmountOfIncome({ data, loading }) {
return (
<div className="rounded-[8px] border border-solid border-[#EFEFEF] bg-[#FFF]">
<div className="rounded-[8px] border border-solid border-[#EFEFEF] bg-[#FFF] dark:bg-[#222433] dark:!border-transparent">
<Head />
<div dir="ltr">
<Chart data={data} loading={loading} />
+7 -7
View File
@@ -16,9 +16,9 @@ function Table({ data, loading }) {
centerTable={centerTable}
>
{data.list_of_doctors_appointments.map((row, idx) => (
<TableRow key={idx} className="!border-0 !border-b !border-[#DBDBDB]">
<TableRow key={idx} className="!border-0 !border-b !border-[#DBDBDB] dark:!border-transparent">
<TableCell
className="!pr-[18px] !text-[#616161] !text-[16px] !font-medium !text-nowrap"
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="center"
>
<TextLoading width={15} height={18} loading={loading}>
@@ -26,7 +26,7 @@ function Table({ data, loading }) {
</TextLoading>
</TableCell>
<TableCell
className="!pr-[18px] !text-[#616161] !text-[16px] !font-medium !text-nowrap"
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
component="th"
scope="row"
>
@@ -40,7 +40,7 @@ function Table({ data, loading }) {
</div>
</TableCell>
<TableCell
className="!text-start !text-[#616161] !text-[16px] !font-medium !pr-[18px] !text-nowrap"
className="!text-start dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !pr-[18px] !text-nowrap"
align="right"
>
<TextLoading width={30} height={18} loading={loading}>
@@ -48,7 +48,7 @@ function Table({ data, loading }) {
</TextLoading>
</TableCell>
<TableCell
className="!text-start !text-[#616161] !text-[16px] !font-medium !pr-[18px] !text-nowrap"
className="!text-start dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !pr-[18px] !text-nowrap"
align="right"
>
<TextLoading width={50} height={18} loading={loading}>
@@ -56,7 +56,7 @@ function Table({ data, loading }) {
</TextLoading>
</TableCell>
<TableCell
className="!text-center !text-[#616161] !text-[16px] !font-medium !pr-[18px] !text-nowrap"
className="!text-center dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !pr-[18px] !text-nowrap"
align="right"
>
<TextLoading width={50} height={18} loading={loading}>
@@ -64,7 +64,7 @@ function Table({ data, loading }) {
</TextLoading>
</TableCell>
<TableCell
className="!text-right !text-[#616161] !text-[16px] !font-medium !pr-[18px] !text-nowrap"
className="!text-right dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !pr-[18px] !text-nowrap"
align="right"
>
<TextLoading width={50} height={18} loading={loading}>
+3 -3
View File
@@ -5,14 +5,14 @@ import ColTable from "../../ColTable";
function List({ data, loading }) {
return (
<div className="rounded-[8px] border overflow-hidden border-solid w-full border-transparent md:border-[#EFEFEF] bg-transparent md:bg-[#FFF]">
<div className="rounded-[8px] border overflow-hidden border-solid w-full border-transparent md:border-[#EFEFEF] bg-transparent md:bg-[#FFF] dark:bg-[#222433] dark:border-transparent">
<div className="flex items-center justify-between p-[16px]">
<p className="text-[#525252] text-[14px] md:text-[16px] font-bold">
<p className="text-[#525252] text-[14px] md:text-[16px] font-bold dark:text-[#D7D8ED]">
لیست نوبت های پزشکان
</p>
<Button
variant="text"
className="!hidden md:!flex !items-center !justify-center !text-[#616161] !text-[14px] !font-normal !gap-[4px] !p-1"
className="!hidden md:!flex !items-center !justify-center !text-[#616161] !text-[14px] !font-normal !gap-[4px] !p-1 dark:!text-[#A1A1A1]"
>
مشاهده همه
<ArrowLeftP />