Add prominent signup CTA button in header with referral link

This commit is contained in:
Marty Bostick
2026-07-10 17:55:42 +00:00
parent cdb54a4eef
commit 8fa1add939
+64 -1
View File
@@ -52,6 +52,45 @@
margin-top: 6px; margin-top: 6px;
font-size: 0.9rem; font-size: 0.9rem;
} }
.cta-bar {
display: flex;
justify-content: center;
gap: 12px;
margin-top: 16px;
flex-wrap: wrap;
}
.cta-btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 12px 28px;
border-radius: var(--radius);
font-size: 1rem;
font-weight: 600;
text-decoration: none;
transition: all .2s;
cursor: pointer;
border: none;
}
.cta-btn-primary {
background: var(--accent);
color: #fff;
box-shadow: 0 0 20px var(--accent-glow);
}
.cta-btn-primary:hover {
background: #7c6df7;
transform: translateY(-1px);
box-shadow: 0 0 30px var(--accent-glow);
}
.cta-btn-secondary {
background: var(--card);
color: var(--text);
border: 1px solid var(--border);
}
.cta-btn-secondary:hover {
background: var(--card-hover);
border-color: var(--accent);
}
/* Controls */ /* Controls */
.controls { .controls {
@@ -388,6 +427,14 @@
<div class="header"> <div class="header">
<h1>CBP What-If Calculator</h1> <h1>CBP What-If Calculator</h1>
<p>Full ladder modeling — profit timeline, referral earnings, and scenario comparison</p> <p>Full ladder modeling — profit timeline, referral earnings, and scenario comparison</p>
<div class="cta-bar" id="ctaBar">
<a class="cta-btn cta-btn-primary" id="signupBtn" target="_blank" rel="noopener">
🚀 Sign Up with My Referral Link
</a>
<button class="cta-btn cta-btn-secondary" onclick="copyCalculatorLink()">
📄 Copy Calculator Link
</button>
</div>
</div> </div>
<!-- Controls --> <!-- Controls -->
@@ -1092,7 +1139,13 @@ function getShareUrl(refUser) {
function updateSharedLinkBox() { function updateSharedLinkBox() {
const refUser = getRefFromURL() || 'cryptoteambuild'; const refUser = getRefFromURL() || 'cryptoteambuild';
document.getElementById('sharedLink').value = getShareUrl(refUser); const shareUrl = getShareUrl(refUser);
document.getElementById('sharedLink').value = shareUrl;
// Update CTA button
const signupBtn = document.getElementById('signupBtn');
if (signupBtn) {
signupBtn.href = `https://clickbaitpays.me/?ref=${refUser}`;
}
} }
function copySharedLink() { function copySharedLink() {
@@ -1106,6 +1159,16 @@ function copySharedLink() {
}); });
} }
function copyCalculatorLink() {
const refUser = getRefFromURL() || 'cryptoteambuild';
const url = getShareUrl(refUser);
navigator.clipboard.writeText(url).then(() => {
const btn = document.querySelector('.cta-btn-secondary');
btn.textContent = '✅ Copied!';
setTimeout(() => { btn.innerHTML = '📄 Copy Calculator Link'; }, 2000);
});
}
// ─── Shareable Plan Generator ───────────────────────────────── // ─── Shareable Plan Generator ─────────────────────────────────
function generatePlan() { function generatePlan() {
const numPeople = parseInt(document.getElementById('numPeople').value) || 1; const numPeople = parseInt(document.getElementById('numPeople').value) || 1;