Add brandPanel

This commit is contained in:
samaradel
2021-10-04 15:35:24 +02:00
parent e3e3535a37
commit 48dacee561
5 changed files with 139 additions and 52 deletions

View File

@@ -1,17 +1,10 @@
---
id: grid_solution
title: THE THREEFOLD GRID IS THE ONLY TRUE SOLUTION
subtitle: ''
sourceUrl: https://threefold.io/info/threefold#/threefold__grid_why
id: p4p
title: BUILT BY AND FOR
subtitle: HUMANITY
sourceUrl: '#'
btnTxt: Know More
sourceUrl2: https://explorer.threefold.io/
btnTxt2: Live Stats
image: grid_solution.png # src/assets/brandPanel/..
image: p4p_new.png # src/assets/brandPanel/..
---
We did what nobody else has done. We rebuilt the architecture from the ground up a unique stateless operating system and an automation layer to remove all intermediaries and enable anyone to connect hardware, anywhere around the world. A real, long-lasting solution, not just a bandaid approach.
<br/>
Without the ThreeFold Grid, the peer-to-peer Internet the world needs is not possible.
<!-- to remove all intermediaries and enable anyone to connect hardware, anywhere around the world. A real, long-lasting solution, not just a bandaid approach. -->
The ThreeFold Grid is formed by people connecting capacity to our network. These people are known as farmers. Together with a growing number of farmers, we have achieved a new internet which allows everyone to learn, partake and succeed

View File

@@ -15,7 +15,7 @@ cta2: home_cta2
productsMain: product
productData: [nodes_home, tokens_home, storage_home]
brandPanel: fix_internet
brandPanel2: grid_solution
brandPanel2: p4p
cta3: home_cta3
cta4: home_cta4
cta5: home_cta5

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

View File

