fix header text

content/page/home/home.md

@@ -3,8 +3,10 @@ id: home
 metaTitle: ThreeFold | Home
 metaDesc: ThreeFold is the engine for a planet positive and data sovereign Internet. A collaborative movement of people who care about a better future.
 metaImg: ./home-bg_new.jpg
-header_slogan: from zero
+header_slogan: from 
-header_title: to one
+header_slogan2: zero
+header_title: to 
+header_title2: one
 header_image: ./home-bg_new.jpg
 header_img2 : ./from_zero.png
 

src/assets/scss/main.scss

@@ -183,7 +183,7 @@ button:focus {
 }
 
 .text-9xl {
-  font-size: 8rem;
+  font-size: 7rem;
   line-height: 1;
   
 }
@@ -210,6 +210,10 @@ button:focus {
   .tft_section h2{
     font-size: 3rem;
   }
+  .text-9xl {
+    font-size: 3rem;
+
+  }
 }
 
 @media (min-width: 768px) {

src/components/marketing/sections/cta-sections/Header.vue

@@ -257,20 +257,26 @@
     </div>
 
     <div
-      class="flex flex-wrap lg:text-left lg:pt-10 -mx-2"
+      class="flex flex-wrap lg:pt-10 pb-10"
       v-else-if="id == 'home'"
     >
       <div
-        class="px-2 lg:py-40 lg:mt-10 order-1 lg:order-none mx-auto text-center"
+        class="lg:py-40 px-2 lg:mt-10 order-1 lg:order-none text-center mx-auto"
       >
-        <div class="px-2 mt-20">
+        <!-- <div class="px-2 mt-20">
           <g-image :src="img2" :alt="altImg" />
-        </div>
+        </div> -->
-        <!-- <h2 class="text-8xl uppercase mb-6 mt-20 leading-none font-heading">
+        <h2 class="text-9xl uppercase mt-10 mb-0 leading-none font-normal text-left
-          <span class="">{{ slogan }}</span
+        ">
-          ><br />
+          {{ slogan }}
+          <span class="font-extrabold">{{ slogan2 }}</span>
+       
+        </h2>
+        <h2 class="text-9xl uppercase mb-6 mt-0 leading-none font-normal text-right 
+        ">
           {{ title }}
-        </h2> -->
+          <span class="font-extrabold">{{ title2 }}</span>
+        </h2>
 
         <div class="mb-8 text-xl leading-relaxed" v-html="excerpt"></div>
 
@@ -281,14 +287,14 @@
             class="
               inline-block
               bg-white
-              text-lg
+              lg:text-lg
               learn-button
               hover:bg-gray-400
               bo
               px-12
               py-1
               mr-5
-              mb-4
+              mb-2
               border-2
               shadow
               border-black
@@ -301,14 +307,14 @@
             class="
               inline-block
               bg-white
-              text-lg
+              lg:text-lg
               learn-button
               hover:bg-gray-400
               bo
               px-12
               py-1
               mr-5
-              mb-4
+              mb-2
               border-2
               shadow
               border-black
@@ -325,14 +331,14 @@
             class="
               inline-block
               bg-white
-              text-lg
+              lg:text-lg
               learn-button
               hover:bg-gray-400
               bo
               px-12
               py-1
               mr-5
-              mb-4
+              mb-2
               border-2
               shadow
               border-black
@@ -345,14 +351,14 @@
             class="
               inline-block
               bg-white
-              text-lg
+              lg:text-lg
               learn-button
               hover:bg-gray-400
               bo
               px-12
               py-1
               mr-5
-              mb-4
+              mb-2
               border-2
               shadow
               border-black
@@ -369,14 +375,14 @@
             class="
               inline-block
               bg-white
-              text-lg
+              lg:text-lg
               learn-button
               hover:bg-gray-400
               bo
               px-12
               py-1
               mr-5
-              mb-4
+              mb-2
               border-2
               shadow
               border-black
@@ -389,14 +395,14 @@
             class="
               inline-block
               bg-white
-              text-lg
+              lg:text-lg
               learn-button
               hover:bg-gray-400
               bo
               px-12
               py-1
               mr-5
-              mb-4
+              mb-2
               border-2
               shadow
               border-black
@@ -554,8 +560,10 @@
 export default {
   props: [
     "title",
+    "title2",
     "id",
     "slogan",
+    "slogan2",
     "excerpt",
     "altImg",
     "image",

src/pages/Index.vue

@@ -5,6 +5,8 @@
         :id="$page.markdownPage.id"
         :title="$page.markdownPage.header_title"
         :slogan="$page.markdownPage.header_slogan"
+        :title2="$page.markdownPage.header_title2"
+        :slogan2="$page.markdownPage.header_slogan2"
         :image="$page.markdownPage.header_image"
         :img2="$page.markdownPage.header_img2"
         :altImg="$page.markdownPage.header_altImg"
@@ -98,6 +100,8 @@
         metaImg
         header_slogan
         header_title
+        header_slogan2
+        header_title2
         header_image
         header_img2
         header_excerpt