dynamic logos

This commit is contained in:
samaradel
2021-09-30 18:50:22 +02:00
parent c4f1910161
commit 8c976df9a9
7 changed files with 105 additions and 83 deletions

View File

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

View File

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

Binary file not shown.

Before

Width:  |  Height:  |  Size: 228 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

View File

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

View File

@@ -28,33 +28,51 @@
</a> </a>
</div> </div>
</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" v-for="(logo, idx) in logos"
:key="idx" :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> </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> </section>
</template> </template>

View File

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