sosokker/B2D-Ventures
1
0
Fork 0
mirror of https://github.com/Sosokker/B2D-Ventures.git synced 2025-12-19 05:54:06 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

chore: Update Invest page with additional carousel and tab functionality

Browse Source
This commit is contained in:
THIS ONE IS A LITTLE BIT TRICKY KRUB 2024-08-31 16:27:54 +07:00
parent dfe72a55f0
commit be62c7e8a9
1 changed files with 19 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
src/app/invest/page.tsx
View File

@ -17,7 +17,7 @@ import { Button } from "@/components/ui/button";
export default function Invest() { export default function Invest() {
const [progress, setProgress] = useState(0); const [progress, setProgress] = useState(0);
const [tab, setTab] = useState(""); const [tab, setTab] = useState("Pitch");
const handleClick = (item: string) => { const handleClick = (item: string) => {
setTab(item); setTab(item);
}; };
@ -28,7 +28,7 @@ export default function Invest() {
}, []); }, []);
return ( return (
<div> <div>
<div className="w-[90%] h-[500px]-500 m-auto mt-12 bg-red-500"> <div className="w-[90%] h-[500px]-500 m-auto mt-12">
<div> <div>
<div className="flex"> <div className="flex">
<Image src="./logo.svg" alt="logo" width={50} height={50} /> <Image src="./logo.svg" alt="logo" width={50} height={50} />
@ -108,8 +108,9 @@ export default function Invest() {
</CarouselContent> </CarouselContent>
</Carousel> </Carousel>
</div> </div>
<div className="flex w-[90%] mt-5 m-auto"> {/* menu */}
<ul className="list-none flex gap-10"> <div className="flex w-[90%] mt-24 m-auto ml-32">
<ul className="list-none flex gap-10 text-xl ">
<li> <li>
<a <a
onClick={() => handleClick("Pitch")} onClick={() => handleClick("Pitch")}
@ -121,9 +122,7 @@ export default function Invest() {
<li> <li>
<a <a
onClick={() => handleClick("General Data")} onClick={() => handleClick("General Data")}
className={ className={tab === "General Data" ? "text-blue-600" : ""}
tab === "General Data" ? "text-blue-600" : ""
}
> >
General Data General Data
</a> </a>
@ -131,15 +130,25 @@ export default function Invest() {
<li> <li>
<a <a
onClick={() => handleClick("Updates")} onClick={() => handleClick("Updates")}
className={ className={tab === "Updates" ? "text-blue-600" : ""}
tab === "Updates" ? "text-blue-600" : ""
}
> >
Updates Updates
</a> </a>
</li> </li>
</ul> </ul>
</div> </div>
<hr className="mt-2" />
{/* Card section */}
<div className="flex w-full mt-10">
{/* Cards */}
<Card className="m-auto border-slate-800 w-3/4 p-6">
<CardContent>
<Card>
<CardContent>{tab}</CardContent>
</Card>
</CardContent>
</Card>
</div>
</div> </div>
); );
} }