stlyes fixes

This commit is contained in:
IGNY8 VPS (Salman)
2025-12-29 19:52:51 +00:00
parent c91175fdcb
commit 4f7ab9c606
155 changed files with 1576 additions and 2489 deletions

View File

@@ -52,68 +52,68 @@ export default function Payment() {
};
return (
<div className="min-h-screen flex items-center justify-center bg-slate-50 px-4 py-16">
<div className="w-full max-w-3xl bg-white rounded-2xl shadow-lg p-8 space-y-6 border border-slate-100">
<div className="min-h-screen flex items-center justify-center bg-gray-50 px-4 py-16">
<div className="w-full max-w-3xl bg-white rounded-2xl shadow-lg p-8 space-y-6 border border-gray-100">
<div className="flex items-center justify-between">
<div>
<p className="text-sm text-slate-500">Confirm your plan</p>
<h1 className="text-2xl font-semibold text-slate-900">Complete your subscription</h1>
<p className="text-sm text-gray-500">Confirm your plan</p>
<h1 className="text-2xl font-semibold text-gray-900">Complete your subscription</h1>
</div>
<Link to="/pricing" className="text-sm text-blue-600 hover:text-blue-700">
<Link to="/pricing" className="text-sm text-brand-600 hover:text-brand-700">
Change plan
</Link>
</div>
{plan && (
<div className="rounded-xl border border-slate-200 bg-slate-50 p-4">
<h2 className="text-lg font-semibold text-slate-900">{plan.name}</h2>
<p className="text-slate-700">{plan.price}</p>
<p className="text-sm text-slate-600">{plan.content}</p>
<p className="text-xs text-amber-700 mt-2">
<div className="rounded-xl border border-gray-200 bg-gray-50 p-4">
<h2 className="text-lg font-semibold text-gray-900">{plan.name}</h2>
<p className="text-gray-700">{plan.price}</p>
<p className="text-sm text-gray-600">{plan.content}</p>
<p className="text-xs text-warning-700 mt-2">
Payment is completed offline (bank transfer). Submit your email and reference below; we will verify and activate your account.
</p>
</div>
)}
<div className="space-y-4">
<label className="block text-sm font-medium text-slate-800">
<label className="block text-sm font-medium text-gray-800">
Contact email
<input
type="email"
value={contactEmail}
onChange={(e) => setContactEmail(e.target.value)}
placeholder="you@example.com"
className="mt-1 w-full rounded-lg border border-slate-300 px-3 py-2 text-slate-900 focus:border-blue-500 focus:outline-none"
className="mt-1 w-full rounded-lg border border-gray-300 px-3 py-2 text-gray-900 focus:border-brand-500 focus:outline-none"
/>
</label>
<label className="block text-sm font-medium text-slate-800">
<label className="block text-sm font-medium text-gray-800">
Notes (optional)
<textarea
value={note}
onChange={(e) => setNote(e.target.value)}
placeholder="Company name, billing contact, or questions"
className="mt-1 w-full rounded-lg border border-slate-300 px-3 py-2 text-slate-900 focus:border-blue-500 focus:outline-none"
className="mt-1 w-full rounded-lg border border-gray-300 px-3 py-2 text-gray-900 focus:border-brand-500 focus:outline-none"
rows={3}
/>
</label>
</div>
<div className="flex items-center justify-between">
<Link to="/signup" className="text-sm text-slate-600 hover:text-slate-800">
<Link to="/signup" className="text-sm text-gray-600 hover:text-gray-800">
Prefer the free plan? Start your trial
</Link>
<a
href={mailtoHref || "#"}
onClick={handleRequest}
className={`inline-flex items-center justify-center rounded-lg px-4 py-2 text-sm font-semibold text-white ${
contactEmail.trim() ? "bg-blue-600 hover:bg-blue-700" : "bg-blue-400 cursor-not-allowed"
contactEmail.trim() ? "bg-brand-600 hover:bg-brand-700" : "bg-brand-400 cursor-not-allowed"
}`}
aria-disabled={!contactEmail.trim()}
>
Request payment instructions
</a>
</div>
{error && <p className="text-sm text-red-600">{error}</p>}
{error && <p className="text-sm text-error-600">{error}</p>}
</div>
</div>
);