update lifetime discount text

This commit is contained in:
nate 2026-04-10 13:59:36 +04:00
parent 824cb15faa
commit 9c156c91e6
1 changed files with 13 additions and 11 deletions

View File

@ -9,8 +9,11 @@
const totalSpent = it.totalSpent || 0; const totalSpent = it.totalSpent || 0;
const maxLifetimeTier = it.maxLifetimeTier || 0; const maxLifetimeTier = it.maxLifetimeTier || 0;
const lifetimeBase = 140; const lifetimeBase = 140;
const lifetimePrices = { lifetime: lifetimeBase, lifetime2x: lifetimeBase * 2, lifetime4x: lifetimeBase * 4 }; function ltPrice(base) { return Math.max(base - Math.min(totalSpent, base * 0.90), 1); }
const lifetimeCredit = Math.min(totalSpent, lifetimeBase * 0.90); const lt1 = ltPrice(lifetimeBase);
const lt2 = ltPrice(lifetimeBase * 2);
const lt4 = ltPrice(lifetimeBase * 4);
const hasCredit = totalSpent > 0;
%> %>
<style> <style>
@ -65,7 +68,11 @@
class="cursor-pointer text-left bg-surface border-2 border-border-subtle hover:border-yellow-500/40 rounded-xl p-5 transition-colors relative"> class="cursor-pointer text-left bg-surface border-2 border-border-subtle hover:border-yellow-500/40 rounded-xl p-5 transition-colors relative">
<span class="absolute top-3 right-3 text-[10px] font-semibold px-2 py-0.5 rounded-full bg-yellow-500/15 text-yellow-500 border border-yellow-500/20">Launch Deal</span> <span class="absolute top-3 right-3 text-[10px] font-semibold px-2 py-0.5 rounded-full bg-yellow-500/15 text-yellow-500 border border-yellow-500/20">Launch Deal</span>
<div class="text-xs text-yellow-500/70 uppercase tracking-wider font-mono mb-1">Lifetime</div> <div class="text-xs text-yellow-500/70 uppercase tracking-wider font-mono mb-1">Lifetime</div>
<% if (hasCredit) { %>
<div class="text-2xl font-bold text-gray-100">From $<%= Math.round(lt1) %> <span class="text-sm font-normal text-gray-600 line-through">$<%= lifetimeBase %></span></div>
<% } else { %>
<div class="text-2xl font-bold text-gray-100">From $<%= lifetimeBase %></div> <div class="text-2xl font-bold text-gray-100">From $<%= lifetimeBase %></div>
<% } %>
<div class="text-xs text-gray-500 mt-2">One-time, 200-800 monitors forever</div> <div class="text-xs text-gray-500 mt-2">One-time, 200-800 monitors forever</div>
</label> </label>
<% } %> <% } %>
@ -109,7 +116,7 @@
<% if (maxLifetimeTier < 1) { %> <% if (maxLifetimeTier < 1) { %>
<button type="button" class="lt-btn text-center bg-surface border-2 border-yellow-500/50 rounded-lg py-2.5 transition-colors" data-plan="lifetime"> <button type="button" class="lt-btn text-center bg-surface border-2 border-yellow-500/50 rounded-lg py-2.5 transition-colors" data-plan="lifetime">
<div class="text-sm font-semibold text-gray-200">1x</div> <div class="text-sm font-semibold text-gray-200">1x</div>
<div class="text-xs text-gray-500">200 monitors · $<%= lifetimeBase %></div> <div class="text-xs text-gray-500">200 monitors · <% if (hasCredit) { %><span class="text-green-400">$<%= Math.round(lt1) %></span> <span class="line-through">$<%= lifetimeBase %></span><% } else { %>$<%= lifetimeBase %><% } %></div>
</button> </button>
<% } else { %> <% } else { %>
<div class="text-center bg-surface border-2 border-border-subtle rounded-lg py-2.5 opacity-40 cursor-not-allowed"> <div class="text-center bg-surface border-2 border-border-subtle rounded-lg py-2.5 opacity-40 cursor-not-allowed">
@ -118,9 +125,9 @@
</div> </div>
<% } %> <% } %>
<% if (maxLifetimeTier < 2) { %> <% if (maxLifetimeTier < 2) { %>
<button type="button" class="lt-btn text-center bg-surface border-2 border-border-subtle hover:border-yellow-500/40 rounded-lg py-2.5 transition-colors <%= maxLifetimeTier >= 1 ? '' : '' %>" data-plan="lifetime2x"> <button type="button" class="lt-btn text-center bg-surface border-2 border-border-subtle hover:border-yellow-500/40 rounded-lg py-2.5 transition-colors" data-plan="lifetime2x">
<div class="text-sm font-semibold text-gray-200">2x</div> <div class="text-sm font-semibold text-gray-200">2x</div>
<div class="text-xs text-gray-500">400 monitors · $<%= lifetimeBase * 2 %></div> <div class="text-xs text-gray-500">400 monitors · <% if (hasCredit) { %><span class="text-green-400">$<%= Math.round(lt2) %></span> <span class="line-through">$<%= lifetimeBase * 2 %></span><% } else { %>$<%= lifetimeBase * 2 %><% } %></div>
</button> </button>
<% } else { %> <% } else { %>
<div class="text-center bg-surface border-2 border-border-subtle rounded-lg py-2.5 opacity-40 cursor-not-allowed"> <div class="text-center bg-surface border-2 border-border-subtle rounded-lg py-2.5 opacity-40 cursor-not-allowed">
@ -130,15 +137,10 @@
<% } %> <% } %>
<button type="button" class="lt-btn text-center bg-surface border-2 border-border-subtle hover:border-yellow-500/40 rounded-lg py-2.5 transition-colors" data-plan="lifetime4x"> <button type="button" class="lt-btn text-center bg-surface border-2 border-border-subtle hover:border-yellow-500/40 rounded-lg py-2.5 transition-colors" data-plan="lifetime4x">
<div class="text-sm font-semibold text-gray-200">4x</div> <div class="text-sm font-semibold text-gray-200">4x</div>
<div class="text-xs text-gray-500">800 monitors · $<%= lifetimeBase * 4 %></div> <div class="text-xs text-gray-500">800 monitors · <% if (hasCredit) { %><span class="text-green-400">$<%= Math.round(lt4) %></span> <span class="line-through">$<%= lifetimeBase * 4 %></span><% } else { %>$<%= lifetimeBase * 4 %><% } %></div>
</button> </button>
</div> </div>
</div> </div>
<% if (totalSpent > 0) { %>
<div id="lifetime-credit" class="text-xs text-green-400/70">
You've spent $<%= totalSpent.toFixed(0) %> with us. Up to 90% of the lifetime price is credited.
</div>
<% } %>
</div> </div>
<!-- Coin selection --> <!-- Coin selection -->