init marketInfo sec

src/components/custom/MarketInfo.vue

@@ -0,0 +1,57 @@
+<template>
+  <div class="flex flex-wrap -mx-auto">
+    <div class="text-center mx-auto my-4">
+      <h1 class="text-6xl text-gray-900 font-bold sm:text-9xl leading-tight">
+        {{ main.title }}
+      </h1>
+      <div
+        class="my-5 max-w-2xl lg:text-xl mx-auto text-gray-900 sm:mt-4"
+        v-html="main.content"
+      ></div>
+    </div>
+    <div class="flex flex-col my-1 px-1 w-1/2 overflow-hidden">
+      <g-image :src="mainItem.image" class="w-3/4 mx-auto " />
+      <div class="flex-1 bg-white p-6 flex flex-col justify-between">
+        <div class="flex-1">
+          <div
+            class="mt-3 lg:text-2xl leading-tight text-gray-800"
+            v-html="mainItem.content"
+          ></div>
+        </div>
+      </div>
+    </div>
+
+    <div class="my-1 px-1 w-1/2 overflow-hidden">
+      <!-- Column Content -->
+      <div class="flex my-14 mx-5" v-for="info in marketInfo" :key="info">
+        <div class="flex-shrink-0">
+          <div
+            class="
+              flex
+              items-center
+              justify-center
+              h-24
+              w-24
+              rounded-md
+              text-white
+            "
+          >
+            <g-image :src="info.image" class="w-full" />
+          </div>
+        </div>
+        <div class="ml-4">
+          <div
+            class="mt-4 lg:text-2xl max-w-md leading-6 text-gray-900"
+            v-html="info.content"
+          ></div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: ["id", "main", "mainItem", "marketInfo"],
+};
+</script>

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

@@ -4,7 +4,7 @@
     :style="[
       id == 'home'
         ? { background: 'url(' + img + ') center no-repeat' }
-        : { background: transparent },
+        : { background: 'transparent' },
     ]"
   >
     <div

src/templates/MarkdownPage.vue

@@ -34,18 +34,6 @@
         v-if="$page.markdownPage.brandPanel3"
         :brandPanel3="true"
       />
-      <!-- <CustomCTA
-        :header="true"
-        :image="$page.markdownPage.pageHeader.image"
-        :title="$page.markdownPage.pageHeader.title"
-      /> -->
-      <!-- <div class="singlePic">
-        <g-image
-          class="w-100 mx-auto"
-          v-if="$page.markdownPage.solution_image"
-          :src="$page.markdownPage.solution_image.src"
-        />
-      </div> -->
     </div>
     <div class="container sm:pxi-0 mx-auto overflow-x-hidden py-5">
       <CallToAction
@@ -61,6 +49,13 @@
         :textOnly="true"
       />
 
+      <MarketInfo
+        v-if="$page.markdownPage.marketInfo.length > 0"
+        :main="$page.markdownPage.marketInfoMain"
+        :mainItem="$page.markdownPage.mainItem"
+        :marketInfo="$page.markdownPage.marketInfo"
+      />
+
       <!-- <SignUp
         v-if="$page.markdownPage.signup"
         :signup="$page.markdownPage.signup"
@@ -460,6 +455,21 @@
        image
        content
      }
+     marketInfoMain{
+       id
+       title
+       content
+     }
+     mainItem{
+       id
+       image
+       content
+     }
+     marketInfo {
+       id
+       image
+       content
+     }
     }
     allCustomCta {
       edges {
@@ -500,7 +510,7 @@ import CenteredAccordion from "~/components/marketing/sections/faq-sections/Cent
 import CustomCTA from "~/components/custom/sections/CustomCTA.vue";
 import Slider from "~/components/custom/Slider.vue";
 import RoadMap from "~/components/custom/Roadmap.vue";
-
+import MarketInfo from "~/components/custom/MarketInfo.vue";
 export default {
   components: {
     NewCard,
@@ -527,6 +537,7 @@ export default {
     CustomCTA,
     Slider,
     RoadMap,
+    MarketInfo,
   },
   computed: {
     getImg() {