basic style & add mui and aos & banner style

This commit is contained in:
Ehsan
2024-05-16 03:44:17 +03:30
parent 4d71481738
commit ae1c7dd70c
11 changed files with 270 additions and 71 deletions
+28 -1
View File
@@ -1,6 +1,33 @@
function HomePage() {
return (
<div>HomePage</div>
<div className="bg-banner-home pt-[120px] min-h-screen !bg-center !bg-no-repeat !bg-cover">
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
ppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp
</div>
)
}
+33 -29
View File
@@ -5,36 +5,40 @@ import Link from "next/link";
function Header() {
return (
<div className="bg-[#FAFAFA] rounded-lg shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)] h-20 px-4 py-8 flex justify-between items-center">
<div className="flex items-center justify-start gap-[5px]">
<Image
src='/assets/images/logo.png'
width={30}
height={30}
alt="logo"
/>
<p className="text-[#526CAC] text-[16px] font-bold font-kalame">نوبت ۷۲۴</p>
</div>
<ul className="flex items-center justify-center gap-10">
{listNav.map(nav => (
<li
key={nav.id}
>
<Link
href={nav.link}
className={`
${nav.id === 1 ? 'text-[#526CAC]' : 'text-[#525252]'}
text-[16px] font-bold
`}
<div
className="bg-[#FAFAFA] rounded-lg shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)] w-[85%] mx-auto"
>
<div className="h-20 px-4 py-8 flex overflow-hidden justify-between items-center flex-nowrap">
<div className="flex items-center justify-start gap-[5px]">
<Image
src='/assets/images/logo.png'
width={30}
height={30}
alt="logo"
/>
<p className="text-[#526CAC] text-[16px] font-bold font-kalame">نوبت ۷۲۴</p>
</div>
<ul className="flex items-center justify-center gap-10">
{listNav.map(nav => (
<li
key={nav.id}
>
{nav.name}
</Link>
</li>
))}
</ul>
<Button>
ورود | ثبت نام
</Button>
<Link
href={nav.link}
className={`
${nav.id === 1 ? 'text-[#526CAC]' : 'text-[#525252]'}
text-[16px] font-medium
`}
>
{nav.name}
</Link>
</li>
))}
</ul>
<Button variant="contained" color="primary">
ورود | ثبت نام
</Button>
</div>
</div>
)
}
+1 -1
View File
@@ -8,7 +8,7 @@ function Layout({ children, title }) {
<title>{`${title} | نوبت ۷۲۴`}</title>
</head> */}
<main className="w-full min-h-screen">
<header className="sticky top-0 w-full z-[60]">
<header className="w-full fixed top-10 right-0">
<Header />
</header>
<section>