Some tweaks to the spurt

3 files changed, 20 insertions, 15 deletions

diff --git a/alphabetlearning/payments/views.py b/alphabetlearning/payments/views.py
index e9f2ded..07a0177 100644
--- a/alphabetlearning/payments/views.py
+++ b/alphabetlearning/payments/views.py
@@ -40,6 +40,11 @@ stripe.api_key = settings.STRIPE_SECRET_KEY
 class SuccessEmailSignupView(TemplateView):
     template_name = "payments/success_email_signup.html"
 
+    def get_context_data(self, **kwargs):
+        context = super().get_context_data(**kwargs)
+        context['email'] = self.request.POST.get('email')
+        return context
+
 def email_signup(request):
     if request.method == 'POST':
         email = request.POST.get('email')
diff --git a/alphabetlearning/templates/pages/home.html b/alphabetlearning/templates/pages/home.html
index 40f7861..d837dbb 100644
--- a/alphabetlearning/templates/pages/home.html
+++ b/alphabetlearning/templates/pages/home.html
@@ -81,7 +81,7 @@
                 Bonus offer!
             </h2>
             <p class="display-6 mb-4" style="color: darkgray;">
-                Additionally, we will give a 50% discount to the first fifty customers who join our mailing list, issued once the site is live.
+                As a thank-you, the first fifty customers who join our mailing list will receive a 50% discount once the site is live.
             </p>
         </div>
     </div>
@@ -105,22 +105,22 @@
         "
     />
 
-    <div class="row justify-content-center my-5">
-        <div class="col-md-4 sm-mb-5">
+    <div class="row justify-content-center">
+        <div class="col-md-4 mb-5 mb-md-0">
             <img
                 src="{% static 'images/funnel4.png' %}"
                 class="img-fluid rotated-image"
                 alt="Funnel 1"
             />
         </div>
-        <div class="col-md-4">
+        <div class="col-md-4 mb-5 mb-md-0">
             <img
                 src="{% static 'images/funnel5.png' %}"
                 class="img-fluid rotated-image"
                 alt="Funnel 2"
             />
         </div>
-        <div class="col-md-4">
+        <div class="col-md-4 mb-5 mb-md-0">
             <img
                 src="{% static 'images/funnel6.png' %}"
                 class="img-fluid rotated-image"
@@ -155,21 +155,21 @@
 
 
     <div class="row justify-content-center my-5">
-        <div class="col-md-4">
+        <div class="col-md-4 mb-5 mb-md-0">
             <img
                 src="{% static 'images/funnel1.png' %}"
                 class="img-fluid rotated-image"
                 alt="Funnel 1"
             />
         </div>
-        <div class="col-md-4">
+        <div class="col-md-4 mb-5 mb-md-0">
             <img
                 src="{% static 'images/funnel2.png' %}"
                 class="img-fluid rotated-image"
                 alt="Funnel 2"
             />
         </div>
-        <div class="col-md-4">
+        <div class="col-md-4 mb-5 mb-md-0">
             <img
                 src="{% static 'images/funnel3.png' %}"
                 class="img-fluid rotated-image"
diff --git a/alphabetlearning/templates/payments/success_email_signup.html b/alphabetlearning/templates/payments/success_email_signup.html
index 11fd4d2..5b3b9f7 100644
--- a/alphabetlearning/templates/payments/success_email_signup.html
+++ b/alphabetlearning/templates/payments/success_email_signup.html
@@ -6,14 +6,14 @@
 <style>
     .celebration-container {
         position: relative;
-        height: 450px;
+        height: 500px;
         overflow: hidden;
         background-color: white;
     }
 
     .letter {
         position: absolute;
-        font-size: 2rem;
+        font-size: 4rem;
         font-weight: bold;
         opacity: 1;
         bottom: 100px;
@@ -74,10 +74,10 @@
             </h2>
             <div>
                 <p class="mb-4 fs-5">
-                    We are very excited to have you join us at Alphabet Learning! 
+                    We are very excited to have you {{ email }} join us at Alphabet Learning! 
                     You will be updated before we are due to go live (this is currently estimated to be Spring 2025). 
                     Once we are live we will also send you the <strong>FREE</strong> resource credits AND a <strong>50% discount</strong>.
-                    As you're an early bird, tell your friends if they too would benefit from these exclusive rewards.
+                    As you're an early bird, tell your friends so that they too could benefit from these exclusive offers.
                 </p>
 
                 <p class="mb-4 fs-5">
@@ -98,9 +98,9 @@
     <script>
         function initCelebration() {
             const letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
-            const colors = ['#FF6B6B', '#4ECDC4', '#45B7D1', '#96CEB4', '#FFEEAD', '#D4A5A5', '#9B59B6'];
+            const colors = ['#ff5258', '#ff9d3e', '#ffd850', '#2dc62b', '#197ceb', '#f19de0', '#9472eb', '#24dabc'];
             const container = document.querySelector('.celebration-container');
-            const totalLetters = 220;
+            const totalLetters = 420;
             
             function createSpray() {
                 for(let i = 0; i < totalLetters; i++) {
@@ -112,7 +112,7 @@
                         
                         // Calculate spray angle (-60 to 60 degrees)
                         const angle = (Math.random() * 120 - 60) * (Math.PI / 180);
-                        const speed = 500 + Math.random() * 200; // Random speed for variety
+                        const speed = 200 + Math.random() * 200; // Random speed for variety
                         
                         // Tighter initial spread at the source
                         const initialSpread = Math.random() * 10 - 5;