From 19a6327297031519330ebd8f7ad439113e88d511 Mon Sep 17 00:00:00 2001
From: Freeze455 <baptiste.parmantier.pro@gmail.com>
Date: Tue, 17 Aug 2021 09:55:08 +0200
Subject: [PATCH] :construction: Work in progress

---
 src/components/{CollapseDemo.vue => CodeDemo.vue} |  6 +++---
 src/templates/modules/default/Home.vue            | 12 +++++++++---
 2 files changed, 12 insertions(+), 6 deletions(-)
 rename src/components/{CollapseDemo.vue => CodeDemo.vue} (92%)

diff --git a/src/components/CollapseDemo.vue b/src/components/CodeDemo.vue
similarity index 92%
rename from src/components/CollapseDemo.vue
rename to src/components/CodeDemo.vue
index 307e071..93133bf 100644
--- a/src/components/CollapseDemo.vue
+++ b/src/components/CodeDemo.vue
@@ -1,11 +1,11 @@
 <template>
-  <div class="flex space-x-5">
-    <div class="w-1/2">
+  <div class="px-5 sm:px-0 flex flex-col sm:flex-row space-y-5 sm:space-y-0 sm:space-x-5">
+    <div class="sm:w-1/2">
       <Collapse
         :items="collapseHighlighting"
         @handleChange="handleChange" />
     </div>
-    <div class="flex w-1/2 bg-[#263238] rounded-lg overflow-hidden">
+    <div class="flex sm:w-1/2 bg-[#263238] rounded-lg overflow-hidden">
       <transition
         enter-active-class="transition ease-out duration-300"
         enter-from-class="transform opacity-0"
diff --git a/src/templates/modules/default/Home.vue b/src/templates/modules/default/Home.vue
index e13c2d5..cd4aa66 100644
--- a/src/templates/modules/default/Home.vue
+++ b/src/templates/modules/default/Home.vue
@@ -22,12 +22,18 @@
       </div>
     </div>
   </div>
-  <div class="bg-white dark:bg-gray-900 py-20">
+  <div class="bg-white dark:bg-gray-900 py-10 sm:pt-14 sm:pb-32">
     <div class="max-w-8xl mx-auto">
       <Hightlight />
     </div>
   </div>
-  <div class="bg-white dark:bg-gray-900 py-10">
+  <div class="bg-white dark:bg-gray-900 py-10 space-y-20">
+    <div class="px-5 sm:px-0 text-center md:max-w-3xl md:mx-auto md:px-12">
+      <h2 class="text-gray-800 dark:text-gray-200 text-3xl sm:text-4xl font-title font-semibold md:text-6xl">All discord.js features in one place</h2>
+      <p class="text-lg mt-8 text-gray-500 md:text-xl">
+        AdonisJS is not a minimalist framework. To give your projects a head start, we pack many baseline features within the core of the framework.
+      </p>
+    </div>
     <div class="max-w-6xl mx-auto">
       <CollapseDemo />
     </div>
@@ -36,6 +42,6 @@
 
 <script setup lang="ts">
 import Hightlight from '../../../components/Hightlight.vue'
-import CollapseDemo from '../../../components/CollapseDemo.vue'
+import CollapseDemo from '../../../components/CodeDemo.vue'
 
 </script>
\ No newline at end of file