bender/3f34788a-7ec6-45e9-9b12-6ad55a4e4415
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2_1777297399627 into main #2

Merged
bender merged 1 commits from version_2_1777297399627 into main 2026-04-27 13:44:19 +00:00
Conversation 0 Commits 1 Files Changed 1 +11 -10
1 changed files with 11 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/components/sections/pricing/PricingCenteredCards.tsx
View File

@@ -3,6 +3,7 @@ import Button from "@/components/ui/Button";
import TextAnimation from "@/components/ui/TextAnimation";
import GridOrCarousel from "@/components/ui/GridOrCarousel";
import ScrollReveal from "@/components/ui/ScrollReveal";
import { cls } from "@/lib/utils";
type PricingPlan = {
tag: string;
@@ -52,16 +53,16 @@ const PricingCenteredCards = ({
{(primaryButton || secondaryButton) && (
<div className="flex flex-wrap justify-center gap-3 mt-3">
{primaryButton && <Button text={primaryButton.text} href={primaryButton.href} variant="primary"/>}
{secondaryButton && <Button text={secondaryButton.text} href={secondaryButton.href} variant="secondary"animationDelay={0.1} />}
{secondaryButton && <Button text={secondaryButton.text} href={secondaryButton.href} variant="secondary" animationDelay={0.1} />}
</div>
)}
</div>
<ScrollReveal variant="slide-up">
<GridOrCarousel>
{plans.map((plan) => (
<div key={plan.tag} className="flex flex-col items-center gap-3 xl:gap-4 2xl:gap-5 p-3 xl:p-4 2xl:p-5 h-full card rounded text-center">
<span className="px-5 py-2 text-sm card rounded">{plan.tag}</span>
{plans.map((plan, index) => (
<div key={plan.tag} className={cls("flex flex-col items-center gap-3 xl:gap-4 2xl:gap-5 p-3 xl:p-4 2xl:p-5 h-full card rounded text-center", index === 1 && "!bg-purple-600 !bg-none text-white")}>
<span className={cls("px-5 py-2 text-sm rounded", index === 1 ? "bg-white/20" : "card")}>{plan.tag}</span>
<div className="flex flex-col gap-1">
<span className="text-5xl font-medium">{plan.price}</span>
@@ -69,17 +70,17 @@ const PricingCenteredCards = ({
</div>
<div className="flex flex-col gap-3 w-full">
<Button text={plan.primaryButton.text} href={plan.primaryButton.href} variant="primary" className="w-full" />
{plan.secondaryButton && <Button text={plan.secondaryButton.text} href={plan.secondaryButton.href} variant="secondary" className="w-full" />}
<Button text={plan.primaryButton.text} href={plan.primaryButton.href} variant={index === 1 ? "secondary" : "primary"} className="w-full" />
{plan.secondaryButton && <Button text={plan.secondaryButton.text} href={plan.secondaryButton.href} variant={index === 1 ? "primary" : "secondary"} className="w-full" />}
</div>
<div className="w-full h-px bg-foreground/20" />
<div className={cls("w-full h-px", index === 1 ? "bg-white/20" : "bg-foreground/20")} />
<div className="flex flex-col gap-3 w-full">
{plan.features.map((feature) => (
<div key={feature} className="flex items-start gap-3">
<div className="flex items-center justify-center shrink-0 size-6 primary-button rounded">
<Check className="size-3 text-primary-cta-text" strokeWidth={2} />
<div className={cls("flex items-center justify-center shrink-0 size-6 rounded", index === 1 ? "bg-white" : "primary-button")}>
<Check className={cls("size-3", index === 1 ? "text-purple-600" : "text-primary-cta-text")} strokeWidth={2} />
</div>
<span className="text-base text-left">{feature}</span>
</div>
@@ -93,4 +94,4 @@ const PricingCenteredCards = ({
</section>
);
export default PricingCenteredCards;
export default PricingCenteredCards;