AmirReza Jamali
71094f6c86
This commit refactors the contact form for better reusability and moves it from the global footer to a dedicated section on the homepage. Additionally, it enhances the user experience on the 404 page. Key changes: - The `ContactUsForm` component is now configurable with props for grid layout (`columnsPerRow`) and button text, making it more versatile. - The contact form has been removed from the shared footer in the main layout and is now explicitly included only on the homepage. - The 404 "Not Found" page has been updated to include a direct link to the homepage for easier navigation. - Minor style adjustments were made to the 404 page layout and input field padding for improved visual consistency.
229 lines
8.4 KiB
TypeScript
229 lines
8.4 KiB
TypeScript
import ApexChart from "@/app/_components/ApexChart";
|
|
import { Metadata } from "next";
|
|
import Image from "next/image";
|
|
|
|
export const metadata: Metadata = {
|
|
title: "Opp lens - Marketing",
|
|
description:
|
|
"Automated tender management platform for SMEs. Find tailored tenders, automate document handling, and get real-time alerts. Win more opportunities with less effort.",
|
|
keywords:
|
|
"tender management, AI tender search, SME tenders, public procurement, automated bidding, tender alerts",
|
|
authors: [{ name: "PBL Partners AB" }],
|
|
openGraph: {
|
|
title: "Opp lens - AI-Powered Tender Management",
|
|
description: "Win more tenders automatically with our AI-powered platform",
|
|
type: "website",
|
|
locale: "en_US",
|
|
siteName: "Opp lens",
|
|
},
|
|
icons: {
|
|
icon: "/fav-icon.svg",
|
|
},
|
|
};
|
|
|
|
export default function Home() {
|
|
const centerFrames = [
|
|
{
|
|
src: "/magnifier.svg",
|
|
title: "1. Discover with AI",
|
|
alt: "Magnifier",
|
|
description:
|
|
"Our intelligent platform scours thousands of sources to find the perfect, most relevant tender opportunities for your specific business and expertise",
|
|
},
|
|
{
|
|
src: "/clipboard.svg",
|
|
title: "2. Prepare with Experts",
|
|
alt: "Clipboard",
|
|
description:
|
|
"Gain access to expert support and powerful tools to craft compelling, competitive, and high-quality bids that stand out from the competition.",
|
|
},
|
|
{
|
|
src: "/thumbs-up.svg",
|
|
title: "3. Win with a Partner",
|
|
alt: "thumbs-up",
|
|
description:
|
|
"We operate on a partnership model. We only succeed when you win. This aligns our goals and makes us a true partner in your growth.",
|
|
},
|
|
];
|
|
return (
|
|
<>
|
|
<section className="block md:flex justify-around items-center">
|
|
<div className="flex gap-4 w-full md:w-1/2 font-bold text-4xl text-center flex-col bg-gray-400/10 p-10 rounded-[40px] h-fit mb-16 backdrop-blur-2xl">
|
|
<div className="flex flex-col gap-8">
|
|
<h2>
|
|
<span>$</span>
|
|
<span>12,345,678</span>
|
|
</h2>
|
|
<h2 className="capitalize text-2xl font-bold md:text-3xl">
|
|
total tender amount you missed today
|
|
</h2>
|
|
</div>
|
|
<ApexChart />
|
|
</div>
|
|
<div className="m-auto w-xs md:m-0 md:w-auto -z-20 relative flex justify-center h-[650px] md:h-[750px]">
|
|
<Image
|
|
src={"/dynamic-island.svg"}
|
|
alt="dynamic island"
|
|
width={75}
|
|
height={22}
|
|
className="absolute top-4 left-1/2 -translate-x-1/2"
|
|
/>
|
|
<Image
|
|
className="-z-10 border-8 border-black rounded-4xl overflow-hidden h-full w-full"
|
|
src="/mobile.gif"
|
|
width={300}
|
|
height={920}
|
|
loading="lazy"
|
|
alt="phone"
|
|
/>
|
|
</div>
|
|
</section>
|
|
<section className="text-left flex flex-col gap-6 bg-gradient-to-b from-[#011132] to-[#012B80] text-white rounded-[56px] relative p-6 md:p-14 -mt-16 z-20 md:ml-28">
|
|
<hgroup>
|
|
<h1 className="capitalize font-extrabold text-5xl mb-6">
|
|
democratizing the world of tenders
|
|
</h1>
|
|
<p className="text-[16px] text-[#dadada]">
|
|
Opplens is your dedicated AI-powered partner, leveling the playing
|
|
field so you can win the public and private contracts you deserve.
|
|
<br />
|
|
Compete on your true strengths.
|
|
</p>
|
|
</hgroup>
|
|
<div className="flex justify-end">
|
|
<button className="w-full md:w-fit capitalize bg-(--primary) rounded-4xl py-4 px-6">
|
|
Get early access
|
|
</button>
|
|
</div>
|
|
</section>
|
|
<article className="mt-40">
|
|
<hgroup>
|
|
<h4 className="capitalize font-bold text-2xl md:text-4xl">
|
|
your in-house tender department, powered by
|
|
<span className="uppercase">ai</span>
|
|
</h4>
|
|
<small className="text-gray-600 mt-3">
|
|
Opplens is the end-to-end solution that gives you the power to
|
|
compete and win.
|
|
</small>
|
|
</hgroup>
|
|
</article>
|
|
<section className="flex flex-col gap-4 md:flex-row">
|
|
{centerFrames.map((frame, index) => (
|
|
<article
|
|
key={frame.description}
|
|
className="bg-[#F7FAFF] border border-(--primary)/30 rounded-3xl my-4 py-10 px-6 flex flex-col gap-5">
|
|
<Image
|
|
src={frame.src}
|
|
alt={frame.alt}
|
|
width={36}
|
|
height={36}
|
|
/>
|
|
<h3 className="text-2xl font-bold">{frame.title}</h3>
|
|
<p className="text-gray-600">{frame.description}</p>
|
|
</article>
|
|
))}
|
|
</section>
|
|
<section className="mt-36 bg-[#F7FAFF] px-4 py-6 rounded-4xl flex flex-col gap-9 md:p-16">
|
|
<div className="flex flex-col gap-4">
|
|
<h2 className=" font-bold text-4xl">
|
|
Tired of Complex Tenders & Lost Opportunities?
|
|
</h2>
|
|
<p className="font-normal text-sm">
|
|
The procurement market is tough for SMEs. We get it. You're facing
|
|
an uphill battle.
|
|
</p>
|
|
</div>
|
|
<ul className="flex flex-col gap-4 md:flex-row md:justify-between">
|
|
<li className="flex flex-col gap-4 md:w-80">
|
|
<div className="p-4">
|
|
<Image
|
|
src={"/clock.svg"}
|
|
alt="clock icon"
|
|
width={36}
|
|
height={36}
|
|
/>
|
|
</div>
|
|
<h2 className="font-bold">Resource Drain</h2>
|
|
<p>
|
|
Lacking the time, dedicated staff, and expertise to constantly
|
|
monitor the market and prepare high-quality bids.
|
|
</p>
|
|
</li>
|
|
<li className="flex flex-col gap-4 md:w-80">
|
|
<div className="p-4">
|
|
<Image
|
|
src={"/clipboard.svg"}
|
|
alt="clipboard icon"
|
|
width={36}
|
|
height={36}
|
|
/>
|
|
</div>
|
|
<h2 className="font-bold">Overwhelming Complexity</h2>
|
|
<p>
|
|
Navigating complex requirements and processes designed for large
|
|
corporations with dedicated tender departments.
|
|
</p>
|
|
</li>
|
|
<li className="flex flex-col gap-4 md:w-80">
|
|
<div className="p-4">
|
|
<Image
|
|
src={"/arrow-up.svg"}
|
|
alt="arrow-up icon"
|
|
width={36}
|
|
height={36}
|
|
/>
|
|
</div>
|
|
<h2 className="font-bold">Low Win Rates</h2>
|
|
<p>
|
|
Did you know 68% of SMEs in Sweden rarely or never win public
|
|
tenders? It's time to change that.
|
|
</p>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section className="flex flex-col mt-36 gap-10 px-2 md:w-3/4 m-auto">
|
|
<div>
|
|
<h2 className="font-bold text-2xl md:text-4xl">
|
|
The Opplens Advantage
|
|
</h2>
|
|
</div>
|
|
<section className="flex flex-col gap-10 md:flex-row">
|
|
<div className="flex flex-col gap-7 bg-[#FFF7EB] p-10 rounded-3xl md:pb-20">
|
|
<Image
|
|
src={"people.svg"}
|
|
width={48}
|
|
height={48}
|
|
alt="people icon"
|
|
/>
|
|
<div className="flex flex-col gap-4">
|
|
<h2 className="font-bold text-xl">A True Partnership Model</h2>
|
|
<p>
|
|
Lower your risk with our performance-based options. Our success
|
|
is directly tied to yours, making us a dedicated partner
|
|
invested in your growth, not just a software provider.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div className="flex flex-col gap-7 bg-[#E5EFFF] p-10 rounded-3xl md:pb-20">
|
|
<Image
|
|
src={"shield-tick.svg"}
|
|
width={48}
|
|
height={48}
|
|
alt="shield icon"
|
|
/>
|
|
<div className="flex flex-col gap-4">
|
|
<h2 className="font-bold text-xl">Unmatched Data Security</h2>
|
|
<p>
|
|
Your business data is critical. Our unique on premise AI engine
|
|
ensures your information remains 100% private and secure, unlike
|
|
cloud based services. Fully GDPR compliant by design.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</section>
|
|
</>
|
|
);
|
|
}
|