ForFarmTeam/ForFarm
1
0
Fork 0
mirror of https://github.com/ForFarmTeam/ForFarm.git synced 2025-12-19 22:14:08 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: update Signin page layout and adjust background image positioning

Browse Source
This commit is contained in:
THIS ONE IS A LITTLE BIT TRICKY KRUB 2025-02-12 18:09:13 +07:00
parent f080a820f8
commit 0aec783d24
2 changed files with 16 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
frontend/app/signin/page.tsx
View File

@ -9,28 +9,31 @@ import Image from "next/image";
export default function Signin() { export default function Signin() {
return ( return (
<div> <div>
<div className="grid grid-cols-[1.25fr_1fr] gap-0 h-screen overflow-hidden"> <div className="grid grid-cols-[1.3fr_1.2fr] gap-0 h-screen overflow-hidden">
<div className="flex justify-center"> <div className="flex bg-[url('/plant-background.jpeg')] bg-cover bg-center">
<div className="flex items-center"> {/* <div className="flex flex-col gap-y-10 mt-40 ml-40">
<h1 className="text-5xl">Welcome back!</h1>
<p>Log in to personalize your planting adventure!</p>
</div> */}
{/* water pot and dripping animation */}
{/* <div className="absolute items-center mt-96 ">
<Image <Image
src="/water-pot.png" src="/water-pot.png"
alt="Water Pot" alt="Water Pot"
width={500} width={300}
height={500} height={300}
className=" ml-72"
/> />
<div className="absolute top-[500px] left-[750px] overflow-hidden"> <div className="absolute top-[150px] left-[560px] overflow-hidden">
<WaterDrop /> <WaterDrop />
</div> </div>
<div className="absolute top-[500px] left-[720px] overflow-hidden"> </div> */}
<WaterDrop />
</div>
</div>
<div></div> <div></div>
</div> </div>
<div className="flex justify-center items-center "> <div className="flex justify-center items-center ">
{/* login box */} {/* login box */}
<div className="w-[560px] h-[600px] bg-yellow-200"> <div className="w-[560px] h-[600px]">
<div className="flex flex-col gap-5 justify-center items-center"> <div className="flex flex-col gap-5 justify-center items-center">
<h1 className="text-4xl mt-5 font-semibold">Log In</h1> <h1 className="text-4xl mt-5 font-semibold">Log In</h1>
<div className="flex whitespace-nowrap gap-x-2"> <div className="flex whitespace-nowrap gap-x-2">
@ -51,7 +54,7 @@ export default function Signin() {
width={35} width={35}
height={35} height={35}
className="object-contain" className="object-contain"
></Image> />
</div> </div>
</div> </div>

BIN
frontend/public/plant-background.jpeg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 716 KiB