AmirReza Jamali
e2a0df5fc4
This commit introduces several UI improvements to enhance user experience and visual appeal. On the contact page, a new heading "Unlock Your Growth Potential" and a descriptive subheading have been added above the form. This provides better context and a stronger call-to-action for users. In the footer, the location information now includes a flag icon for better visual identification. This was achieved by updating the `ContactInfo` component to accept an optional icon source. Additionally, various styling adjustments have been made for improved responsiveness and visual consistency across the homepage and footer.
237 lines
8.2 KiB
TypeScript
237 lines
8.2 KiB
TypeScript
import { Metadata } from "next";
|
|
import Image from "next/image";
|
|
import ApexChart from "./_components/ApexChart";
|
|
export const metadata: Metadata = {
|
|
title: "Opp lens - AI-Powered Tender Management for SMEs | Win More Tenders",
|
|
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: "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: "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: "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-800/10 p-10 rounded-[40px] h-fit mb-16">
|
|
<h2>
|
|
<span>$</span>
|
|
<span>12,345,678</span>
|
|
</h2>
|
|
<h2 className="capitalize">total tender amount you missed today</h2>
|
|
<ApexChart />
|
|
</div>
|
|
<div className="mr-8 -z-20">
|
|
<Image
|
|
className="-z-10 "
|
|
src="/mobile.svg"
|
|
width={300}
|
|
height={820}
|
|
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 ">
|
|
democratizing the world of tenders
|
|
</h1>
|
|
<p className="text-xs">
|
|
Opplens is your dedicated AI-powered partner, leveling the playing
|
|
field so you can win the public and private contracts you deserve.
|
|
Compete on your true strengths.
|
|
</p>
|
|
</hgroup>
|
|
<div className="flex justify-end">
|
|
<button className="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-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">
|
|
<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 md:w-3/4 m-auto">
|
|
<div>
|
|
<h2 className="font-bold text-4xl">The Opplens Advantage</h2>
|
|
</div>
|
|
<section className="flex flex-col gap-10 md:flex-row">
|
|
<div className="flex flex-col gap-7 md:flex-row 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 md:flex-row 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>
|
|
</>
|
|
);
|
|
}
|
|
|
|
function CenterFrame({
|
|
src,
|
|
title,
|
|
description,
|
|
alt,
|
|
}: {
|
|
src: string;
|
|
title: string;
|
|
description: string;
|
|
alt: string;
|
|
}) {
|
|
return (
|
|
<div className="bg-[#F7FAFF] border border-(--primary)/30 rounded-3xl my-4 py-10 px-6">
|
|
<Image
|
|
src={src}
|
|
alt={alt}
|
|
width={36}
|
|
height={36}
|
|
/>
|
|
<h3 className="text-2xl font-bold">{title}</h3>
|
|
<p className="text-gray-600">{description}</p>
|
|
</div>
|
|
);
|
|
}
|