update home page

src/components/custom/sections/CallToAction.vue

@@ -43,8 +43,3 @@ export default {
   props: ["cta"],
 };
 </script>
-<style scoped>
-.bg-hero {
-        background-image: url("~@/assets/images/bottom_cta.png");
-    }
-</style>

src/components/custom/sections/CallToActionbg1.vue

@@ -0,0 +1,50 @@
+<template>
+  <section class="pt-10 pb-10 px-4 bg-cover bg-hero text-center">
+ 
+    <div class="w-full  py-10 max-w-7xl mx-auto">
+      <h2 class="text-4xl text-white leading-tight font-semibold font-heading uppercase">
+        {{ cta.title1 }} 
+        <br>
+        {{ cta.title2 }}
+      </h2>
+      <div
+        v-html="cta.content"
+        class="mt-6 mb-20 text-white leading-relaxed "
+      ></div>
+
+
+       <a
+          class="inline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full" 
+          target="_blank"
+          v-if="cta.button"
+          :href="cta.link"
+          >{{ cta.button }}</a
+        >
+        <g-link
+          class="inline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full"
+          v-if="cta.button2"
+          :to="cta.link2"
+          >{{ cta.button2 }}</g-link
+        >
+         <g-link
+          class="inline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full"
+          v-if="cta.button3"
+          :to="cta.link3"
+          >{{ cta.button3 }}</g-link
+        >
+      
+      
+    </div>
+  </section>
+</template>
+
+<script>
+export default {
+  props: ["cta"],
+};
+</script>
+<style scoped>
+.bg-hero {
+        background-image: url("~@/assets/images/bg1.png");
+    }
+</style>

src/components/custom/sections/CallToActionbg2.vue

@@ -0,0 +1,54 @@
+<template>
+  <section class="pb-20 px-4 bg-cover bg-hero text-center">
+    <br>
+    <br>
+    <br>
+    <div class="w-full max-w-7xl mx-auto">
+      <h3 class="uppercase">{{ cta.subtitle }}</h3>
+     <h2 class="text-6xl mb-6 leading-none font-extrabold font-heading uppercase">
+          <span class="text-blue-600">{{ cta.slogan }}</span
+          > {{ cta.title1 }}
+          <br>
+          {{ cta.title2 }}
+        </h2>
+      <div
+        v-html="cta.content"
+        class="mt-6 mb-8 text-gray-700 leading-relaxed"
+      ></div>
+
+
+       <a
+          class="inline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full" 
+          target="_blank"
+          v-if="cta.button"
+          :href="cta.link"
+          >{{ cta.button }}</a
+        >
+        <g-link
+          class="inline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full"
+          v-if="cta.button2"
+          :to="cta.link2"
+          >{{ cta.button2 }}</g-link
+        >
+         <g-link
+          class="inline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full"
+          v-if="cta.button3"
+          :to="cta.link3"
+          >{{ cta.button3 }}</g-link
+        >
+      
+      
+    </div>
+  </section>
+</template>
+
+<script>
+export default {
+  props: ["cta"],
+};
+</script>
+<style scoped>
+.bg-hero {
+        background-image: url("~@/assets/images/bg2.png");
+    }
+</style>

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

@@ -1,5 +1,5 @@
 <template>
-  <div class="py-12 mb-5">
+  <div class="py-12 mb-5" id="take_part">
     <div class="w-full text-center">
       <h2 v-if="main !== null" class="text-4xl font-semibold leading-tight font-heading">
         {{ main.title }} 
@@ -7,7 +7,7 @@
       <p v-if="main !== null" class="mb-6 text-m tracking-widest text-gray-800">{{ main.subtitle }}</p>
     </div> 
 
-    <div class="grid grid-cols-1 gap-4 sm:grid-cols-2">
+    <div class="grid grid-cols-1 gap-4 sm:grid-cols-3">
 
         <a
         v-for="(product, idx) in products"

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

@@ -0,0 +1,50 @@
+<template>
+  <div class="py-12 mb-5">
+    <div class="w-full text-center">
+      <h2 v-if="main !== null" class="text-4xl font-semibold leading-tight font-heading">
+        {{ main.title }} 
+      </h2>
+      <p v-if="main !== null" class="mb-6 text-m tracking-widest text-gray-800">{{ main.subtitle }}</p>
+    </div> 
+
+    <div class="grid grid-cols-1 gap-4 sm:grid-cols-3">
+
+        <a
+        v-for="(product, idx) in products"
+        target="_blank"
+        :key="idx"
+        :href="product.url"
+          class="m-auto rounded overflow-hidden transition duration-500"
+        >
+        
+          <div class="px-2 py-2">
+            <g-image class="py-4" :src="img(product.image)" />
+            <!-- <div class="font-bold text-xl mb-2">{{ product.title }}</div> -->
+            <p v-html="product.content" class="text-gray-700 text-base"></p>
+          </div>
+          
+        </a>
+      
+    </div>
+  </div>
+</template>
+
+
+<script>
+export default {
+  props: ["products", "main"],
+  methods: {
+    img(image) {
+      if (!image) return "";
+      if (image.src) return image.src;
+      return image;
+    },
+  },
+};
+</script>
+
+<style scoped>
+.bannerFondo {
+  height: 400px;
+}
+</style>

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

@@ -1,5 +1,5 @@
 <template>
-  <section class="pt-8 px-4 text-center">
+  <section class="py-8 pb-20 px-4 text-center">
     <div class="max-w-2xl mx-auto mb-8">
       <h2 class="text-4xl leading-tight mb-6 font-bold font-heading">
         WORK WITH AWESOME PARTNERS