wip: working

1 files changed, 24 insertions, 24 deletions

diff --git a/alphabetlearning/templates/pages/home.html b/alphabetlearning/templates/pages/home.html
index 8f74836..e06f65d 100644
--- a/alphabetlearning/templates/pages/home.html
+++ b/alphabetlearning/templates/pages/home.html
@@ -3,11 +3,11 @@
 <div class="container text-center">
     <div class="row">
         <div class="px-4 py-5 mt-5 mb-0">
-            <h1 class="display-5 fw-bold">Welcome, friend!</h1>
-            <p class="lead mb-4 mt-4 bg-light p-4 rounded">
-                Alphabet Learning is a brand new platform selling high quality
-                educational resources. As of December 2024, the site is
-                currently in active development and will be launched soon.
+            <h1 class="display-1 fw-bold">hello!</h1>
+            <p class="display-6 mb-4 mt-4 p-4 rounded" style="color: lightgray;">
+                <span style="color: red;">Alphabet Learning</span> is a brand new platform selling high quality
+                <span style="color: orange;">educational resources</span>. As of <span style="color: yellow;">December 2024</span>, the site is
+                <span style="color: green;">currently in active development</span> and will be <span style="color: blue;">launched soon</span>.
             </p>
         </div>
     </div>
@@ -18,13 +18,13 @@
             height: 10px;
             background: linear-gradient(
                 to right,
-                red,
-                orange,
-                yellow,
-                green,
-                blue,
-                indigo,
-                violet
+                #FF0000,
+                #FF8C00,
+                #FFFF00,
+                #32CD32,
+                #0000FF,
+                #4B0082,
+                #8A2BE2
             );
             width: 100%;
             margin: 20px 0;
@@ -34,21 +34,21 @@
     <div class="row justify-content-center my-5">
         <div class="col-md-4">
             <img
-                src="{% static 'images/funnel1_initial_sounds.png' %}"
+                src="{% static 'images/funnel1.png' %}"
                 class="img-fluid rotated-image"
                 alt="Funnel 1"
             />
         </div>
         <div class="col-md-4">
             <img
-                src="{% static 'images/funnel2_picture_match_words.png' %}"
+                src="{% static 'images/funnel2.png' %}"
                 class="img-fluid rotated-image"
                 alt="Funnel 2"
             />
         </div>
         <div class="col-md-4">
             <img
-                src="{% static 'images/funnel3_handwriting.png' %}"
+                src="{% static 'images/funnel3.png' %}"
                 class="img-fluid rotated-image"
                 alt="Funnel 3"
             />
@@ -139,21 +139,21 @@
     <div class="row justify-content-center my-5">
         <div class="col-md-4">
             <img
-                src="{% static 'images/funnel4_order_numbers.png' %}"
+                src="{% static 'images/funnel4.png' %}"
                 class="img-fluid rotated-image"
                 alt="Funnel 1"
             />
         </div>
         <div class="col-md-4">
             <img
-                src="{% static 'images/funnel5_ug_words.png' %}"
+                src="{% static 'images/funnel5.png' %}"
                 class="img-fluid rotated-image"
                 alt="Funnel 2"
             />
         </div>
         <div class="col-md-4">
             <img
-                src="{% static 'images/funnel6_2D_shape_match.png' %}"
+                src="{% static 'images/funnel6.png' %}"
                 class="img-fluid rotated-image"
                 alt="Funnel 3"
             />
@@ -163,7 +163,7 @@
         <div class="col-lg-12">
             <div
                 style="
-                    background-color: #edade0;
+                    background-color: #f19de0;
                     padding: 20px;
                     border-radius: 10px;
                     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
@@ -193,7 +193,7 @@
                 {% csrf_token %}
                 <div
                     style="
-                        background-color: #91dacd;
+                        background-color: #9372eb;
                         padding: 20px;
                         border-radius: 10px;
                         box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
@@ -208,7 +208,7 @@
                                 font-weight: bold;
                                 color: #333;
                             "
-                            >Your story starts here...</label
+                            >1, 2, 3...</label
                         >
                         <input
                             type="email"
@@ -218,7 +218,7 @@
                             required
                             placeholder="Your email address..."
                             style="
-                                border: 2px solid #25daba;
+                                border: 2px solid #855feb;
                                 height: 60px;
                                 border-radius: 5px;
                                 transition: border-color 0.3s;
@@ -226,8 +226,8 @@
                         />
                     </div>
                     <div class="d-flex justify-content-end">
-                        <p class="me-2 my-2" style="font-size: 1.5rem; font-weight: bold;">...easy as A, B, C!</p>
-                        <button type="submit" class="email-submit-button">
+                        <p class="me-2 my-2" style="font-size: 1.5rem; font-weight: bold;">easy as a, b, c...</p>
+                        <button type="submit" class="email-submit-button" onclick="floatLetters()">
                             Submit
                         </button>
                     </div>