WIP hero section with retro style

This commit is contained in:
Faisal Amir 2023-12-05 14:43:11 +07:00
parent ede33db73d
commit 6ee954fb4f
2 changed files with 27 additions and 28 deletions

View File

@ -20,38 +20,37 @@ export default function Home() {
description="Jan is a ChatGPT-alternative that runs on your own computer, with a local API server." description="Jan is a ChatGPT-alternative that runs on your own computer, with a local API server."
> >
<main> <main>
<div className="container"> <div className="grid grid-cols-1 lg:grid-cols-12 -mt-1 gap-8 items-center relative">
<div className="grid grid-cols-1 lg:grid-cols-12 mt-4 gap-8 items-center relative"> <div className="col-span-full lg:col-start-2 lg:col-span-5 lg:text-left text-center relative z-10">
<div className="col-span-full lg:col-span-5 lg:text-left text-center relative z-10"> <h1 className="text-7xl font-semibold leading-tight lg:leading-tight">
<h1 className="bg-gradient-to-b dark:from-white from-black to-gray-700 dark:to-gray-400 bg-clip-text text-6xl font-black leading-tight text-transparent dark:text-transparent lg:leading-tight"> Bringing AI to <br /> your Desktop
Own your AI
</h1> </h1>
<p className="text-2xl mt-1"> <p className="text-2xl mt-3">
Jan is an open-source alternative to ChatGPT that runs on your Open-source ChatGPT alternative that runs 100% offline on your
own computer. computer.
</p> </p>
<div className="mt-8"> <div className="mt-8">
<SocialButton /> <SocialButton />
</div> </div>
</div> </div>
<div className="col-span-full lg:col-span-7">
<div className="col-span-full lg:col-span-6">
<div className="relative text-center"> <div className="relative text-center">
<ThemedImage <ThemedImage
className="rounded-xl w-full lg:w-10/12 border border-gray-200 dark:border-gray-800" className="w-full object-cover mr-auto"
alt="App screenshots" alt="App screenshots"
sources={{ sources={{
light: useBaseUrl( light: useBaseUrl(
"/img/homepage/app-base-screen-light.png" "/img/homepage/app-base-screen-light.png"
), ),
dark: useBaseUrl( dark: useBaseUrl("/img/homepage/app-base-screen-dark.png"),
"/img/homepage/app-base-screen-dark.png"
),
}} }}
/> />
</div> </div>
</div> </div>
</div> </div>
</div> {/* <div className="container">
</div> */}
{/* <div className="bg-gray-50 dark:bg-[#09090B]/20 border-y border-gray-00 dark:border-gray-800 mt-10 py-10"> {/* <div className="bg-gray-50 dark:bg-[#09090B]/20 border-y border-gray-00 dark:border-gray-800 mt-10 py-10">
<div className="container"> <div className="container">

Binary file not shown.

Before

Width:  |  Height:  |  Size: 188 KiB

After

Width:  |  Height:  |  Size: 297 KiB