add thank you page, download page, payment page
This commit is contained in:
+137
@@ -0,0 +1,137 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-G9G5HP50VK"></script>
|
||||
<script>window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments);}gtag('js',new Date());gtag('config','G-G9G5HP50VK');</script>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Thank You for Your Purchase | INDOTALENT</title>
|
||||
<meta name="description" content="Thank you for purchasing an Indotalent product. Your download link will be sent to your registered email address automatically." />
|
||||
<meta name="robots" content="noindex, nofollow" />
|
||||
<link rel="canonical" href="https://www.indotalent.com/thank-you.html" />
|
||||
<link rel="icon" type="image/x-icon" href="favicon.ico" />
|
||||
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><rect width='32' height='32' rx='6' fill='%23f97316'/><text x='16' y='22' font-size='18' font-weight='bold' text-anchor='middle' fill='white'>I</text></svg>" />
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/ScrollTrigger.min.js"></script>
|
||||
<script>tailwind.config={theme:{extend:{colors:{brand:{50:'#fff7ed',100:'#ffedd5',200:'#fed7aa',300:'#fdba74',400:'#fb923c',500:'#f97316',600:'#ea580c',700:'#c2410c',800:'#9a3412',900:'#7c2d12'}},fontFamily:{sans:['Inter','system-ui','-apple-system','sans-serif']}}}}</script>
|
||||
<style>
|
||||
[x-cloak]{display:none!important} html{scroll-behavior:smooth}
|
||||
.nav-blur{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
|
||||
.gradient-text{background:linear-gradient(135deg,#f97316 0%,#ea580c 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
|
||||
.btn-primary{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f97316 0%,#ea580c 100%);color:#fff;font-weight:600;border-radius:12px;padding:12px 24px;transition:all 0.2s;box-shadow:0 4px 14px -4px rgba(249,115,22,0.35)}
|
||||
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 20px -4px rgba(249,115,22,0.45)}
|
||||
.btn-secondary{display:inline-flex;align-items:center;justify-content:center;background:#fff;color:#374151;font-weight:600;border-radius:12px;padding:12px 24px;border:1px solid #e5e7eb;transition:all 0.2s}
|
||||
.btn-secondary:hover{border-color:#f97316;color:#f97316}
|
||||
.success-icon{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,#d1fae5 0%,#a7f3d0 100%);display:flex;align-items:center;justify-content:center;margin:0 auto}
|
||||
.success-icon svg{width:36px;height:36px;color:#059669}
|
||||
</style>
|
||||
</head>
|
||||
<body class="bg-white text-gray-900 antialiased">
|
||||
|
||||
<!-- NAVBAR -->
|
||||
<nav class="fixed top-0 left-0 right-0 z-50 nav-blur bg-white/85 border-b border-gray-200/60">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex items-center justify-between h-16 lg:h-18">
|
||||
<a href="index.html" class="flex items-center gap-2.5"><img src="img/logo-indotalent-dark.svg" alt="Indotalent" class="h-8 w-auto" /></a>
|
||||
<div class="flex items-center gap-3">
|
||||
<a href="index.html" class="btn-secondary text-sm py-2.5 px-5">Back to Home</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- THANK YOU MAIN -->
|
||||
<section class="min-h-screen flex items-center justify-center pt-20 pb-16">
|
||||
<div class="absolute inset-0 opacity-[0.015]" style="background-image:radial-gradient(circle at 1px 1px,#f97316 1px,transparent 0);background-size:40px 40px"></div>
|
||||
<div class="max-w-2xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10 w-full">
|
||||
<div id="thankYouCard" class="bg-white border border-gray-200 rounded-3xl shadow-lg p-8 sm:p-10 lg:p-12 text-center">
|
||||
|
||||
<!-- Success Icon -->
|
||||
<div class="success-icon mb-6">
|
||||
<svg fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<!-- Heading -->
|
||||
<h1 class="text-3xl sm:text-4xl font-extrabold text-gray-900 mb-4 tracking-tight">
|
||||
Thank You for <span class="gradient-text">Your Purchase</span>
|
||||
</h1>
|
||||
<p class="text-gray-500 text-base sm:text-lg mb-8 max-w-lg mx-auto">
|
||||
We truly appreciate your support. You're now part of the Indotalent community.
|
||||
</p>
|
||||
|
||||
<!-- Divider -->
|
||||
<div class="w-16 h-0.5 bg-gradient-to-r from-brand-400 to-brand-600 mx-auto mb-8"></div>
|
||||
|
||||
<!-- Info Section 1: Download Link -->
|
||||
<div class="bg-brand-50/60 border border-brand-100 rounded-2xl p-6 sm:p-8 mb-6 text-left">
|
||||
<div class="flex items-start gap-4">
|
||||
<div class="w-10 h-10 rounded-xl bg-brand-100 flex items-center justify-center shrink-0 mt-0.5">
|
||||
<svg class="w-5 h-5 text-brand-600" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5M16.5 12L12 16.5m0 0L7.5 12m4.5 4.5V3" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h2 class="text-lg font-semibold text-gray-900 mb-2">Download Link Sent Automatically</h2>
|
||||
<p class="text-sm text-gray-600 leading-relaxed">
|
||||
Your download link will be sent automatically to the email address you provided during checkout.
|
||||
Please ensure that your email inbox is not full and that the email address is valid
|
||||
so you don't miss the delivery.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Info Section 2: Contact Support -->
|
||||
<div class="bg-gray-50 border border-gray-200 rounded-2xl p-6 sm:p-8 mb-8 text-left">
|
||||
<div class="flex items-start gap-4">
|
||||
<div class="w-10 h-10 rounded-xl bg-gray-200 flex items-center justify-center shrink-0 mt-0.5">
|
||||
<svg class="w-5 h-5 text-gray-600" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h2 class="text-lg font-semibold text-gray-900 mb-2">Didn't Receive the Email?</h2>
|
||||
<p class="text-sm text-gray-600 leading-relaxed">
|
||||
If you haven't received your download link within a few minutes, please check your spam or promotions folder.
|
||||
If it's still not there, feel free to contact us at
|
||||
<a href="mailto:hi@indotalent.com" class="text-brand-600 hover:text-brand-700 font-semibold underline underline-offset-2">hi@indotalent.com</a>
|
||||
and we will assist you promptly.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- CTA Buttons -->
|
||||
<div class="flex flex-col sm:flex-row items-center justify-center gap-3">
|
||||
<a href="index.html" class="btn-primary text-sm px-8 py-3.5 w-full sm:w-auto">Return to Homepage</a>
|
||||
<a href="mailto:hi@indotalent.com" class="btn-secondary text-sm px-8 py-3.5 w-full sm:w-auto">Contact Support</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- FOOTER -->
|
||||
<footer class="bg-white border-t border-gray-200">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
|
||||
<div class="grid grid-cols-2 md:grid-cols-4 gap-8">
|
||||
<div class="col-span-2 md:col-span-1"><a href="index.html" class="flex items-center gap-2 mb-3"><img src="img/logo-indotalent-dark.svg" alt="Indotalent" class="h-6 w-auto" /></a><p class="text-xs text-gray-500 leading-relaxed">Enterprise .NET 10 & Blazor complete source code. Back End + Front End in one VSA monolith. Thank you for your support.</p></div>
|
||||
<div><h5 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-3">Products</h5><ul class="space-y-2"><li><a href="index.html#products" class="text-sm text-gray-500 hover:text-brand-500">CRM</a></li><li><a href="index.html#products" class="text-sm text-gray-500 hover:text-brand-500">CMS</a></li><li><a href="index.html#products" class="text-sm text-gray-500 hover:text-brand-500">HRM</a></li><li><a href="index.html#products" class="text-sm text-gray-500 hover:text-brand-500">SCM</a></li><li><a href="index.html#products" class="text-sm text-gray-500 hover:text-brand-500">WMS</a></li></ul></div>
|
||||
<div><h5 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-3">Resources</h5><ul class="space-y-2"><li><a href="https://github.com/go2ismail" target="_blank" rel="noopener" class="text-sm text-gray-500 hover:text-brand-500">GitHub</a></li><li><a href="blog.html" class="text-sm text-gray-500 hover:text-brand-500">Blog</a></li><li><a href="support.html" class="text-sm text-gray-500 hover:text-brand-500">Support</a></li></ul></div>
|
||||
<div><h5 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-3">Company</h5><ul class="space-y-2"><li><a href="privacy-policy.html" class="text-sm text-gray-500 hover:text-brand-500">Privacy</a></li><li><a href="no-refund-policy.html" class="text-sm text-gray-500 hover:text-brand-500">No Refund</a></li><li><a href="license.html" class="text-sm text-gray-500 hover:text-brand-500">License</a></li><li><a href="mailto:hi@indotalent.com" class="text-sm text-gray-500 hover:text-brand-500">Contact</a></li></ul></div>
|
||||
</div>
|
||||
<div class="border-t border-gray-200 mt-8 pt-6 flex flex-col md:flex-row items-center justify-between gap-4"><p class="text-xs text-gray-500">© 2024-2026 Indotalent. All rights reserved.</p><p class="text-xs text-gray-500">Built with <span class="text-brand-500">♥</span> by go2ismail</p></div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded',function(){
|
||||
gsap.registerPlugin(ScrollTrigger);
|
||||
gsap.fromTo('#thankYouCard',{autoAlpha:0,y:40,scale:.98},{autoAlpha:1,y:0,scale:1,duration:.7,ease:'power4.out'});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user