all tabs page dashboard and responsive

This commit is contained in:
Ehsan
2024-09-05 00:21:58 +03:30
parent 52a745fcb8
commit 087ed4a818
50 changed files with 860 additions and 502 deletions
+22 -11
View File
@@ -5,8 +5,9 @@ import MessageD from "@/components/icons/MessageD";
import ProfileD from "@/components/icons/ProfileD";
import NotificationD from "@/components/icons/NotificationD";
import { Button } from "@mui/material";
import ArrowLeftSideBar from "@/components/icons/ArrowLeftSideBar";
function List({ value, setValue }) {
function List({ value, setValue, setIsOpenSide }) {
const listMenu = [
{ name: 'حساب کاربری', icon: <ProfileD active={value === 0} /> },
@@ -25,25 +26,35 @@ function List({ value, setValue }) {
key={idx}
>
<Button
className={`!flex !py-[24px] hover:!bg-transparent !rounded-none !w-full before:!rounded-[100px]
!items-center !justify-start !gap-[8px] !relative before:!absolute before:!right-0
className={`!py-[16px] sm:!py-[18px] md:!py-[20px] !px-1 hover:!bg-transparent !rounded-none !w-full before:!rounded-[100px]
!relative before:!absolute before:!right-0 !flex !justify-between !items-center
before:!top-1/2 before:!-translate-y-1/2 before:!h-[40px] before:!w-[2px]
${value === idx ?
'before:!bg-[#5559CE]' :
'before:md:!bg-[#5559CE]' :
'before:!bg-transparent'
}`}
onClick={() => setValue(idx)}
onClick={() => {
setValue(idx);
setIsOpenSide(false);
}}
>
{item.icon}
<p
className={`
text-[16px]
<div className="!flex !w-full !items-center !justify-start !gap-[8px] md:px-[24px]">
<div className="w-[24px] h-[24px]">
{item.icon}
</div>
<p
className={`
text-[16px] transition-all duration-500
${value === idx ? 'text-[#5559CE] font-bold' : 'text-[#7E7E7E] font-normal'}
`}
>{item.name}</p>
>{item.name}</p>
</div>
<div className="flex md:hidden">
<ArrowLeftSideBar active={value === idx} />
</div>
</Button>
{listMenu.length > idx + 1 && (
<span className="block bg-[#EFEFEF] h-px w-full"></span>
<span className="block bg-[#EFEFEF] h-px mx-[24px] w-[calc(100%-48px)]"></span>
)}
</li>
))}