add prettier formatter to all file
This commit is contained in:
Ehsan
@@ -1,26 +1,21 @@
|
||||
import Image from "next/image"
|
||||
import Image from "next/image";
|
||||
|
||||
const Namads = [
|
||||
'/assets/images/footer-etehadie.png',
|
||||
'/assets/images/footer-r.png',
|
||||
'/assets/images/footer-namad.png'
|
||||
]
|
||||
"/assets/images/footer-etehadie.png",
|
||||
"/assets/images/footer-r.png",
|
||||
"/assets/images/footer-namad.png",
|
||||
];
|
||||
|
||||
function LogoNamad() {
|
||||
return (
|
||||
<ul className="flex items-center gap-3">
|
||||
{Namads.map((src, idx) => (
|
||||
<li key={idx}>
|
||||
<Image
|
||||
alt="logo"
|
||||
width={48}
|
||||
height={48}
|
||||
src={src}
|
||||
/>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)
|
||||
return (
|
||||
<ul className="flex items-center gap-3">
|
||||
{Namads.map((src, idx) => (
|
||||
<li key={idx}>
|
||||
<Image alt="logo" width={48} height={48} src={src} />
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
);
|
||||
}
|
||||
|
||||
export default LogoNamad
|
||||
export default LogoNamad;
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
'use client';
|
||||
"use client";
|
||||
|
||||
import { footerL, footerR } from "@/constans";
|
||||
import Logo from "@/app/component/Logo";
|
||||
@@ -17,97 +17,106 @@ import HeadMenu from "./menu/HeadMenu";
|
||||
import ListMenu from "./menu/ListMenu";
|
||||
import { useState } from "react";
|
||||
|
||||
const socialMedias = [
|
||||
<Linkedin />,
|
||||
<Telegram />,
|
||||
<Whatsapp />,
|
||||
<Instagram />
|
||||
]
|
||||
const socialMedias = [<Linkedin />, <Telegram />, <Whatsapp />, <Instagram />];
|
||||
|
||||
const head = [
|
||||
{ icon: <LocationF />, text: 'جستجوی پزشک در شهر شما' },
|
||||
{ icon: <CalendarAddF />, text: 'نوبت گیری سریع و آسان' },
|
||||
{ icon: <StethoscopeF />, text: 'دشبورد اختصاصی برای پزشکان' }
|
||||
]
|
||||
{ icon: <LocationF />, text: "جستجوی پزشک در شهر شما" },
|
||||
{ icon: <CalendarAddF />, text: "نوبت گیری سریع و آسان" },
|
||||
{ icon: <StethoscopeF />, text: "دشبورد اختصاصی برای پزشکان" },
|
||||
];
|
||||
|
||||
function Footer() {
|
||||
const [openMenu, setOpenMenu] = useState({
|
||||
right: false,
|
||||
left: false,
|
||||
});
|
||||
|
||||
const [openMenu, setOpenMenu] = useState({
|
||||
right: false,
|
||||
left: false
|
||||
});
|
||||
const changeMenu = (name) =>
|
||||
setOpenMenu({ ...openMenu, [name]: !openMenu[name] });
|
||||
|
||||
const changeMenu = name => setOpenMenu({ ...openMenu, [name]: !openMenu[name] });
|
||||
|
||||
return (
|
||||
<div className="pb-[11px]">
|
||||
<div className="flex items-center justify-evenly gap-[12px]">
|
||||
{head.map((item, idx) => (
|
||||
<div
|
||||
key={idx}
|
||||
className="flex flex-col lg:flex-row items-center cursor-pointer justify-start gap-1 p-[6px] hover:transition-all
|
||||
return (
|
||||
<div className="pb-[11px]">
|
||||
<div className="flex items-center justify-evenly gap-[12px]">
|
||||
{head.map((item, idx) => (
|
||||
<div
|
||||
key={idx}
|
||||
className="flex flex-col lg:flex-row items-center cursor-pointer justify-start gap-1 p-[6px] hover:transition-all
|
||||
transition-all duration-300 hover:duration-300 rounded-[8px] border-solid border border-[#EFEFEF] bg-[#F7F7F7] hover:bg-none hover:border-[#FDBD9F]"
|
||||
>
|
||||
{item.icon}
|
||||
<p className="text-[#2F2F2F] text-center text-[16px] font-medium">{item.text}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<span className="h-px bg-[#D7D7D7] mb-[40px] mt-[48px] w-full block"></span>
|
||||
<div
|
||||
className="pb-[16px] sm:pb-[18px] md:pb-[19px] lg:pb-[21px]
|
||||
>
|
||||
{item.icon}
|
||||
<p className="text-[#2F2F2F] text-center text-[16px] font-medium">
|
||||
{item.text}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<span className="h-px bg-[#D7D7D7] mb-[40px] mt-[48px] w-full block"></span>
|
||||
<div
|
||||
className="pb-[16px] sm:pb-[18px] md:pb-[19px] lg:pb-[21px]
|
||||
flex flex-col gap-[16px] lg:gap-0 lg:flex-row items-start justify-between"
|
||||
>
|
||||
{/* Right */}
|
||||
<div className="w-full lg:w-fit flex gap-[12px] lg:gap-[30px] flex-col items-start">
|
||||
{/* Icon */}
|
||||
<Logo />
|
||||
<p
|
||||
className="w-full lg:w-fit text-[#616161] text-[14px] font-normal"
|
||||
>724 یک وبسایت نوبت دهی آنلاین می باشد که<br className="hidden lg:flex" /> بستری آسان برای پزشکان و بیماران فراهم کرده<br className="hidden lg:flex" /> است. </p>
|
||||
<div className="hidden lg:flex">
|
||||
<LogoNamad />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Center */}
|
||||
<div className="w-full lg:w-fit">
|
||||
<HeadMenu title={footerR[0]} isOpen={openMenu.right} name='right' changeMenu={changeMenu} />
|
||||
<ListMenu list={footerR} isOpen={openMenu.right} />
|
||||
</div>
|
||||
<div className="w-full lg:w-fit">
|
||||
<HeadMenu title={footerL[0]} isOpen={openMenu.left} name='left' changeMenu={changeMenu} />
|
||||
<ListMenu list={footerL} isOpen={openMenu.left} />
|
||||
</div>
|
||||
|
||||
{/* Left */}
|
||||
<div className="w-full lg:w-fit flex flex-row lg:flex-col items-center lg:items-start justify-center gap-[50px]">
|
||||
<p className="text-[#3B3B3B] w-fit text-[16px] after:hover:w-full after:transition-all after:hover:bg-[#F17732] font-bold pb-1.5 relative after:absolute after:right-0 after:h-0.5 after:bottom-0 after:w-0">
|
||||
همراه با ما باشید:
|
||||
</p>
|
||||
<ul className="flex items-center gap-[8px] sm:gap-[11px] md:gap-[13px] lg:gap-[15px]">
|
||||
{socialMedias.map((item, idx) => (
|
||||
<li
|
||||
key={idx}
|
||||
className="p-2.5 bg-[#EAECFA] hover-rotate-icon cursor-pointer rounded-full w-fit"
|
||||
>
|
||||
<Link
|
||||
href='/'
|
||||
className="min-h-fit"
|
||||
>
|
||||
{item}
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
<div className="flex lg:hidden justify-center w-full mt-2">
|
||||
<LogoNamad />
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-center text-[#7E7E7E] text-[12px] font-normal">کلیه حقوق وبسایت برای این شرکت می باشد.</p>
|
||||
>
|
||||
{/* Right */}
|
||||
<div className="w-full lg:w-fit flex gap-[12px] lg:gap-[30px] flex-col items-start">
|
||||
{/* Icon */}
|
||||
<Logo />
|
||||
<p className="w-full lg:w-fit text-[#616161] text-[14px] font-normal">
|
||||
724 یک وبسایت نوبت دهی آنلاین می باشد که
|
||||
<br className="hidden lg:flex" /> بستری آسان برای پزشکان و بیماران
|
||||
فراهم کرده
|
||||
<br className="hidden lg:flex" /> است.{" "}
|
||||
</p>
|
||||
<div className="hidden lg:flex">
|
||||
<LogoNamad />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
||||
{/* Center */}
|
||||
<div className="w-full lg:w-fit">
|
||||
<HeadMenu
|
||||
title={footerR[0]}
|
||||
isOpen={openMenu.right}
|
||||
name="right"
|
||||
changeMenu={changeMenu}
|
||||
/>
|
||||
<ListMenu list={footerR} isOpen={openMenu.right} />
|
||||
</div>
|
||||
<div className="w-full lg:w-fit">
|
||||
<HeadMenu
|
||||
title={footerL[0]}
|
||||
isOpen={openMenu.left}
|
||||
name="left"
|
||||
changeMenu={changeMenu}
|
||||
/>
|
||||
<ListMenu list={footerL} isOpen={openMenu.left} />
|
||||
</div>
|
||||
|
||||
{/* Left */}
|
||||
<div className="w-full lg:w-fit flex flex-row lg:flex-col items-center lg:items-start justify-center gap-[50px]">
|
||||
<p className="text-[#3B3B3B] w-fit text-[16px] after:hover:w-full after:transition-all after:hover:bg-[#F17732] font-bold pb-1.5 relative after:absolute after:right-0 after:h-0.5 after:bottom-0 after:w-0">
|
||||
همراه با ما باشید:
|
||||
</p>
|
||||
<ul className="flex items-center gap-[8px] sm:gap-[11px] md:gap-[13px] lg:gap-[15px]">
|
||||
{socialMedias.map((item, idx) => (
|
||||
<li
|
||||
key={idx}
|
||||
className="p-2.5 bg-[#EAECFA] hover-rotate-icon cursor-pointer rounded-full w-fit"
|
||||
>
|
||||
<Link href="/" className="min-h-fit">
|
||||
{item}
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
<div className="flex lg:hidden justify-center w-full mt-2">
|
||||
<LogoNamad />
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-center text-[#7E7E7E] text-[12px] font-normal">
|
||||
کلیه حقوق وبسایت برای این شرکت می باشد.
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default Footer
|
||||
export default Footer;
|
||||
|
||||
@@ -1,21 +1,23 @@
|
||||
import ArrowDownF from "@/components/icons/ArrowDownF"
|
||||
import { Button } from "@mui/material"
|
||||
import ArrowDownF from "@/components/icons/ArrowDownF";
|
||||
import { Button } from "@mui/material";
|
||||
|
||||
function HeadMenu({ title, name, isOpen, changeMenu }) {
|
||||
return (
|
||||
<Button
|
||||
className="!flex lg:!hidden !items-center !justify-between !w-full !py-[8px] !px-[4px] !border !border-solid !border-transparent !rounded-bl-none !rounded-br-none !border-b-[#E5E5E5]"
|
||||
onClick={() => changeMenu(name)}
|
||||
>
|
||||
<p className="text-[#262866] text-[14px] font-medium">{title}</p>
|
||||
<div className={`
|
||||
return (
|
||||
<Button
|
||||
className="!flex lg:!hidden !items-center !justify-between !w-full !py-[8px] !px-[4px] !border !border-solid !border-transparent !rounded-bl-none !rounded-br-none !border-b-[#E5E5E5]"
|
||||
onClick={() => changeMenu(name)}
|
||||
>
|
||||
<p className="text-[#262866] text-[14px] font-medium">{title}</p>
|
||||
<div
|
||||
className={`
|
||||
transition-all duration-500
|
||||
${isOpen ? 'rotate-180' : 'rotate-0'}
|
||||
`}>
|
||||
<ArrowDownF />
|
||||
</div>
|
||||
</Button>
|
||||
)
|
||||
${isOpen ? "rotate-180" : "rotate-0"}
|
||||
`}
|
||||
>
|
||||
<ArrowDownF />
|
||||
</div>
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
|
||||
export default HeadMenu
|
||||
export default HeadMenu;
|
||||
|
||||
@@ -1,25 +1,31 @@
|
||||
import React from 'react'
|
||||
import React from "react";
|
||||
|
||||
function ListMenu({ list, isOpen }) {
|
||||
return (
|
||||
<ul className={`
|
||||
<ul
|
||||
className={`
|
||||
mt-3 lg:mt-0 w-full lg:w-fit lg:!max-h-fit flex flex-col overflow-hidden transition-all duration-500 gap-3
|
||||
${isOpen ? 'max-h-[150px]' : 'max-h-0'}
|
||||
`}>
|
||||
${isOpen ? "max-h-[150px]" : "max-h-0"}
|
||||
`}
|
||||
>
|
||||
{list.map((item, idx) => (
|
||||
<li
|
||||
key={idx}
|
||||
className={`
|
||||
relative cursor-pointer after:absolute after:right-0 after:h-0.5 after:bottom-0 after:w-0
|
||||
${idx === 0 ?
|
||||
'hidden lg:flex text-[#3B3B3B] after:hover:w-full after:transition-all after:hover:bg-[#F17732] font-bold pb-1.5' :
|
||||
'text-[#616161] border-transparent font-normal'}
|
||||
${
|
||||
idx === 0
|
||||
? "hidden lg:flex text-[#3B3B3B] after:hover:w-full after:transition-all after:hover:bg-[#F17732] font-bold pb-1.5"
|
||||
: "text-[#616161] border-transparent font-normal"
|
||||
}
|
||||
text-[16px] w-fit
|
||||
`}
|
||||
>{item}</li>
|
||||
>
|
||||
{item}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
export default ListMenu
|
||||
export default ListMenu;
|
||||
|
||||
Reference in New Issue
Block a user