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:
+19
@@ -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;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user