From 077e9e7aa6e3e7fb9a4bbac6be6f441d17b6737e Mon Sep 17 00:00:00 2001
From: Adeyemi Adetunji <tvnji01@gmail.com>
Date: Tue, 12 Nov 2024 12:35:13 +0100
Subject: [PATCH] fix: restructure free tools section on landing page (#510)

---
 .../src/lib/Home/MoreFeatures.svelte          | 23 ++++++++++---------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/apps/classroomio-com/src/lib/Home/MoreFeatures.svelte b/apps/classroomio-com/src/lib/Home/MoreFeatures.svelte
index 0098b10f..e0d80902 100644
--- a/apps/classroomio-com/src/lib/Home/MoreFeatures.svelte
+++ b/apps/classroomio-com/src/lib/Home/MoreFeatures.svelte
@@ -109,18 +109,18 @@
     </div>
 
     <!-- free tools section -->
-    <div>
-      <div class="flex justify-evenly gap-y-8 flex-wrap w-full mt-10 mx-auto">
-        <div class="text-center">
-          <h1 class="text-3xl md:text-5xl font-bold">
-            Explore Our <span class="text-[#0233BD]">Free Tools</span>
-          </h1>
-          <p class="text-sm md:text-base text-[#334155] md:w-[65%] mt-5 md:mt-10 mx-auto">
-            Innovative tools to help you aid you example preparation, as well as making learning
-            more fun for students and educator looking for engaging resources.
-          </p>
-        </div>
+    <div class="mt-10">
+      <div class="text-center">
+        <h1 class="text-3xl md:text-5xl font-bold m-0">
+          Explore Our <span class="text-[#0233BD]">Free Tools</span>
+        </h1>
+        <p class="text-sm md:text-base text-[#334155] md:w-[65%] mt-5 mx-auto">
+          Innovative tools to help you aid you example preparation, as well as making learning more
+          fun for students and educator looking for engaging resources.
+        </p>
+      </div>
 
+      <div class="flex justify-evenly gap-y-8 flex-wrap w-full mt-10 mx-auto">
         {#each freeTools as tool}
           <a
             class="w-full flex flex-col gap-3 max-w-[400px] md:max-w-[300px] mt-5 p-5 border rounded-md bg-white shadow-sm hover:scale-95 transition-all ease-in-out cursor-pointer"
@@ -136,6 +136,7 @@
           </a>
         {/each}
       </div>
+
       <div class="flex justify-center items-center mt-20">
         <a
           class="md:text-base w-full md:max-w-[300px] max-w-[400px] rounded-md bg-blue-700 px-6 py-3 lg:px-6 lg:py-3 text-sm font-medium text-white text-center transition-all delay-100 hover:bg-blue-800 hover:shadow-xl hover:scale-95 lg:font-semibold cursor-pointer"