dynamic logos

content/page/home/home.md

@@ -16,7 +16,7 @@ button2: Peer-to-Peer Cloud
 link2: https://cloud.threefold.io/ 
 button3: How it Works
 link3: /how-it-works
-
+logosMain : logo_home
 cta2: home_cta2
 productsMain: product
 productData: [nodes_home, tokens_home, storage_home]

content/page/home/logos/logo1/logo.md

@@ -1,5 +0,0 @@
----
-id: logo1
-image: ./our_partners.png
-url: /partners
----

content/page/home/logos/main/main.md

@@ -1,7 +1,6 @@
 ---
 id: logo_home
 title: Our Partners
-image: ./our_partners.png
 button: Check All Partners 
 link : /partners
 ---

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

@@ -28,33 +28,51 @@
         </a>
       </div>
     </div>
-    <div v-else class="flex flex-wrap -mx-8">
 
-        <g-image class="mx-auto"
+    <div v-else-if="id == 'home'" class="flex flex-wrap lg:mx-40">
+      <div v-for="logo in logos" class="w-1/2 md:w-1/6" :key="logo.node.id">
+        <a
+          v-if="logo.node.path.includes('http')"
+          target="_blank"
+          :href="logo.node.path"
+        >
+          <g-image :src="img(logo.node.logo)" class="w-1/2 mx-auto" />
+        </a>
+
+        <a v-else :href="logo.node.path">
+          <g-image :src="img(logo.node.logo)" class="w-1/2 mx-auto" />
+        </a>
+      </div>
+    </div>
+    <div v-else class="flex flex-wrap -mx-8">
+      <g-image
+        class="mx-auto"
         v-for="(logo, idx) in logos"
         :key="idx"
-        :src="img(logo.image)" />
-      
+        :src="img(logo.image)"
+      />
+    </div>
+    <div v-if="main.button" class="my-10">
+      <a
+        class="
+          inline-block
+          bg-white
+          text-lg
+          learn-button
+          hover:bg-gray-400
+          px-12
+          py-1
+          mr-5
+          my-10
+          border-2
+          shadow
+          border-black
+        "
+        v-if="main.button"
+        :href="main.link"
+        >{{ main.button }}</a
+      >
     </div>
-    <a
-      class="
-        inline-block
-        bg-white
-        text-lg
-        learn-button
-        hover:bg-gray-400
-        px-12
-        py-1
-        mr-5
-        my-4
-        border-2
-        shadow
-        border-black
-      "
-      v-if="main.button"
-      :href="main.link"
-      >{{ main.button }}</a
-    >
   </section>
 </template>
 

src/pages/Index.vue

@@ -34,17 +34,17 @@
 
       
 
-      <!-- <logoShowcase
+      <logoShowcase
         v-if="$page.markdownPage.logos"
         :id="$page.markdownPage.id"
-        :logos="$page.markdownPage.logos"
+        :logos="$page.allProject.edges"
         :main="$page.markdownPage.logosMain"
-      /> -->
-      <CallToActionbg1
+      />
+      <!-- <CallToActionbg1
         v-if="$page.markdownPage.cta3"
         :id="$page.markdownPage.id"
         :cta="$page.markdownPage.cta3"
-      />
+      /> -->
     </div>
       
     <div class="container-fluid sm:pxi-0 mx-auto overflow-x-hidden">
@@ -358,9 +358,19 @@
       }
     }
   }
+
+  allProject (sortBy: "rank", order: ASC, filter: { category: { contains: ["foundation"]}}){
+    edges {
+      node {
+        id
+        title
+        path
+        rank
+        logo
+      }
+    }
+  }
 }
-
-
 </page-query>
 
 <static-query>
@@ -423,49 +433,49 @@ export default {
       return img;
     },
   },
-  metaInfo() {
-    return {
-      title: "",
-      titleTemplate: "ThreeFold | Welcome",
-      meta: [
-        {
-          key: "description",
-          name: "description",
-          content: this.$page.markdownPage.metaDesc,
-        },
-        {
-          key: "og:title",
-          property: "og:title",
-          content: this.$page.markdownPage.metaTitle,
-        },
-        {
-          key: "og:description",
-          property: "og:description",
-          content: this.$page.markdownPage.metaDesc,
-        },
-        {
-          key: "og:image",
-          property: "og:image",
-          content: this.getImg,
-        },
-        {
-          key: "twitter:description",
-          name: "twitter:description",
-          content: this.$page.markdownPage.metaDesc,
-        },
-        {
-          key: "twitter:image",
-          property: "twitter:image",
-          content: this.getImg,
-        },
-        {
-          key: "twitter:title",
-          property: "twitter:title",
-          content: this.$page.markdownPage.metaTitle,
-        },
-      ],
-    };
-  },
+  // metaInfo() {
+  //   return {
+  //     title: "",
+  //     titleTemplate: "ThreeFold | Welcome",
+  //     meta: [
+  //       {
+  //         key: "description",
+  //         name: "description",
+  //         content: this.$page.markdownPage.metaDesc,
+  //       },
+  //       {
+  //         key: "og:title",
+  //         property: "og:title",
+  //         content: this.$page.markdownPage.metaTitle,
+  //       },
+  //       {
+  //         key: "og:description",
+  //         property: "og:description",
+  //         content: this.$page.markdownPage.metaDesc,
+  //       },
+  //       {
+  //         key: "og:image",
+  //         property: "og:image",
+  //         content: this.getImg,
+  //       },
+  //       {
+  //         key: "twitter:description",
+  //         name: "twitter:description",
+  //         content: this.$page.markdownPage.metaDesc,
+  //       },
+  //       {
+  //         key: "twitter:image",
+  //         property: "twitter:image",
+  //         content: this.getImg,
+  //       },
+  //       {
+  //         key: "twitter:title",
+  //         property: "twitter:title",
+  //         content: this.$page.markdownPage.metaTitle,
+  //       },
+  //     ],
+  //   };
+  // },
 };
 </script>
 <style scoped>