Skip to content

Commit 7c07b31

Browse files
✨ feat: enhance Features02 component with signup CTA
- Added a "Get Started for Free" call-to-action button to encourage user signups. - Improved section header and content layout for better user engagement and clarity. - Adjusted feature descriptions for a more concise and appealing presentation.
1 parent 46951c1 commit 7c07b31

1 file changed

Lines changed: 15 additions & 3 deletions

File tree

apps/web/components/features-02.tsx

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { useState } from "react";
44
import Image from "next/image";
55
import Illustration from "@/public/images/features-illustration-02.svg";
66
import FeaturesImage from "@/public/images/features-image.png";
7+
import Link from "next/link";
78

89
export default function Features02() {
910
const [category, setCategory] = useState<string>("1");
@@ -37,10 +38,18 @@ export default function Features02() {
3738
<div className="max-w-6xl mx-auto px-4 sm:px-6">
3839
<div className="py-12 md:py-20">
3940
{/* Section header */}
40-
<div className="max-w-3xl mx-auto text-center pb-12 md:pb-20">
41+
<div className="max-w-3xl mx-auto text-center pb-12">
4142
<h2 className="h2 font-hkgrotesk">
4243
Powerful Features for Every User
4344
</h2>
45+
<Link className="flex justify-center mt-8" href="/signup">
46+
<button className="relative inline-flex h-12 overflow-hidden rounded-full p-[1px] focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50">
47+
<span className="absolute inset-[-1000%] animate-[spin_2s_linear_infinite] bg-[conic-gradient(from_90deg_at_50%_50%,#E2CBFF_0%,#393BB2_50%,#E2CBFF_100%)]" />
48+
<span className="inline-flex h-full w-full cursor-pointer items-center justify-center rounded-full bg-slate-950 px-3 py-1 text-sm font-medium text-white backdrop-blur-3xl">
49+
Get Started for Free
50+
</span>
51+
</button>
52+
</Link>
4453
</div>
4554

4655
{/* Box */}
@@ -117,8 +126,11 @@ export default function Features02() {
117126
<h3 className="h3 font-hkgrotesk mb-2">Dark by Default</h3>
118127
<div className="text-lg text-slate-500">
119128
ScreenLink is dark by default, so you can focus on your
120-
work and <span className={"text-indigo-500"}>protect your eyes!</span> You can also switch to light
121-
mode if you prefer.
129+
work and{" "}
130+
<span className={"text-indigo-500"}>
131+
protect your eyes!
132+
</span>{" "}
133+
You can also switch to light mode if you prefer.
122134
</div>
123135
</div>
124136
</div>

0 commit comments

Comments
 (0)