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);
|
text-decoration:line-through; text-decoration-color:rgba(14,31,51,0.4);
|
||||||
}
|
}
|
||||||
.tier-card .tier-features-list { margin-top:4px; }
|
.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 ---------- */
|
||||||
.install-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
|
.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);
|
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;
|
return card;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user