mirror of
https://github.com/RooVetGit/Roo-Code.git
synced 2026-09-05 08:10:14 +00:00
feat: add vibrant colors to marketing homepage
- Add gradient text to hero heading (violet-blue-fuchsia) - Make CTA buttons use colorful gradients with shadow accents - Add unique gradient icon badges to pillar cards (violet, blue, amber, emerald) - Add colorful hover glow effects to cards across all sections - Update CSS variables to use violet-based primary/accent colors - Add gradient text highlights to section headings - Make testimonial stars amber/gold - Add colorful background glows to sections - Add violet hover borders to FAQ items and testimonial cards
This commit is contained in:
Roo Code
parent
aca95ccd04
commit
4bcb7a29b5
8 changed files with 102 additions and 59 deletions
|
|
@ -4,24 +4,24 @@
|
|||
|
||||
:root {
|
||||
--background: 0 0% 100%;
|
||||
--foreground: 0 0% 3.9%;
|
||||
--foreground: 240 10% 3.9%;
|
||||
--card: 0 0% 100%;
|
||||
--card-foreground: 0 0% 3.9%;
|
||||
--card-foreground: 240 10% 3.9%;
|
||||
--popover: 0 0% 100%;
|
||||
--popover-foreground: 0 0% 3.9%;
|
||||
--primary: 0 0% 9%;
|
||||
--primary-foreground: 0 0% 98%;
|
||||
--secondary: 0 0% 96.1%;
|
||||
--secondary-foreground: 0 0% 9%;
|
||||
--muted: 0 0% 96.1%;
|
||||
--muted-foreground: 0 0% 45.1%;
|
||||
--accent: 0 0% 96.1%;
|
||||
--accent-foreground: 0 0% 9%;
|
||||
--popover-foreground: 240 10% 3.9%;
|
||||
--primary: 262 83% 58%;
|
||||
--primary-foreground: 0 0% 100%;
|
||||
--secondary: 260 10% 96%;
|
||||
--secondary-foreground: 262 83% 58%;
|
||||
--muted: 260 10% 96%;
|
||||
--muted-foreground: 240 5% 45%;
|
||||
--accent: 262 60% 95%;
|
||||
--accent-foreground: 262 83% 45%;
|
||||
--destructive: 0 84.2% 60.2%;
|
||||
--destructive-foreground: 0 0% 98%;
|
||||
--border: 0 0% 89.8%;
|
||||
--input: 0 0% 89.8%;
|
||||
--ring: 0 0% 3.9%;
|
||||
--border: 260 10% 90%;
|
||||
--input: 260 10% 90%;
|
||||
--ring: 262 83% 58%;
|
||||
--radius: 0.5rem;
|
||||
|
||||
--chart-1: 0 100% 50%;
|
||||
|
|
@ -41,25 +41,25 @@
|
|||
}
|
||||
|
||||
.dark {
|
||||
--background: 0 0% 0%;
|
||||
--background: 240 10% 3.9%;
|
||||
--foreground: 0 0% 98%;
|
||||
--card: 0 0% 3.9%;
|
||||
--card: 240 10% 5%;
|
||||
--card-foreground: 0 0% 98%;
|
||||
--popover: 0 0% 3.9%;
|
||||
--popover: 240 10% 5%;
|
||||
--popover-foreground: 0 0% 98%;
|
||||
--primary: 0 0% 98%;
|
||||
--primary-foreground: 0 0% 9%;
|
||||
--secondary: 0 0% 14.9%;
|
||||
--primary: 262 83% 65%;
|
||||
--primary-foreground: 0 0% 100%;
|
||||
--secondary: 260 10% 14%;
|
||||
--secondary-foreground: 0 0% 98%;
|
||||
--muted: 0 0% 14.9%;
|
||||
--muted-foreground: 0 0% 63.9%;
|
||||
--accent: 0 0% 14.9%;
|
||||
--accent-foreground: 0 0% 98%;
|
||||
--muted: 260 10% 14%;
|
||||
--muted-foreground: 240 5% 64%;
|
||||
--accent: 262 40% 18%;
|
||||
--accent-foreground: 262 83% 80%;
|
||||
--destructive: 0 62.8% 30.6%;
|
||||
--destructive-foreground: 0 0% 98%;
|
||||
--border: 0 0% 14.9%;
|
||||
--input: 0 0% 14.9%;
|
||||
--ring: 0 0% 83.1%;
|
||||
--border: 260 10% 16%;
|
||||
--input: 260 10% 16%;
|
||||
--ring: 262 83% 65%;
|
||||
}
|
||||
|
||||
@layer base {
|
||||
|
|
|
|||
|
|
@ -21,11 +21,13 @@ export default async function Home() {
|
|||
<StructuredData />
|
||||
<section className="relative flex flex-col items-center overflow-hidden pt-20 pb-12 md:pt-32 md:pb-16">
|
||||
<div className="absolute inset-y-0 left-1/2 h-full w-full max-w-[1200px] -translate-x-1/2 z-1">
|
||||
<div className="absolute left-1/2 top-1/2 h-[400px] w-full -translate-x-1/2 -translate-y-1/2 rounded-full bg-violet-500/10 dark:bg-violet-700/20 blur-[140px]" />
|
||||
<div className="absolute left-1/2 top-1/2 h-[400px] w-full -translate-x-1/2 -translate-y-1/2 rounded-full bg-gradient-to-r from-violet-500/15 via-blue-500/15 to-fuchsia-500/15 dark:from-violet-700/25 dark:via-blue-700/25 dark:to-fuchsia-700/25 blur-[140px]" />
|
||||
</div>
|
||||
<div className="container relative z-10 mx-auto px-4 sm:px-6 lg:px-8 flex flex-col items-center text-center">
|
||||
<h1 className="text-3xl md:text-4xl font-bold tracking-tight text-foreground max-w-4xl mb-6">
|
||||
Your AI Software Engineering Team is here.
|
||||
<span className="bg-gradient-to-r from-violet-600 via-blue-600 to-fuchsia-600 dark:from-violet-400 dark:via-blue-400 dark:to-fuchsia-400 bg-clip-text text-transparent">
|
||||
Your AI Software Engineering Team is here.
|
||||
</span>
|
||||
<br />
|
||||
<span className="text-muted-foreground">Interactive in the IDE, autonomous in the cloud.</span>
|
||||
</h1>
|
||||
|
|
@ -39,7 +41,9 @@ export default async function Home() {
|
|||
</div>
|
||||
<div className="flex flex-col sm:flex-row gap-4 mb-16">
|
||||
<div className="flex flex-col items-center gap-2">
|
||||
<Button size="xl" className="w-full">
|
||||
<Button
|
||||
size="xl"
|
||||
className="w-full bg-gradient-to-r from-blue-600 to-violet-600 hover:from-blue-500 hover:to-violet-500 text-white shadow-lg shadow-blue-500/25">
|
||||
<a
|
||||
href={EXTERNAL_LINKS.MARKETPLACE}
|
||||
target="_blank"
|
||||
|
|
@ -53,7 +57,9 @@ export default async function Home() {
|
|||
</div>
|
||||
|
||||
<div className="flex flex-col items-center gap-2">
|
||||
<Button size="xl" className="w-full">
|
||||
<Button
|
||||
size="xl"
|
||||
className="w-full bg-gradient-to-r from-violet-600 to-fuchsia-600 hover:from-violet-500 hover:to-fuchsia-500 text-white shadow-lg shadow-violet-500/25">
|
||||
<a
|
||||
href={EXTERNAL_LINKS.CLOUD_APP_SIGNUP_HOME}
|
||||
className="flex items-center justify-center">
|
||||
|
|
|
|||
|
|
@ -4,12 +4,22 @@ import { EXTERNAL_LINKS } from "@/lib/constants"
|
|||
|
||||
export function CTASection() {
|
||||
return (
|
||||
<section className="py-24 bg-muted/30 border-t border-border">
|
||||
<section className="py-24 bg-muted/30 border-t border-border relative overflow-hidden">
|
||||
<div className="absolute inset-0 -z-10">
|
||||
<div className="absolute left-1/2 top-1/2 h-[500px] w-[800px] -translate-x-1/2 -translate-y-1/2 rounded-full bg-gradient-to-r from-violet-500/10 via-blue-500/10 to-fuchsia-500/10 dark:from-violet-700/15 dark:via-blue-700/15 dark:to-fuchsia-700/15 blur-[120px]" />
|
||||
</div>
|
||||
<div className="container px-4 mx-auto sm:px-6 lg:px-8 text-center">
|
||||
<h2 className="text-3xl font-bold tracking-tight sm:text-5xl mb-8">Build faster. Solo or Together.</h2>
|
||||
<h2 className="text-3xl font-bold tracking-tight sm:text-5xl mb-8">
|
||||
Build faster.{" "}
|
||||
<span className="bg-gradient-to-r from-blue-600 via-violet-600 to-fuchsia-600 dark:from-blue-400 dark:via-violet-400 dark:to-fuchsia-400 bg-clip-text text-transparent">
|
||||
Solo or Together.
|
||||
</span>
|
||||
</h2>
|
||||
|
||||
<div className="flex flex-col sm:flex-row items-center justify-center gap-4">
|
||||
<Button size="lg" className="w-full sm:w-auto h-12 px-8 text-base">
|
||||
<Button
|
||||
size="lg"
|
||||
className="w-full sm:w-auto h-12 px-8 text-base bg-gradient-to-r from-blue-600 to-violet-600 hover:from-blue-500 hover:to-violet-500 text-white shadow-lg shadow-blue-500/25">
|
||||
<a
|
||||
href={EXTERNAL_LINKS.MARKETPLACE}
|
||||
target="_blank"
|
||||
|
|
@ -20,7 +30,10 @@ export function CTASection() {
|
|||
</a>
|
||||
</Button>
|
||||
|
||||
<Button variant="outline" size="lg" className="w-full sm:w-auto h-12 px-8 text-base">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="lg"
|
||||
className="w-full sm:w-auto h-12 px-8 text-base border-violet-500/50 hover:bg-violet-500/10 hover:border-violet-500">
|
||||
<a
|
||||
href={EXTERNAL_LINKS.CLOUD_APP_SIGNUP}
|
||||
target="_blank"
|
||||
|
|
|
|||
|
|
@ -253,7 +253,11 @@ export function FAQSection() {
|
|||
duration: 0.6,
|
||||
ease: [0.21, 0.45, 0.27, 0.9],
|
||||
}}>
|
||||
<h2 className="text-4xl font-bold tracking-tight sm:text-5xl">Frequently Asked Questions</h2>
|
||||
<h2 className="text-4xl font-bold tracking-tight sm:text-5xl">
|
||||
<span className="bg-gradient-to-r from-blue-600 via-violet-600 to-fuchsia-600 dark:from-blue-400 dark:via-violet-400 dark:to-fuchsia-400 bg-clip-text text-transparent">
|
||||
Frequently Asked Questions
|
||||
</span>
|
||||
</h2>
|
||||
<p className="mt-6 text-lg text-muted-foreground max-w-2xl mx-auto">
|
||||
Everything you need to know about Roo Code and how it can transform your development
|
||||
workflow.
|
||||
|
|
@ -274,7 +278,7 @@ export function FAQSection() {
|
|||
delay: index * 0.1,
|
||||
ease: [0.21, 0.45, 0.27, 0.9],
|
||||
}}>
|
||||
<div className="group relative rounded-lg border border-border/50 bg-background/30 backdrop-blur-xl transition-all duration-300 hover:border-border">
|
||||
<div className="group relative rounded-lg border border-border/50 bg-background/30 backdrop-blur-xl transition-all duration-300 hover:border-violet-500/30 hover:shadow-sm hover:shadow-violet-500/5">
|
||||
<button
|
||||
onClick={() => toggleFAQ(index)}
|
||||
className="flex w-full items-center justify-between p-6 text-left"
|
||||
|
|
|
|||
|
|
@ -8,7 +8,10 @@ export function OptionOverviewSection() {
|
|||
<div className="container px-4 mx-auto sm:px-6 lg:px-8">
|
||||
<div className="text-center mb-16">
|
||||
<h2 className="text-3xl font-bold tracking-tight sm:text-4xl mb-4">
|
||||
Different form factors for different ways of working.
|
||||
Different form factors for{" "}
|
||||
<span className="bg-gradient-to-r from-blue-600 to-fuchsia-600 dark:from-blue-400 dark:to-fuchsia-400 bg-clip-text text-transparent">
|
||||
different ways of working.
|
||||
</span>
|
||||
</h2>
|
||||
<p className="text-xl text-muted-foreground max-w-2xl mx-auto">
|
||||
Roo's always there to help you get stuff done.
|
||||
|
|
@ -16,7 +19,7 @@ export function OptionOverviewSection() {
|
|||
</div>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-12 max-w-5xl mx-auto relative z-1">
|
||||
<div className="absolute left-1/2 top-[140px] -translate-x-1/2 z-1">
|
||||
<div className="rounded-full size-[300px] border-[10px] border-dashed animate-[spin_10s_linear_infinite] blur-[5px]" />
|
||||
<div className="rounded-full size-[300px] border-[10px] border-dashed border-violet-400/30 dark:border-violet-500/20 animate-[spin_10s_linear_infinite] blur-[5px]" />
|
||||
</div>
|
||||
|
||||
<div className="rounded-3xl bg-card outline outline-border/50 hover:outline-8 shadow-xl p-8 h-full group transition-all hover:shadow-2xl hover:shadow-blue-800/30 relative">
|
||||
|
|
|
|||
|
|
@ -47,12 +47,15 @@ export function PillarsSection() {
|
|||
return (
|
||||
<section className="py-24 bg-muted/30 relative">
|
||||
<div className="absolute inset-y-0 left-1/2 h-full w-full max-w-[1200px] -translate-x-1/2">
|
||||
<div className="absolute left-1/2 top-1/2 h-[800px] w-full -translate-x-1/2 -translate-y-1/2 rounded-full bg-blue-500/10 dark:bg-blue-700/20 blur-[140px]" />
|
||||
<div className="absolute left-1/2 top-1/2 h-[800px] w-full -translate-x-1/2 -translate-y-1/2 rounded-full bg-gradient-to-br from-blue-500/10 via-violet-500/10 to-fuchsia-500/10 dark:from-blue-700/20 dark:via-violet-700/20 dark:to-fuchsia-700/20 blur-[140px]" />
|
||||
</div>
|
||||
<div className="container px-4 mx-auto sm:px-6 lg:px-8">
|
||||
<div className="text-center mb-16">
|
||||
<h2 className="text-3xl font-bold tracking-tight sm:text-4xl mb-4">
|
||||
To trust an agent, you have to do it on your own terms.
|
||||
To trust an agent, you have to do it on{" "}
|
||||
<span className="bg-gradient-to-r from-blue-600 to-violet-600 dark:from-blue-400 dark:to-violet-400 bg-clip-text text-transparent">
|
||||
your own terms.
|
||||
</span>
|
||||
</h2>
|
||||
<p className="text-xl text-muted-foreground max-w-xl mx-auto">
|
||||
Roo is designed from the ground up to give you the confidence to do ever more with AI.
|
||||
|
|
@ -61,9 +64,9 @@ export function PillarsSection() {
|
|||
|
||||
<div className="flex flex-col md:grid md:grid-cols-8 gap-8">
|
||||
<div className="relative md:col-span-3 h-full">
|
||||
<div className="rounded-2xl bg-card outline outline-border/50 hover:outline-8 shadow-lg p-8 h-full group transition-all hover:shadow-2xl">
|
||||
<div className="absolute -right-3 -top-5 bg-card border shadow-md rounded-full p-3 transition-all group-hover:-top-4 group-hover:-right-2 group-hover:scale-110 group-hover:shadow-xl">
|
||||
<Brain className="size-8 text-violet-600 shrink-0 mt-1" strokeWidth={1.5} />
|
||||
<div className="rounded-2xl bg-card outline outline-border/50 hover:outline-8 shadow-lg p-8 h-full group transition-all hover:shadow-2xl hover:shadow-violet-500/10">
|
||||
<div className="absolute -right-3 -top-5 bg-gradient-to-br from-violet-500 to-purple-600 border border-violet-400/30 shadow-md shadow-violet-500/20 rounded-full p-3 transition-all group-hover:-top-4 group-hover:-right-2 group-hover:scale-110 group-hover:shadow-xl group-hover:shadow-violet-500/30">
|
||||
<Brain className="size-8 text-white shrink-0 mt-1" strokeWidth={1.5} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-2xl font-bold mb-1">Model-agnostic by design</h3>
|
||||
|
|
@ -104,9 +107,9 @@ export function PillarsSection() {
|
|||
</div>
|
||||
|
||||
<div className="relative col-span-5 h-full">
|
||||
<div className="rounded-2xl bg-card outline outline-border/50 hover:outline-8 shadow-lg p-8 h-full group transition-all hover:shadow-2xl">
|
||||
<div className="absolute -right-3 -top-5 bg-card border shadow-lg rounded-full p-3 transition-all group-hover:-top-4 group-hover:-right-2 group-hover:scale-110 group-hover:shadow-xl">
|
||||
<Users2 className="size-8 text-violet-600 shrink-0 mt-1" strokeWidth={1.5} />
|
||||
<div className="rounded-2xl bg-card outline outline-border/50 hover:outline-8 shadow-lg p-8 h-full group transition-all hover:shadow-2xl hover:shadow-blue-500/10">
|
||||
<div className="absolute -right-3 -top-5 bg-gradient-to-br from-blue-500 to-cyan-600 border border-blue-400/30 shadow-md shadow-blue-500/20 rounded-full p-3 transition-all group-hover:-top-4 group-hover:-right-2 group-hover:scale-110 group-hover:shadow-xl group-hover:shadow-blue-500/30">
|
||||
<Users2 className="size-8 text-white shrink-0 mt-1" strokeWidth={1.5} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-2xl font-bold mb-1">Role-specific Modes</h3>
|
||||
|
|
@ -152,9 +155,9 @@ export function PillarsSection() {
|
|||
</div>
|
||||
|
||||
<div className="relative col-span-4 h-full">
|
||||
<div className="rounded-2xl bg-card outline outline-border/50 hover:outline-8 shadow-lg p-8 h-full group transition-all hover:shadow-2xl">
|
||||
<div className="absolute -right-3 -top-5 bg-card border shadow-lg rounded-full p-3 transition-all group-hover:-top-4 group-hover:-right-2 group-hover:scale-110 group-hover:shadow-xl">
|
||||
<Keyboard className="size-8 text-violet-600 shrink-0 mt-1" strokeWidth={1.5} />
|
||||
<div className="rounded-2xl bg-card outline outline-border/50 hover:outline-8 shadow-lg p-8 h-full group transition-all hover:shadow-2xl hover:shadow-amber-500/10">
|
||||
<div className="absolute -right-3 -top-5 bg-gradient-to-br from-amber-500 to-orange-600 border border-amber-400/30 shadow-md shadow-amber-500/20 rounded-full p-3 transition-all group-hover:-top-4 group-hover:-right-2 group-hover:scale-110 group-hover:shadow-xl group-hover:shadow-amber-500/30">
|
||||
<Keyboard className="size-8 text-white shrink-0 mt-1" strokeWidth={1.5} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-2xl font-bold mb-1">Highly configurable</h3>
|
||||
|
|
@ -171,9 +174,9 @@ export function PillarsSection() {
|
|||
</div>
|
||||
|
||||
<div className="relative col-span-4 h-full">
|
||||
<div className="rounded-2xl bg-card outline outline-border/50 hover:outline-8 shadow-lg p-8 h-full group transition-all hover:shadow-2xl">
|
||||
<div className="absolute -right-3 -top-5 bg-card border shadow-lg rounded-full p-3 transition-all group-hover:-top-4 group-hover:-right-2 group-hover:scale-110 group-hover:shadow-xl">
|
||||
<Shield className="size-8 text-violet-600 shrink-0 mt-1" strokeWidth={1.5} />
|
||||
<div className="rounded-2xl bg-card outline outline-border/50 hover:outline-8 shadow-lg p-8 h-full group transition-all hover:shadow-2xl hover:shadow-emerald-500/10">
|
||||
<div className="absolute -right-3 -top-5 bg-gradient-to-br from-emerald-500 to-teal-600 border border-emerald-400/30 shadow-md shadow-emerald-500/20 rounded-full p-3 transition-all group-hover:-top-4 group-hover:-right-2 group-hover:scale-110 group-hover:shadow-xl group-hover:shadow-emerald-500/30">
|
||||
<Shield className="size-8 text-white shrink-0 mt-1" strokeWidth={1.5} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-2xl font-bold mb-1">Secure and transparent</h3>
|
||||
|
|
|
|||
|
|
@ -193,7 +193,10 @@ export function Testimonials() {
|
|||
<div className="container relative z-10 mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div className="mx-auto mb-8 md:max-w-2xl text-center">
|
||||
<h2 className="text-4xl font-bold tracking-tight sm:text-5xl">
|
||||
More than 1 million people are shipping with Roo.
|
||||
More than 1 million people are{" "}
|
||||
<span className="bg-gradient-to-r from-violet-600 to-fuchsia-600 dark:from-violet-400 dark:to-fuchsia-400 bg-clip-text text-transparent">
|
||||
shipping with Roo.
|
||||
</span>
|
||||
</h2>
|
||||
<p className="mt-6 text-lg text-muted-foreground">And they have some great things to say.</p>
|
||||
</div>
|
||||
|
|
@ -232,7 +235,7 @@ export function Testimonials() {
|
|||
key={testimonial.name}
|
||||
className="relative min-w-0 flex-[0_0_85%] px-2 md:flex-[0_0_70%] md:px-4 lg:flex-[0_0_30%]">
|
||||
<div className="group relative py-10 h-full">
|
||||
<div className="relative flex h-full flex-col rounded-2xl border border-border bg-background transition-all duration-500 ease-out group-hover:scale-[1.02] group-hover:border-border group-hover:bg-background/40 group-hover:shadow-xl dark:border-border/70 dark:bg-background/40 dark:group-hover:border-border dark:group-hover:bg-background/60 dark:group-hover:shadow-[0_20px_50px_rgba(59,130,246,0.15)]">
|
||||
<div className="relative flex h-full flex-col rounded-2xl border border-border bg-background transition-all duration-500 ease-out group-hover:scale-[1.02] group-hover:border-violet-500/30 group-hover:bg-background/40 group-hover:shadow-xl group-hover:shadow-violet-500/10 dark:border-border/70 dark:bg-background/40 dark:group-hover:border-violet-400/30 dark:group-hover:bg-background/60 dark:group-hover:shadow-[0_20px_50px_rgba(139,92,246,0.15)]">
|
||||
<div className="flex flex-1 flex-col p-4 md:p-6">
|
||||
<div className="flex-1">
|
||||
<p className="relative text-sm leading-relaxed text-muted-foreground transition-colors duration-300 group-hover:text-foreground/80 dark:text-foreground/70 dark:group-hover:text-foreground/90">
|
||||
|
|
@ -254,7 +257,10 @@ export function Testimonials() {
|
|||
<span className="flex items-center mt-1">
|
||||
{" "}
|
||||
{Array.from({ length: testimonial.stars }, (_, i) => (
|
||||
<Star key={i} className="size-4 fill-violet-500" />
|
||||
<Star
|
||||
key={i}
|
||||
className="size-4 fill-amber-400 text-amber-400"
|
||||
/>
|
||||
))}
|
||||
</span>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -381,18 +381,26 @@ export function UseExamplesSection({ agentTitle = false }: { agentTitle?: boolea
|
|||
return (
|
||||
<section className="pt-24 bg-background overflow-hidden relative">
|
||||
<div className="absolute inset-y-0 left-1/2 h-full w-full max-w-[1200px] -translate-x-1/2">
|
||||
<div className="absolute left-1/2 top-1/2 h-[700px] w-full -translate-x-1/2 -translate-y-1/2 rounded-full bg-foreground/10 blur-[140px]" />
|
||||
<div className="absolute left-1/2 top-1/2 h-[700px] w-full -translate-x-1/2 -translate-y-1/2 rounded-full bg-gradient-to-br from-blue-500/10 via-violet-500/10 to-amber-500/5 dark:from-blue-600/15 dark:via-violet-600/15 dark:to-amber-500/5 blur-[140px]" />
|
||||
</div>
|
||||
<div className="container px-4 mx-auto sm:px-6 lg:px-8">
|
||||
<div className="text-center mb-16">
|
||||
<h2 className="text-4xl font-bold tracking-tight mb-4">
|
||||
{agentTitle ? (
|
||||
<>
|
||||
Part of the AI team to help your <em>entire</em> human team
|
||||
Part of the AI team to help your{" "}
|
||||
<em className="bg-gradient-to-r from-violet-600 to-fuchsia-600 dark:from-violet-400 dark:to-fuchsia-400 bg-clip-text text-transparent not-italic">
|
||||
entire
|
||||
</em>{" "}
|
||||
human team
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
The AI team to help your <em>entire</em> human team
|
||||
The AI team to help your{" "}
|
||||
<em className="bg-gradient-to-r from-violet-600 to-fuchsia-600 dark:from-violet-400 dark:to-fuchsia-400 bg-clip-text text-transparent not-italic">
|
||||
entire
|
||||
</em>{" "}
|
||||
human team
|
||||
</>
|
||||
)}
|
||||
</h2>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue