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

change style menu home & responsive head and footer home & list doctors

Browse Source
This commit is contained in:
Ehsan
2024-08-11 06:46:35 +03:30
parent 0afe0a39b0
commit 697bde2f5d
13 changed files with 98 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/layout/header/Header.js → components/layout/header/index.js
+8 -4
View File
@@ -18,19 +18,23 @@ function Header({ name }) {
<div
className="bg-[#FAFAFA] rounded-lg shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)] w-full mx-auto"
>
<div className="h-20 px-4 py-8 flex overflow-hidden justify-between items-center flex-nowrap">
<div className={`
h-20 px-4 py-8 flex transition-all duration-500 overflow-hidden justify-between items-center flex-nowrap
${isActive ? '!pr-0' : '!p-4'}
`}>
<div className="">
<BgGray
isActive={isActive}
setIsActive={setIsActive}
/>
<Col
name={name}
isActive={isActive}
setIsActive={setIsActive}
/>
<div className="relative flex flex-row-reverse gap-2">
<Logo />
<div className="flex lg:hidden">
<div className="flex lg:hidden z-20">
<ButtonMenu
isActive={isActive}
setIsActive={setIsActive}
@@ -39,7 +43,7 @@ function Header({ name }) {
</div>
</div>
</div>
<Row />
<Row name={name} />
<Link href='/signin'>
<Button
className="!hidden lg:!flex"
@@ -49,7 +53,7 @@ function Header({ name }) {
ورود | ثبت نام
</Button>
<Button
className={`!flex lg:!hidden !p-2 !rounded-full transition-all duration-500 ${isActive ? '!bg-[#9D9D9D]' : '!bg-[#EFEFEF]'}`}
className={`!flex lg:!hidden !p-2 !rounded-full transition-all duration-500 !bg-[#EFEFEF]`}
variant="text"
color="primary"
>
components/layout/header/list/Row.js
+1 -1
View File
@@ -2,7 +2,7 @@ import { listNav } from "@/constans";
import { isActiveURL } from "@/helper";
import Link from "next/link";
function Row() {
function Row({ name }) {
return (
<ul className="hidden lg:flex items-center justify-center gap-[40px]">
{listNav.map(nav => (
components/layout/header/list/col/BgGray.js
+1 -1
View File
@@ -4,7 +4,7 @@ function BgGray({ isActive, setIsActive }) {
onClick={() => setIsActive(false)}
className={`
${isActive ? 'bg-[#232323] opacity-40 flex' : 'bg-transparent opacity-40 hidden'}
absolute cursor-pointer transition-all duration-500 left-0 top-[-12px] sm:top-[-21px] md:top-[-30px] lg:top-[-40px] w-screen h-screen
absolute z-[5] cursor-pointer transition-all duration-500 left-0 top-[-12px] sm:top-[-21px] md:top-[-30px] lg:top-[-40px] w-screen h-screen
`}
></div>
)
components/layout/header/list/col/index.js
+3 -3
View File
@@ -3,7 +3,7 @@ import { Button } from "@mui/material";
import Link from "next/link";
import { isActiveURL } from "@/helper";
function Col({ isActive, setIsActive }) {
function Col({ isActive, setIsActive, name }) {
return (
<div className="flex lg:hidden">
{/* <Button variant="text" className="!p-0.5">
@@ -12,10 +12,10 @@ function Col({ isActive, setIsActive }) {
<div className={`
fixed pb-[31px] pt-[64px] pl-[24px] padding-responsive top-[-12px] sm:top-[-21px]
md:top-[-30px] lg:top-[-40px] w-[85%] h-screen bg-[#FAFAFA] transition-all duration-500
md:top-[-30px] lg:top-[-40px] w-[85%] z-10 h-screen bg-[#FAFAFA] transition-all duration-500
${isActive ? 'right-0' : '-right-[85%]'}
`}>
<ul className="flex flex-col items-start justify-center gap-[30px] mt-[78px] mr-[16px]">
<ul className="flex flex-col items-start justify-center gap-[30px] mt-[78px]">
{listNav.map(nav => (
<li
key={nav.id}