grid header

content/page/grid/grid.md

@@ -0,0 +1,14 @@
+---
+id: grid
+metaTitle: ThreeFold | Grid
+metaDesc: The ThreeFold Grid is an open system which allows anyone to become a node in the emerging digital economy. It provides unparalleled levels of privacy and security and opens a new Internet era free from censorship, user tracking and privacy breaches
+metaImg: ./grid_header.png
+header_slogan: 
+header_title: THE THREEFOLD GRID
+header_image: ./grid_header.png
+header_altImg: threefold
+header_excerpt: The ThreeFold Grid is an open system which allows anyone to become a node in the emerging digital economy. It provides unparalleled levels of privacy and security and opens a new Internet era free from censorship, user tracking and privacy breaches
+solution_image: 
+button: Take Part
+link: "#"
+---

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

@@ -108,7 +108,14 @@
           {{ title }}
         </h1>
         <div
-          class="mb-8 px-10 text-center lg:text-5xl text-extrabold leading-tight"
+          class="
+            mb-8
+            px-10
+            text-center
+            lg:text-5xl
+            text-extrabold
+            leading-tight
+          "
           v-html="excerpt"
         ></div>
         <div v-if="button" class="block text-center">
@@ -160,6 +167,7 @@
     </div>
 
     <div
+      v-else-if="id == 'tft'"
       class="
         flex flex-wrap
         text-center
@@ -169,7 +177,6 @@
         lg:py-10
         -mx-2
       "
-      v-else-if="id == 'tft'"
     >
       <div
         class="
@@ -339,6 +346,61 @@
       </div> -->
     </div>
 
+    <div
+      class="flex flex-wrap text-center lg:text-left lg:pt-10 -mx-2"
+      v-else-if="id == 'grid'"
+    >
+      <div class="px-3 lg:mt-5 order-1 lg:order-none mx-auto text-center">
+        <h2 class="lg:text-5xl uppercase mb-6 mt-20 leading-none font-heading">
+          {{ title }}
+        </h2>
+        <div
+          class="mb-8 text-lg max-w-2xl leading-relaxed"
+          v-html="excerpt"
+        ></div>
+
+        <a
+          v-if="link.includes('http')"
+          target="_blank"
+          class="
+            inline-block
+            bg-white
+            text-sm
+            learn-button
+            hover:bg-gray-400
+            px-12
+            py-1
+            mr-5
+            mb-4
+            border-2
+            shadow
+            border-black
+          "
+          :href="link"
+          >{{ button }}</a
+        >
+        <a
+          v-else
+          class="
+            inline-block
+            bg-white
+            text-sm
+            learn-button
+            hover:bg-gray-400
+            px-12
+            py-1
+            mr-5
+            mb-4
+            border-2
+            shadow
+            border-black
+          "
+          :href="link"
+          >{{ button }}</a
+        >
+      </div>
+      <g-image class="order-2 lg:order-none" :src="img" :alt="altImg" />
+    </div>
     <div class="flex flex-wrap text-center lg:text-left lg:pt-10 -mx-2" v-else>
       <div
         class="px-2 lg:py-40 lg:mt-10 order-1 lg:order-none mx-auto text-center"

src/templates/MarkdownPage.vue

@@ -1,13 +1,6 @@
 <template>
   <Layout :hideHeader="true" :disableScroll="true">
-    <div
-      class="container-fluid sm:pxi-0 mx-auto overflow-x-hidden"
-      v-if="
-        $page.markdownPage.id == 'careers' ||
-        $page.markdownPage.id == 'community' ||
-        $page.markdownPage.id == 'about-us'
-      "
-    >
+    <div class="container-fluid sm:pxi-0 mx-auto overflow-x-hidden">
       <Header
         v-if="
           $page.markdownPage.header_title &&
@@ -82,14 +75,14 @@
         :sections="$page.markdownPage.comparisonSecs"
       /> -->
 
-      <TFTFuel
+      <!-- <TFTFuel
         v-if="
           $page.markdownPage.comparisonSecs &&
           $page.markdownPage.comparisonSecs.length > 0
         "
         :main="$page.markdownPage.comparisonMain"
         :sections="$page.markdownPage.comparisonSecs"
