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:06 +00:00
parent 9d67262398
commit 07dc07bea1
1 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/Trainers.tsx
+2 -2
View File
@@ -39,7 +39,7 @@ export default function Trainers() {
<div className="mx-auto max-w-6xl px-6"> <div className="mx-auto max-w-6xl px-6">
<div className="flex gap-2 justify-center flex-wrap mb-12"> <div className="flex gap-2 justify-center flex-wrap mb-12">
{filters.map((f) => ( {filters.map((f) => (
<Button key={f} variant={active === f ? "default" : "outline"} onClick={() => setActive(f)} className={`rounded-full font-bold uppercase tracking-wide text-sm px-6 transition-all \${active === f ? "bg-gradient-to-r from-orange-500 to-red-500 text-white border-0 shadow-lg shadow-orange-500/25" : "border-slate-700 text-slate-400 hover:text-white hover:border-slate-500"}`}> <Button key={f} variant={active === f ? "default" : "outline"} onClick={() => setActive(f)} className={`rounded-full font-bold uppercase tracking-wide text-sm px-6 transition-all ${active === f ? "bg-gradient-to-r from-orange-500 to-red-500 text-white border-0 shadow-lg shadow-orange-500/25" : "border-slate-700 text-slate-400 hover:text-white hover:border-slate-500"}`}>
{f} {f}
</Button> </Button>
))} ))}
@@ -49,7 +49,7 @@ export default function Trainers() {
{filtered.map((t, i) => ( {filtered.map((t, i) => (
<Card key={i} className="bg-slate-900/80 backdrop-blur border border-slate-800 hover:border-orange-500/30 transition-all duration-300 group hover:-translate-y-1"> <Card key={i} className="bg-slate-900/80 backdrop-blur border border-slate-800 hover:border-orange-500/30 transition-all duration-300 group hover:-translate-y-1">
<CardContent className="p-8 text-center"> <CardContent className="p-8 text-center">
<div className={`w-24 h-24 rounded-full bg-gradient-to-br \${t.gradient} mx-auto mb-6 flex items-center justify-center text-3xl font-black text-white shadow-xl group-hover:scale-105 transition-transform`}> <div className={`w-24 h-24 rounded-full bg-gradient-to-br ${t.gradient} mx-auto mb-6 flex items-center justify-center text-3xl font-black text-white shadow-xl group-hover:scale-105 transition-transform`}>
{t.name.split(" ").map(n => n[0]).join("")} {t.name.split(" ").map(n => n[0]).join("")}
</div> </div>
<h3 className="font-bold text-white text-xl">{t.name}</h3> <h3 className="font-bold text-white text-xl">{t.name}</h3>