vibeasite-templates/template-fitness
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Seed: fitness template (17 files)

Browse Source
This commit is contained in:
jyswee
2026-07-23 22:59:07 +00:00
parent 07dc07bea1
commit f3792ae31a
1 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/Pricing.tsx
+3 -3
View File
@@ -66,7 +66,7 @@ export default function Pricing() {
<div className="mx-auto max-w-6xl px-6">
<div className="grid md:grid-cols-3 gap-8 stagger">
{tiers.map((tier, i) => (
<Card key={i} className={`relative bg-slate-900/80 backdrop-blur border transition-all duration-300 hover:-translate-y-1 \${tier.popular ? "border-orange-500/50 shadow-2xl shadow-orange-500/10 scale-105" : "border-slate-800 hover:border-slate-700"}`}>
<Card key={i} className={`relative bg-slate-900/80 backdrop-blur border transition-all duration-300 hover:-translate-y-1 ${tier.popular ? "border-orange-500/50 shadow-2xl shadow-orange-500/10 scale-105" : "border-slate-800 hover:border-slate-700"}`}>
{tier.popular && <div className="absolute -top-3 left-1/2 -translate-x-1/2"><Badge className="bg-gradient-to-r from-orange-500 to-red-500 text-white border-0 uppercase text-xs tracking-wider px-4">Most Popular</Badge></div>}
<CardContent className="p-8">
<h3 className="text-lg font-bold uppercase text-slate-300">{tier.name}</h3>
@@ -83,7 +83,7 @@ export default function Pricing() {
</div>
))}
</div>
<Button disabled={subscribing} className={`w-full font-bold uppercase tracking-wide rounded-full active:scale-[0.97] transition-all \${tier.popular ? "bg-gradient-to-r from-orange-500 to-red-500 hover:from-orange-600 hover:to-red-600 text-white shadow-lg shadow-orange-500/25" : "bg-slate-800 hover:bg-slate-700 text-white"}`} onClick={async () => { const amount = Math.round((parseFloat(String(tier.price).replace(/[^0-9.]/g, "")) || 0) * 100); try { const res = await subscribe({ plan: tier.name, amount }); if (res?.url && String(res.url).indexOf("#") !== 0) { window.location.href = res.url; return; } toast.success(`\${tier.name} membership selected`); } catch { toast.error("Checkout unavailable. Please try again."); } }}>
<Button disabled={subscribing} className={`w-full font-bold uppercase tracking-wide rounded-full active:scale-[0.97] transition-all ${tier.popular ? "bg-gradient-to-r from-orange-500 to-red-500 hover:from-orange-600 hover:to-red-600 text-white shadow-lg shadow-orange-500/25" : "bg-slate-800 hover:bg-slate-700 text-white"}`} onClick={async () => { const amount = Math.round((parseFloat(String(tier.price).replace(/[^0-9.]/g, "")) || 0) * 100); try { const res = await subscribe({ plan: tier.name, amount }); if (res?.url && String(res.url).indexOf("#") !== 0) { window.location.href = res.url; return; } toast.success(`${tier.name} membership selected`); } catch { toast.error("Checkout unavailable. Please try again."); } }}>
Get {tier.name}
</Button>
</CardContent>
@@ -117,7 +117,7 @@ export default function Pricing() {
<h2 className="text-2xl font-black uppercase text-white text-center mb-10 animate-fade-up">Frequently Asked Questions</h2>
<Accordion type="single" collapsible className="space-y-3">
{faqs.map((faq, i) => (
<AccordionItem key={i} value={`faq-\${i}`} className="bg-slate-900/80 backdrop-blur border border-slate-800 rounded-xl px-6">
<AccordionItem key={i} value={`faq-${i}`} className="bg-slate-900/80 backdrop-blur border border-slate-800 rounded-xl px-6">
<AccordionTrigger className="text-white font-semibold text-left hover:no-underline hover:text-orange-400 transition-colors">{faq.q}</AccordionTrigger>
<AccordionContent className="text-slate-400">{faq.a}</AccordionContent>
</AccordionItem>