Tier cards: add navy-pill buy CTAs per policy

Each live tier card now ends in a navy-950 pill linking to
licensing.keysat.xyz/buy/keysat?policy=<slug>. margin-top:auto on
the CTA anchors it to the bottom of each card so buttons line up
across tiers of different heights.
This commit is contained in:
Grant
2026-05-12 00:28:18 -05:00
parent 8d41e42eef
commit 69d4d69d0c
+19
View File
@@ -360,6 +360,17 @@ pre.code .p { color:rgba(245,241,232,0.55); }
text-decoration:line-through; text-decoration-color:rgba(14,31,51,0.4);
}
.tier-card .tier-features-list { margin-top:4px; }
.tier-card .tier-buy-cta {
display:block; margin-top:auto;
align-self:stretch; text-align:center;
padding:12px 22px; border-radius:999px;
background:var(--navy-950); color:var(--cream-50);
font-family:var(--font-display); font-weight:600; font-size:14px;
letter-spacing:-0.005em; text-decoration:none;
transition:background 100ms;
}
.tier-card .tier-features-list { margin-bottom:18px; }
.tier-card .tier-buy-cta:hover { background:var(--navy-800); }
/* ---------- Install ---------- */
.install-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
@@ -1249,6 +1260,14 @@ fmt.<span class="f">Printf</span>(<span class="s">"licensed for %s, expires %s\n
});
card.appendChild(list);
}
// Buy CTA — navy pill that links to the master Keysat's buy page
// with the right policy slug pre-selected. Free tier links to the
// same page; it renders "Redeem license" automatically.
const buyBtn = document.createElement('a');
buyBtn.className = 'tier-buy-cta';
buyBtn.href = KEYSAT_API + '/buy/' + PRODUCT_SLUG + '?policy=' + encodeURIComponent(pol.slug);
buyBtn.textContent = 'Get ' + pol.name;
card.appendChild(buyBtn);
return card;
}