add open/close to sidebar & responsive sidebar & head & page dashboard and user account

This commit is contained in:
Ehsan
2024-09-13 02:19:47 +03:30
parent a1571bbb62
commit d1f289bdca
40 changed files with 481 additions and 140 deletions
+9 -8
View File
@@ -8,7 +8,7 @@ import CategoryP from "@/components/icons/CategoryP";
import ProfileAddP from "@/components/icons/ProfileAddP";
import ProfileCircleP from "@/components/icons/ProfileCircleP";
function Links() {
function Links({ open }) {
const list = [
{ name: 'دشبورد', src: '/panel/dashboard', icon: <CategoryP /> },
@@ -20,25 +20,26 @@ function Links() {
const pathname = usePathname();
return (
<ul className="flex flex-col gap-[32px] mt-[54px]">
<ul className={`flex flex-col gap-[32px] mt-[36px] md:mt-[54px] transition-all duration-500`}>
{list.map((item, idx) => (
<li
key={idx}
>
<li key={idx}>
<Link href={item.src}>
<Button
fullWidth
variant="text"
className={`
!p-[8px] !flex !items-center !justify-start !gap-[8px] !text-[16px] !rounded-[8px] !transition-all !duration-500
${item.src === pathname ? '!bg-[#5559CE] !text-[#FAFAFA] !font-bold' : '!text-[#525252] !font-medium'}
!p-[8px] !flex !items-center !justify-start !gap-[8px] !text-[16px] !rounded-[8px] !transition-all !duration-500
${item.src === pathname ? '!bg-[#5559CE] !text-[#FAFAFA] !font-bold' : '!text-[#525252] !font-medium'}
`}
>
<div className="p-[4px] bg-[#E5E9FF] rounded-[4px] w-fit">
{item.icon}
</div>
{item.name}
<p className={`
transition-all duration-500
${open ? 'opacity-100' : 'md:opacity-0'}
`}>{item.name}</p>
</Button>
</Link>
</li>