updated homepage

This commit is contained in:
Juthatip McDevitt 2024-05-13 13:32:50 -05:00
parent 8d9b4e6603
commit eb83d21e23
7 changed files with 8 additions and 9 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 91 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 719 KiB

View file

@ -7,7 +7,6 @@ html{
overflow-x: hidden;
}
body{
background-color: #FDE2DE;
overflow-x: hidden;
}
.text-stroke-3 {

View file

@ -36,11 +36,11 @@ const Header = () => {
<Link href='' className="">contact</Link>
</ul>
</div>
<div className='mt-5'>
<div className='mt-3'>
<div className="flex justify-end md:justify-center items-center w-full text-white">
<ul className="hidden md:flex flex-row gap-5 text-xs font-semibold uppercase text-[#95743D]">
<ul className="hidden md:flex flex-row gap-5 text-xs font-semibold uppercase text-[#95743D] items-center">
<Link href='/' className="">Login</Link>
<Link href='/register' className="">Register</Link>
<Link href='/register' className="px-2 py-2 border border-[#DCA0AE] rounded-full hover:bg-[#DCA0AE] hover:text-white duration-300">Register</Link>
</ul>
<div onClick={() => setNav(!nav)} className="cursor-pointer pr-4 z-20 text-[#95743D] md:hidden "> {nav ? <IoCloseOutline size={30} /> : <HiBars2 size={30} />}</div>
{nav && (

View file

@ -1,13 +1,13 @@
import React from 'react'
import Image from 'next/image'
const Hero = () => {
return (
<div className='w-full h-screen flex flex-col gap-10 md:gap-20 relative'>
<div className='w-full h-full lg:h-screen flex flex-col relative'>
<p className='text-center mt-20 uppercase text-4xl sm:text-6xl md:text-[90px] lg:text-[125px] xl:text-[150px] leading-none text-black font-extrabold tracking-tighter drop-shadow-[0_3px_3px_rgba(45,45,45,0.5)] px-5'>It's donut time</p>
<Image src='/donut-bg.jpg' width={1600} height={1600} alt='home-hero' className='w-full md:h-full object-cover -mt-5 sm:-mt-10 -z-10'/>
</div>
)
}

View file

@ -9,7 +9,7 @@ const TextAnimation = () => {
};
return (
<div className='w-full h-[30vh] md:h-[40vh] flex flex-col gap-10 md:gap-20 relative bg-[#68D2E8] rounded-t-3xl'>
<div className='w-full h-[30vh] md:h-[40vh] flex flex-col gap-10 md:gap-20 relative bg-[#68D2E8] rounded-t-3xl -mt-5'>
<div className='mt-10 w-[100vw] max-w-[100%] overflow-x-hidden'>
<motion.div className='absolute whitespace-nowrap' variants={textAnimation } animate="animate">
<p className='mt-[30px] text-5xl md:text-9xl text-white font-bold tracking-wider uppercase overflow-hidden'>Donuts worry about things! Donuts worry about things! Donuts worry about things!</p>