fix: landing page improvements

apps/classroomio-com/src/lib/Navigation/Navigation.svelte

@@ -108,9 +108,9 @@
         <li class="text-gray-800 font-semibold text-sm cursor-pointer">Pricing</li>
       </a>
       <!-- Docs -->
-      <!-- <a href="/docs" target="_blank">
+      <a href="/docs" target="_blank">
         <li class="text-gray-800 font-semibold text-sm cursor-pointer">Docs</li>
-      </a> -->
+      </a>
       <!-- Blog -->
       <a href="/blog">
         <li class="text-gray-800 font-semibold text-sm cursor-pointer">Blog</li>
@@ -206,14 +206,14 @@
             <li>Pricing</li>
           </a>
           <!-- Docs -->
-          <!-- <a
+          <a
             class="text-gray-800 font-semibold text-sm md:text-lg cursor-pointer hover:bg-gray-100 py-3 px-4 rounded-md w-full"
             on:click={handleShowNav}
             href="/docs"
             target="_blank"
           >
             <li>Docs</li>
-          </a> -->
+          </a>
 
           <!-- Blog -->
           <a

apps/classroomio-com/src/routes/teach/+page.svelte

@@ -176,13 +176,13 @@
       </div>
     </div>
 
-    <div class="px-[12%] bg-[#F5F8FE] my-10 py-12 h-[75%] lg:h-[80%]">
+    <div class="px-2 lg:px-[12%] bg-[#F5F8FE] my-10 py-12 h-[75%] lg:h-[80%]">
       <h1 class="text-2xl text-center font-bold flex gap-3 justify-center items-center">
         Word from our fufilled facilitators
       </h1>
 
       <div
-        class="mt-10 w-[50%] mx-auto border shadow-sm bg-white rounded-md text-center py-6 relative before:w-[4.5%] before:absolute before:left-0 before:top-0 before:h-full before:bg-[#0233BD] before:rounded-tl-md before:rounded-bl-md"
+        class="mt-10 w-full md:w-2/4 mx-auto border shadow-sm bg-white rounded-md text-center py-6 relative before:w-[4.5%] before:absolute before:left-0 before:top-0 before:h-full before:bg-[#0233BD] before:rounded-tl-md before:rounded-bl-md"
       >
         <h1 class="text-base font-medium leading-5 w-[77%] mx-auto">
           With ClassroomIO, I am training over 100 students. I am making more money than expected
@@ -197,7 +197,7 @@
       </div>
     </div>
 
-    <div class="px-[10%] lg:px-[15%] lg:max-w-[65%] my-10 mt-10 mx-auto">
+    <div class="px-10 lg:px-[15%] lg:max-w-[65%] my-10 mt-10 mx-auto">
       <h1 class="text-2xl text-center font-bold">Frequently asked questions</h1>
 
       <div class="mt-10">
@@ -206,7 +206,7 @@
             <div>
               <button
                 type="button"
-                class="w-full font-medium text-lg my-2 flex justify-between"
+                class="w-full font-medium text-sm md:text-lg my-2 flex justify-between text-left md:text-center"
                 on:click={() => toggleAnswer(index)}
               >
                 {faq.question} <span>{faq.showAnswer ? '-' : '+'}</span>