forked from Goutam/lynkeduppro-crm
tanweer919
a459fefb7f
Copies the goutam-pages landing (React marketing home + /page/1..19 + assets) into /public and adds beforeFiles rewrites so '/' serves the marketing home and '/1'..'/19' + '/thanks' serve the static pages — reproducing the landing's vercel.json clean URLs. /portal/* (login/register) is untouched.
111 lines
5.9 KiB
HTML
111 lines
5.9 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>Welcome to LynkedUp Pro — you're a Founding Member</title>
|
|
<meta name="robots" content="noindex" />
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;700;800&display=swap" rel="stylesheet" />
|
|
<style>
|
|
:root { --orange:#ff9321; --blue:#4dc5ff; }
|
|
* { box-sizing: border-box; }
|
|
body {
|
|
margin: 0; min-height: 100vh;
|
|
font-family: "Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
|
|
color: #fff;
|
|
background:
|
|
radial-gradient(circle at top left, #8c4a13 0%, transparent 38%),
|
|
radial-gradient(circle at bottom right, #1597e5 0%, transparent 40%),
|
|
#14100c;
|
|
display: flex; align-items: center; justify-content: center; padding: 32px 18px;
|
|
}
|
|
.card {
|
|
width: 100%; max-width: 620px;
|
|
background: rgba(18,18,22,.72); border: 1px solid rgba(255,255,255,.10);
|
|
border-radius: 22px; padding: 44px 40px; text-align: center;
|
|
box-shadow: 0 30px 80px rgba(0,0,0,.5); backdrop-filter: blur(6px);
|
|
}
|
|
.badge {
|
|
display: inline-flex; align-items: center; gap: 8px;
|
|
padding: 7px 15px; border-radius: 999px; margin-bottom: 22px;
|
|
background: linear-gradient(90deg, var(--orange), var(--blue));
|
|
color: #0d0d0f; font-weight: 800; font-size: 12.5px; letter-spacing: .02em;
|
|
}
|
|
.check {
|
|
width: 66px; height: 66px; margin: 0 auto 22px; border-radius: 50%;
|
|
background: linear-gradient(135deg, var(--orange), var(--blue));
|
|
display: flex; align-items: center; justify-content: center;
|
|
font-size: 34px; color: #0d0d0f; font-weight: 800;
|
|
}
|
|
h1 { margin: 0 0 10px; font-size: 27px; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; }
|
|
p.lead { margin: 0 auto 26px; max-width: 480px; color: #c9c9d2; font-size: 15px; line-height: 1.6; }
|
|
.steps { text-align: left; margin: 0 auto 30px; max-width: 470px; display: grid; gap: 12px; }
|
|
.step { display: flex; gap: 13px; align-items: flex-start; padding: 14px 16px;
|
|
background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07); border-radius: 13px; }
|
|
.step .n { flex: 0 0 26px; height: 26px; border-radius: 50%;
|
|
background: rgba(255,147,33,.16); color: var(--orange);
|
|
display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 13px; }
|
|
.step .t { font-size: 14px; line-height: 1.5; color: #e6e6ea; }
|
|
.step .t b { color: #fff; }
|
|
.cta { display: inline-block; margin-top: 6px; padding: 14px 30px; border-radius: 12px;
|
|
text-decoration: none; color: #fff; font-weight: 700; font-size: 15px;
|
|
background: linear-gradient(90deg, var(--orange), var(--blue)); box-shadow: 0 10px 25px rgba(0,0,0,.3); }
|
|
.fine { margin-top: 22px; font-size: 12px; color: #8a8a93; line-height: 1.6; }
|
|
.fine a { color: var(--blue); text-decoration: none; }
|
|
.demo-note { margin: -6px auto 24px; max-width: 470px; padding: 11px 15px; border-radius: 12px;
|
|
background: rgba(77,197,255,.12); border: 1px solid rgba(77,197,255,.32); color: #bfe6ff; font-size: 13px; line-height: 1.55; }
|
|
.ref { margin-top: 10px; font-size: 11px; color: #6f6f78; word-break: break-all; }
|
|
@media (max-width: 560px) { .card { padding: 34px 22px; } h1 { font-size: 23px; } }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<main class="card">
|
|
<div class="check">✓</div>
|
|
<span class="badge" id="badge">🎉 You're a Founding Member</span>
|
|
<h1 id="headline">Payment received — welcome to LynkedUp Pro</h1>
|
|
<p class="lead" id="lead">
|
|
Your Founders Lifetime License is locked in at the founder price. A confirmation
|
|
email is on its way, and our onboarding team will reach out shortly to get your
|
|
account set up.
|
|
</p>
|
|
<p class="demo-note" id="demoNote" hidden>
|
|
🎬 <b>Demo mode.</b> This was a walkthrough of the full flow — no payment was taken
|
|
and no card was charged.
|
|
</p>
|
|
|
|
<div class="steps">
|
|
<div class="step"><span class="n">1</span><span class="t"><b>Check your inbox.</b> Your receipt and a welcome email with next steps are on the way. (Peek in spam if you don't see them in a few minutes.)</span></div>
|
|
<div class="step"><span class="n">2</span><span class="t"><b>We'll set you up.</b> Our team will contact you at the details you provided to activate your license and walk you through onboarding.</span></div>
|
|
<div class="step"><span class="n">3</span><span class="t"><b>Watch for launch updates.</b> As a Founding Member you'll hear first about new features and your rollout timeline.</span></div>
|
|
</div>
|
|
|
|
<a class="cta" href="/">Close</a>
|
|
|
|
<p class="fine">
|
|
Questions? Email <a href="mailto:support@lynkeduppro.com">support@lynkeduppro.com</a> and reference your order below.
|
|
</p>
|
|
<p class="ref" id="ref"></p>
|
|
</main>
|
|
|
|
<script>
|
|
(function () {
|
|
var q = new URLSearchParams(location.search);
|
|
// Demo mode ($0 no-card flow from page/19.html): reframe the page so nobody
|
|
// thinks a real charge happened.
|
|
if (q.get("demo") === "1") {
|
|
document.getElementById("badge").textContent = "🎬 Demo complete";
|
|
document.getElementById("headline").innerHTML = "That's the full flow — start to finish";
|
|
document.getElementById("lead").textContent =
|
|
"You just walked through the entire Founders License journey. On the live page this is where the real payment would complete.";
|
|
document.getElementById("demoNote").hidden = false;
|
|
}
|
|
// Show the Stripe session id (from success_url) so support can look up the order.
|
|
var id = q.get("session_id");
|
|
if (id) document.getElementById("ref").textContent = "Order reference: " + id;
|
|
})();
|
|
</script>
|
|
</body>
|
|
</html>
|