init roadmap

content/page/about-us/about-us.md

@@ -16,4 +16,5 @@ brandPanel2: about_brandPanel2
 brandPanel3: about_brandPanel3
 cta: about_cta
 cta2: about_cta2
+roadmap: about_roadmap
 ---

content/page/about-us/roadmap/index.md

@@ -0,0 +1,13 @@
+---
+id: about_roadmap
+image: ./about_roadmap.png
+---
+And we’re nowhere done as we’re aiming for new heights. 
+<br />
+We continue to work towards our mission of a truly 
+<br />
+democratized, secure and scalable digital infrastructure to 
+<br />
+support a truly interconnected world. Our mission is bold 
+<br />
+and motivates every step we make

gridsome.config.js

@@ -361,6 +361,14 @@ module.exports = {
             }
         },
 
+        {
+            use: '@gridsome/source-filesystem',
+            options: {
+                typeName: 'Roadmap',
+                path: './content/page/**/roadmap/*.md',
+            }
+        },
+
         {
             use: '@gridsome/source-filesystem',
             options: {
@@ -410,7 +418,8 @@ module.exports = {
                     farmingProcess: 'FarmingProcess',
                     cultivationMain: 'CultivationProcessMain',
                     cultivationProcess: 'CultivationProcess',
-                    map: 'Map'
+                    map: 'Map',
+                    roadmap: 'Roadmap'
                 }
             }
         },

src/components/custom/Roadmap.vue

@@ -0,0 +1,17 @@
+<template>
+  <section class="pb-10 px-4 bg-cover text-center">
+    <div class="w-full mx-auto">
+      <g-image :src="roadmap.image" />
+      <div
+        v-html="roadmap.content"
+        class="mt-10 mb-8 lg:text-2xl text-gray-900"
+      ></div>
+    </div>
+  </section>
+</template>
+
+<script>
+export default {
+  props: ["roadmap", "id"],
+};
+</script>

src/templates/MarkdownPage.vue

@@ -67,6 +67,7 @@
         :cta="$page.markdownPage.cta2"
         :textOnly="true"
       />
+
       <!-- <SignUp
         v-if="$page.markdownPage.signup"
         :signup="$page.markdownPage.signup"
@@ -90,6 +91,14 @@
         :sections="$page.markdownPage.comparisonSecs"
       />
     </div>
+
+    <div class="container-fluid sm:pxi-0 mx-auto overflow-x-hidden">
+      <RoadMap
+        :id="$page.markdownPage.id"
+        v-if="$page.markdownPage.roadmap"
+        :roadmap="$page.markdownPage.roadmap"
+      />
+    </div>
     <!-- <g-image
       v-if="
         $page.markdownPage.id !== 'careers' && $page.markdownPage.solution_image
@@ -286,6 +295,7 @@
         :signup="$page.markdownPage.signup"
       />
     </div>
+
     <div
       class="container-fluid mx-auto"
       v-for="edge in $page.allCustomCta.edges"
@@ -536,6 +546,10 @@
        image
        content
      }
+     roadmap {
+       image
+       content
+     }
     }
     allCustomCta {
       edges {
@@ -575,6 +589,7 @@ import Partenerships from "~/components/marketing/sections/team-sections/grid_wi
 import CenteredAccordion from "~/components/marketing/sections/faq-sections/CenteredAccordion.vue";
 import CustomCTA from "~/components/custom/sections/CustomCTA.vue";
 import Slider from "~/components/custom/Slider.vue";
+import RoadMap from "~/components/custom/Roadmap.vue";
 
 export default {
   components: {
@@ -601,6 +616,7 @@ export default {
     CenteredAccordion,
     CustomCTA,
     Slider,
+    RoadMap,
   },
   computed: {
     getImg() {