@@ -165,7 +165,7 @@
<!-- home -->
<div
v-else-if="id == 'home'"
v-else-if="id == 'home' && !brandPanel2"
class="flex flex-wrap lg:text-left text-center lg:pt-16 lg:px-16"
>
<div class="lg:w-1/2 lg:px-6 self-center">
@@ -251,6 +251,80 @@
</div>
</div>
<div
v-else-if="id == 'home' && brandPanel2"
class="flex flex-wrap lg:text-left text-center lg:pt-16 lg:px-16"
>
<div class="lg:w-1/2 lg:px-6 self-center">
<g-image class="w-1/2 mx-auto" :src="image" :alt="brand.title" />
</div>
<div class="lg:w-1/2 lg:px-10 order-1 lg:order-none lg:self-center">
<div class="text-center">
<h2
class="
lg:text-5xl
mb-8
font-light
uppercase
leading-none
font-heading
"
>
{{ brand.title }}
<span class="block font-bold" v-if="brand.subtitle">{{
brand.subtitle
}}</span>
</h2>
<div
class="pb-6 text-xl leading-tight tracking-wide"
v-html="brand.content"
></div>
<a
v-if="brand.btnTxt.includes('http')"
target="_blank"
:href="brand.sourceUrl"
class="
inline-block
bg-white
lg:text-lg
learn-button
hover:bg-gray-400
bo
px-12
py-1
mr-5
mb-4
border-2
shadow
border-black
"
>{{ brand.btnTxt }}</a
>
<a
v-else
:href="brand.sourceUrl"
class="
inline-block
bg-white
lg:text-lg
learn-button
hover:bg-gray-400
bo
px-12
py-1
lg:mr-5
mb-4
border-2
shadow
border-black
"
>{{ brand.btnTxt }}</a
>
</div>
</div>
</div>
<!-- About us -->
<div
v-else-if="id == 'about-us' && !brandPanel2 && !brandPanel3"
@@ -387,7 +461,16 @@
v-else-if="id == 'grid' && !brandPanel2 && !brandPanel3"
class="flex flex-wrap text-left lg:px-16"
>
<div class="lg:w-1/2 lg:mt-10 order-1 lg:order-none text-left lg:self-center">
<div
class="
lg:w-1/2
lg:mt-10
order-1
lg:order-none
text-left
lg:self-center
"
>
<div class="px-2">
<h2 class="lg:text-6xl mb-6 uppercase leading-none font-heading">
<span class="block">{{ brand.title }}</span>
@@ -406,9 +489,8 @@
v-html="brand.content"
></div>
<a
class="
capitalize
capitalize
inline-block
bg-white
text-lg
@@ -428,9 +510,8 @@
>{{ brand.btnTxt }}</a
>
<a
class="
capitalize
capitalize
inline-block
bg-white
text-lg
@@ -462,7 +543,9 @@
<div class="lg:w-1/2 self-center">
<g-image class="w-3/4" :src="image" :alt="brand.title" />
</div>
<div class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none lg:self-center ">
<div
class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none lg:self-center"
>
<div class="px-2">
<h2 class="lg:text-6xl mb-8 uppercase leading-none font-heading">
{{ brand.title }}
@@ -471,10 +554,9 @@
class="pb-6 text-gray-900 text-xl leading-tight tracking-wide"
v-html="brand.content"
></div>
<a
<a
class="
capitalize
capitalize
inline-block
bg-white
text-lg
@@ -494,9 +576,8 @@
>{{ brand.btnTxt }}</a
>
<a
class="
capitalize
capitalize
inline-block
bg-white
text-lg
@@ -522,7 +603,9 @@
v-else-if="id == 'grid' && brandPanel3"
class="flex flex-wrap lg:text-left lg:pt-16 lg:px-16"
>
<div class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none lg:self-center">
<div
class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none lg:self-center"
>
<div class="">
<h2 class="lg:text-6xl mb-8 uppercase leading-none font-heading">
{{ brand.title }}
@@ -536,7 +619,7 @@
target="_blank"
:href="brand.sourceUrl"
class="
capitalize
capitalize
inline-block
bg-white
text-lg
@@ -552,12 +635,12 @@
"
>{{ brand.btnTxt }}</a
>
<a
<a
v-if="brand.btnTxt2"
target="_blank"
:href="brand.sourceUrl2"
class="
capitalize
capitalize
inline-block
bg-white
text-lg
@@ -580,11 +663,13 @@
</div>
</div>
<div
<div
v-else-if="id == 'grid' && brandPanel4"
class="flex flex-wrap lg:text-left lg:pt-16 lg:px-16"
>
<div class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none lg:self-center">
<div
class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none lg:self-center"
>
<div class="">
<h2 class="lg:text-5xl mb-8 uppercase leading-none font-heading">
{{ brand.title }}
@@ -597,7 +682,7 @@
v-if="brand.btnTxt"
:href="brand.sourceUrl"
class="
capitalize
capitalize
inline-block
bg-white
lg:text-lg
@@ -613,11 +698,11 @@
"
>{{ brand.btnTxt }}</a
>
<a
<a
v-if="brand.btnTxt2"
:href="brand.sourceUrl2"
class="
capitalize
capitalize
inline-block
bg-white
lg:text-lg
@@ -645,7 +730,16 @@
v-else-if="id == 'token' && !brandPanel2 && !brandPanel3"
class="flex flex-wrap text-left mt-24 lg:px-16"
>
<div class="lg:w-1/2 lg:mt-5 order-1 lg:order-none text-left lg:self-center">
<div
class="
lg:w-1/2
lg:mt-5
order-1
lg:order-none
text-left
lg:self-center
"
>
<div class="px-2">
<h2 class="lg:text-6xl mb-6 uppercase leading-none font-heading">
<span class="block">{{ brand.title }}</span>
@@ -654,13 +748,7 @@
}}</span>
</h2>
<div
class="
py-6
mt-4
text-xl
leading-tight
tracking-wide
"
class="py-6 mt-4 text-xl leading-tight tracking-wide"
v-html="brand.content"
></div>
</div>
@@ -677,7 +765,9 @@
<div class="lg:w-1/2 self-center">
<g-image class="mx-auto w-3/4" :src="image" :alt="brand.title" />
</div>
<div class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none lg:self-center">
<div
class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none lg:self-center"
>
<div class="px-2">
<h2 class="lg:text-6xl mb-8 uppercase leading-none font-heading">
{{ brand.title }}
@@ -714,7 +804,9 @@
v-else-if="id == 'token' && brandPanel3"
class="flex flex-wrap lg:text-left lg:pt-16 lg:px-16"
>
<div class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none lg:self-center">
<div
class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none lg:self-center"
>
<div class="">
<h2 class="lg:text-6xl mb-8 uppercase leading-none font-heading">
{{ brand.title }}

View File

@@ -18,14 +18,20 @@
:link2="$page.markdownPage.link2"
:link3="$page.markdownPage.link3"
/>
</div>
<div class="container-fluid sm:pxi-0 mx-auto overflow-x-hidden">
<Partenerships
v-if="$page.markdownPage.partnerships.length > 0"
:id="$page.markdownPage.id"
:partnerships="$page.markdownPage.partnerships"
/>
<BrandPanel
:brand="$page.markdownPage.brandPanel2"
:id="$page.markdownPage.id"
v-if="$page.markdownPage.brandPanel2"
:brandPanel2="true"
/>
<Map v-if="$page.markdownPage.map" :section="$page.markdownPage.map" />
<ShowcaseProducts
v-if="
@@ -41,9 +47,7 @@
:id="$page.markdownPage.id"
:cta="$page.markdownPage.cta"
/>
</div>
<div class="container-fluid mx-auto sm:pxi-0 overflow-x-hidden">
<LogoShowcase
v-if="$page.markdownPage.logos.length > 0"
:id="$page.markdownPage.id"
@@ -265,8 +269,6 @@
content
sourceUrl
btnTxt
sourceUrl2
btnTxt2
image
}
logosMain {