feat: redesign homepage and early access page
This commit introduces a comprehensive redesign of the homepage and refactors the "Contact Us" page into a dedicated "Get Early Access" page.
Key changes include:
- **Homepage:** A complete overhaul with new sections, including a hero, feature highlights, and a problem/solution section to better communicate the product's value proposition.
- **Early Access Page:** The former "Contact Us" page is now repurposed for early access sign-ups, with updated copy and a more focused call-to-action.
- **Component Refactoring:**
- The `InputGroup` component has been extracted from the form into a reusable component (`app/_components/InputGroup.tsx`) for better modularity.
- The `CenterFrame` component has been updated to support images and new props (`src`, `title`, `alt`) to fit the new homepage design.
- **Layout Improvements:** The early access form now uses a two-column grid layout on larger screens for improved user experience.
This commit is contained in:
+2
-19
@@ -2,25 +2,8 @@ import ContactUsForm from "./form";
|
||||
|
||||
const ContactUs = () => {
|
||||
return (
|
||||
<div className="flex flex-col items-center mt-20">
|
||||
<div className="flex flex-col items-center mb-16">
|
||||
<h6 className="text-lg w-fit font-semibold text-(--primary) bg-(--primary)/20 opacity-80 p-2 rounded-full">
|
||||
Contact Us
|
||||
</h6>
|
||||
|
||||
<h1 className="font-extrabold my-6 text-4xl">Let's get in touch</h1>
|
||||
<div className=" text-center block md:flex gap-1">
|
||||
<p className="font-extralight text-xl">
|
||||
Or just reach out manually to
|
||||
</p>
|
||||
<a
|
||||
href="mailto:info@opples.com"
|
||||
className="text-(--primary) font-extralight text-xl">
|
||||
info@opplens.com
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<section className="border border-gray-300 rounded-4xl w-10/12 flex flex-col items-center">
|
||||
<div className="flex flex-col items-center mt-20 px-4">
|
||||
<section className="border border-gray-300 rounded-4xl w-full max-w-4xl flex flex-col items-center bg-white">
|
||||
<ContactUsForm />
|
||||
</section>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user