Site design updates
This commit is contained in:
@@ -149,28 +149,28 @@ const Pricing: React.FC = () => {
|
||||
<h3 className="text-xl font-semibold text-slate-900">
|
||||
Compare plan capabilities
|
||||
</h3>
|
||||
<div className="overflow-hidden rounded-3xl border border-slate-200 bg-white">
|
||||
<div className="overflow-hidden rounded-3xl border-2 border-[#0693e3]/20 bg-gradient-to-br from-white via-[#0693e3]/5 to-[#0bbf87]/5 shadow-lg">
|
||||
<table className="min-w-full text-sm text-slate-600">
|
||||
<thead className="bg-white text-slate-600 uppercase text-xs tracking-[0.3em]">
|
||||
<thead className="bg-gradient-to-r from-[#0693e3]/10 via-[#5d4ae3]/10 to-[#0bbf87]/10 text-slate-700 uppercase text-xs tracking-[0.3em]">
|
||||
<tr>
|
||||
<th className="px-6 py-4 text-left">Capability</th>
|
||||
<th className="px-6 py-4 text-center">Launch</th>
|
||||
<th className="px-6 py-4 text-center">Scale</th>
|
||||
<th className="px-6 py-4 text-center">Enterprise</th>
|
||||
<th className="px-6 py-4 text-left font-semibold">Capability</th>
|
||||
<th className="px-6 py-4 text-center font-semibold">Launch</th>
|
||||
<th className="px-6 py-4 text-center font-semibold text-[#0693e3]">Scale</th>
|
||||
<th className="px-6 py-4 text-center font-semibold">Enterprise</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{featureMatrix.map((row, index) => (
|
||||
<tr key={row.feature} className={index % 2 === 0 ? "bg-white/3" : ""}>
|
||||
<tr key={row.feature} className={index % 2 === 0 ? "bg-white/50" : "bg-gradient-to-r from-white/30 to-transparent"}>
|
||||
<td className="px-6 py-5 text-slate-900 font-medium">{row.feature}</td>
|
||||
<td className="px-6 py-5 text-center">
|
||||
{row.launch === true ? "Included" : row.launch}
|
||||
{row.launch === true ? <span className="inline-flex items-center gap-1"><span className="size-1.5 rounded-full bg-[#0bbf87]"></span>Included</span> : row.launch}
|
||||
</td>
|
||||
<td className="px-6 py-5 text-center font-medium text-[#0693e3]">
|
||||
{row.scale === true ? <span className="inline-flex items-center gap-1"><span className="size-1.5 rounded-full bg-[#0693e3]"></span>Included</span> : row.scale}
|
||||
</td>
|
||||
<td className="px-6 py-5 text-center">
|
||||
{row.scale === true ? "Included" : row.scale}
|
||||
</td>
|
||||
<td className="px-6 py-5 text-center">
|
||||
{row.enterprise === true ? "Included" : row.enterprise}
|
||||
{row.enterprise === true ? <span className="inline-flex items-center gap-1"><span className="size-1.5 rounded-full bg-[#5d4ae3]"></span>Included</span> : row.enterprise}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
@@ -179,10 +179,11 @@ const Pricing: React.FC = () => {
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="bg-gradient-to-br from-[#0693e3]/5 via-slate-50/70 to-[#0bbf87]/5 border-y border-[#0693e3]/10">
|
||||
<div className="max-w-6xl mx-auto px-6 py-24 grid grid-cols-1 md:grid-cols-2 gap-12 text-sm text-slate-600">
|
||||
<div className="space-y-4">
|
||||
<h4 className="text-lg font-semibold text-slate-900">
|
||||
<section className="bg-gradient-to-br from-[#0693e3]/10 via-slate-50/70 to-[#0bbf87]/10 border-y border-[#0693e3]/20">
|
||||
<div className="max-w-6xl mx-auto px-6 py-24 grid grid-cols-1 md:grid-cols-2 gap-12">
|
||||
<div className="rounded-3xl border-2 border-[#0693e3]/30 bg-gradient-to-br from-[#0693e3]/5 to-white p-8 space-y-4 text-sm text-slate-600">
|
||||
<h4 className="text-lg font-semibold text-slate-900 flex items-center gap-2">
|
||||
<span className="size-2 rounded-full bg-[#0693e3]"></span>
|
||||
Usage-based credits explained
|
||||
</h4>
|
||||
<p>
|
||||
@@ -192,8 +193,9 @@ const Pricing: React.FC = () => {
|
||||
Need more? Add packs instantly or set automation rules to pause when thresholds are hit.
|
||||
</p>
|
||||
</div>
|
||||
<div className="space-y-4">
|
||||
<h4 className="text-lg font-semibold text-slate-900">
|
||||
<div className="rounded-3xl border-2 border-[#0bbf87]/30 bg-gradient-to-br from-[#0bbf87]/5 to-white p-8 space-y-4 text-sm text-slate-600">
|
||||
<h4 className="text-lg font-semibold text-slate-900 flex items-center gap-2">
|
||||
<span className="size-2 rounded-full bg-[#0bbf87]"></span>
|
||||
Security & compliance
|
||||
</h4>
|
||||
<p>
|
||||
|
||||
Reference in New Issue
Block a user