-      />
+      /> -->
     </div>
 
     <div class="container-fluid sm:pxi-0 mx-auto overflow-x-hidden">
@@ -114,14 +107,14 @@
     /> -->
 
     <div class="container sm:pxi-0 mx-auto py-5 overflow-visible">
-      <AppListItem
+      <!-- <AppListItem
         v-if="
           $page.markdownPage.appData && $page.markdownPage.appData.length > 0
         "
         :products="$page.markdownPage.appData"
         :main="$page.markdownPage.appsMain"
-      />
-      <ShowcaseProducts
+      /> -->
+      <!-- <ShowcaseProducts
         v-if="
           $page.markdownPage.productData &&
           $page.markdownPage.productData.length > 0
@@ -129,9 +122,9 @@
         :id="$page.markdownPage.id"
         :main="$page.markdownPage.productsMain"
         :products="$page.markdownPage.productData"
-      />
+      /> -->
 
-      <Partenerships
+      <!-- <Partenerships
         v-if="
           $page.markdownPage.partnerships &&
           $page.markdownPage.partnerships.length > 0
@@ -139,15 +132,15 @@
         :id="$page.markdownPage.id"
         :main="$page.markdownPage.partenershipsMain"
         :partnerships="$page.markdownPage.partnerships"
-      />
+      /> -->
 
-      <CenteredAccordion
+      <!-- <CenteredAccordion
         v-if="$page.markdownPage.faqContent && $page.markdownPage.id == 'faq'"
         :main="$page.markdownPage.faqMain"
         :faqs="$page.markdownPage.faqContent"
-      />
+      /> -->
 
-      <ShowcaseProducts
+      <!-- <ShowcaseProducts
         class="my-20"
         v-if="
           $page.markdownPage.productData &&
@@ -156,73 +149,60 @@
         :id="$page.markdownPage.id"
         :main="$page.markdownPage.productsMain"
         :products="$page.markdownPage.productData"
-      />
+      /> -->
 
-      <SolutionsHeader
+      <!-- <SolutionsHeader
         class="mt-0"
         v-if="$page.markdownPage.header"
         :header="$page.markdownPage.header"
-      />
+      /> -->
 
-      <g-image
+      <!-- <g-image
         v-if="$page.markdownPage.solution_image2"
         :src="$page.markdownPage.solution_image2.src"
-      />
+      /> -->
 
-      <SolutionsHeader
+      <!-- <SolutionsHeader
         v-if="$page.markdownPage.header2"
         :header="$page.markdownPage.header2"
-      />
+      /> -->
 
       <!-- <SolutionsHeader
         v-if="$page.markdownPage.header3"
         :header="$page.markdownPage.header3"
       /> -->
 
-      <logoShowcase
+      <!-- <logoShowcase
         v-if="$page.markdownPage.logos.length > 0"
         :id="$page.markdownPage.id"
         :logos="$page.markdownPage.logos"
         :main="$page.markdownPage.logosMain"
-      />
+      /> -->
 
-      <FourTiersWithToggle
+      <!-- <FourTiersWithToggle
         v-if="$page.markdownPage.jobs.length > 0"
         :pricingPlans="$page.markdownPage.jobs"
         :main="$page.markdownPage.jobsMain"
-      />
+      /> -->
 
-      <SolutionsHeader
+      <!-- <SolutionsHeader
         class="mt-0"
         v-if="$page.markdownPage.header4"
         :header="$page.markdownPage.header4"
-      />
+      /> -->
 
-      <GetInTouch
+      <!-- <GetInTouch
         v-if="
           $page.markdownPage.contactData &&
           $page.markdownPage.contactData.length > 0
         "
         :contacts="$page.markdownPage.contactData"
-      />
+      /> -->
 
-      <SignUp
+      <!-- <SignUp
         v-if="$page.markdownPage.signup"
         :signup="$page.markdownPage.signup"
-      />
-    </div>
-
-    <div
-      class="container-fluid mx-auto"
-      v-for="edge in $page.allCustomCta.edges"
-      :key="edge.node.id"
-    >
-      <CustomCTA
-        v-if="edge.node.id == $page.markdownPage.id"
-        :title="edge.node.title"
-        :link="edge.node.link"
-        :image="edge.node.image"
-      />
+      /> -->
     </div>
   </Layout>
 </template>