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

Seed: project-management template (23 files)

Browse Source
This commit is contained in:
jyswee
2026-07-23 23:01:09 +00:00
parent 63cd754f46
commit 6fa48cbea5
1 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/Settings.tsx
+8 -8
View File
@@ -75,7 +75,7 @@ export default function SettingsPage() {
try { try {
const res: any = await startCheckout({ plan: plan.name, amount: plan.amount }); const res: any = await startCheckout({ plan: plan.name, amount: plan.amount });
if (res?.url) { window.location.href = res.url; return; } if (res?.url) { window.location.href = res.url; return; }
toast(`Upgraded to \${plan.name}`); toast(`Upgraded to ${plan.name}`);
} catch { } catch {
toast("Checkout could not be started. Please try again."); toast("Checkout could not be started. Please try again.");
} }
@@ -99,7 +99,7 @@ export default function SettingsPage() {
<button <button
key={tab.id} key={tab.id}
onClick={() => setActiveTab(tab.id)} onClick={() => setActiveTab(tab.id)}
className={`flex items-center gap-2 px-4 py-3 text-sm font-medium transition-colors border-b-2 -mb-[1px] \${ className={`flex items-center gap-2 px-4 py-3 text-sm font-medium transition-colors border-b-2 -mb-[1px] ${
activeTab === tab.id activeTab === tab.id
? "border-violet-600 text-violet-600" ? "border-violet-600 text-violet-600"
: "border-transparent text-slate-500 hover:text-slate-700" : "border-transparent text-slate-500 hover:text-slate-700"
@@ -165,7 +165,7 @@ export default function SettingsPage() {
<Card key={member.email} className="border-0 shadow-sm"> <Card key={member.email} className="border-0 shadow-sm">
<CardContent className="p-4 flex items-center gap-4"> <CardContent className="p-4 flex items-center gap-4">
<Avatar className="h-10 w-10"> <Avatar className="h-10 w-10">
<AvatarFallback className={`text-sm text-white \${member.color}`}>{member.initials}</AvatarFallback> <AvatarFallback className={`text-sm text-white ${member.color}`}>{member.initials}</AvatarFallback>
</Avatar> </Avatar>
<div className="flex-1 min-w-0"> <div className="flex-1 min-w-0">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
@@ -198,7 +198,7 @@ export default function SettingsPage() {
<Card key={integration.name} className="border-0 shadow-sm hover:shadow-md transition-all duration-200"> <Card key={integration.name} className="border-0 shadow-sm hover:shadow-md transition-all duration-200">
<CardContent className="p-5"> <CardContent className="p-5">
<div className="flex items-start justify-between mb-3"> <div className="flex items-start justify-between mb-3">
<div className={`h-10 w-10 rounded-lg \${integration.color} flex items-center justify-center`}> <div className={`h-10 w-10 rounded-lg ${integration.color} flex items-center justify-center`}>
<span className="text-sm font-bold text-white">{integration.icon}</span> <span className="text-sm font-bold text-white">{integration.icon}</span>
</div> </div>
{integration.connected && ( {integration.connected && (
@@ -210,7 +210,7 @@ export default function SettingsPage() {
<Button <Button
variant={integration.connected ? "outline" : "default"} variant={integration.connected ? "outline" : "default"}
size="sm" size="sm"
className={`w-full \${!integration.connected ? "bg-violet-600 hover:bg-violet-700 text-white" : ""}`} className={`w-full ${!integration.connected ? "bg-violet-600 hover:bg-violet-700 text-white" : ""}`}
> >
{integration.connected ? ( {integration.connected ? (
<> <>
@@ -232,7 +232,7 @@ export default function SettingsPage() {
{activeTab === "billing" && ( {activeTab === "billing" && (
<div className="grid grid-cols-1 md:grid-cols-3 gap-4 animate-fade-up"> <div className="grid grid-cols-1 md:grid-cols-3 gap-4 animate-fade-up">
{plans.map((plan) => ( {plans.map((plan) => (
<Card key={plan.name} className={`border shadow-sm \${plan.popular ? "border-violet-500 ring-1 ring-violet-500" : "border-slate-100"}`}> <Card key={plan.name} className={`border shadow-sm ${plan.popular ? "border-violet-500 ring-1 ring-violet-500" : "border-slate-100"}`}>
<CardHeader> <CardHeader>
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<CardTitle className="text-lg">{plan.name}</CardTitle> <CardTitle className="text-lg">{plan.name}</CardTitle>
@@ -256,9 +256,9 @@ export default function SettingsPage() {
onClick={() => handleUpgrade(plan)} onClick={() => handleUpgrade(plan)}
disabled={checkoutBusy || plan.current} disabled={checkoutBusy || plan.current}
variant={plan.popular ? "default" : "outline"} variant={plan.popular ? "default" : "outline"}
className={`w-full min-h-[48px] \${plan.popular ? "bg-violet-600 hover:bg-violet-700 text-white" : ""}`} className={`w-full min-h-[48px] ${plan.popular ? "bg-violet-600 hover:bg-violet-700 text-white" : ""}`}
> >
{plan.current ? "Current Plan" : plan.name === "Enterprise" ? "Contact Sales" : `Upgrade to \${plan.name}`} {plan.current ? "Current Plan" : plan.name === "Enterprise" ? "Contact Sales" : `Upgrade to ${plan.name}`}
</Button> </Button>
</CardContent> </CardContent>
</Card> </Card>