54 lines
2.3 KiB
TypeScript
54 lines
2.3 KiB
TypeScript
import Link from "next/link";
|
|
|
|
export default function Home() {
|
|
return (
|
|
<div className="h-screen">
|
|
<nav className="p-4 mx-10 flex flex-row justify-between">
|
|
<div id="logo" className="flex flex-row gap-2 items-end">
|
|
<div className="text-action font-bold text-4xl font-mono">peroxy</div>
|
|
<span className="text-secondary font-mono font-bold">dev</span>
|
|
</div>
|
|
<div className="flex flex-row gap-10 items-center font-medium font-mono">
|
|
<Link href="/pidhsome">
|
|
<button className="px-10 py-1 rounded-sm bg-primary hover:bg-primary/50 transition-all duration-150 ease-out">
|
|
link 1
|
|
</button>
|
|
</Link>
|
|
<Link href="/pidhsome">
|
|
<button className="px-10 py-1 rounded-sm bg-primary hover:bg-primary/50 transition-all duration-150 ease-out">
|
|
link 2
|
|
</button>
|
|
</Link>
|
|
<Link href="/pidhsome">
|
|
<button className="px-10 py-1 rounded-sm bg-primary hover:bg-primary/50 transition-all duration-150 ease-out">
|
|
link 3
|
|
</button>
|
|
</Link>
|
|
</div>
|
|
</nav>
|
|
<main className="mx-10">
|
|
<div className="grid grid-cols-2 xs:grid-cols-1 mt-20">
|
|
<div className="bg-primary-dark p-10 rounded-lg flex flex-col justify-between h-96 w-2/3 xs:w-full text-lg text-primary-text/90">
|
|
<div>
|
|
<span className="font-bold text-xl text-primary-text">
|
|
Lorem ipsum dolor{" "}
|
|
</span>{" "}
|
|
sit amet consectetur adipisicing elit. Laboriosam ab quia quae
|
|
reiciendis. Nostrum corrupti laboriosam quae vero repudiandae
|
|
dolorem quos dolores laborum recusandae atque itaque illo autem
|
|
neque odit, in soluta sit alias necessitatibus fugit veniam sunt
|
|
at.
|
|
</div>
|
|
<button className="px-4 py-2 rounded-lg bg-primary hover:bg-primary/50 transition-all ease-out duration-150 font-bold w-fit">
|
|
Action
|
|
</button>
|
|
</div>
|
|
<div id="showcase" className="w-full h-96 bg-primary-text">
|
|
<div className="text-primary-dark m-auto w-fit">showcase</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
);
|
|
}
|