update newcommunity sections

This commit is contained in:
2021-11-02 17:23:18 +02:00
parent 50e213709c
commit 1d87e0e48c
10 changed files with 386 additions and 30 deletions

View File

@@ -394,6 +394,133 @@
>
</div>
<!-- newcommunity -->
<div
class="w-full mx-auto py-6 lg:py-10"
v-else-if="id == 'newcommunity' && !textOnly"
>
<h2
v-if="cta.title"
class="
lg:text-6xl
text-center
uppercase
mb-2
leading-none
font-normal font-heading
"
>
{{ cta.title }}
<br>
<span class="font-bold">{{ cta.subtitle }}</span>
</h2>
<div v-html="cta.content" class="mt-6 mb-8 lg:text-2xl lg:max-w-4xl mx-auto px-4 "></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
"
target="_blank"
v-if="cta.button && cta.link.includes('http')"
:href="cta.link"
>{{ cta.button }}</a
>
<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-else
:href="cta.link"
>{{ cta.button }}</a
>
</div>
<div
class="w-full mx-auto lg:mt-20 py-10 lg:p-20"
v-else-if="id == 'newcommunity' && textOnly"
>
<h2
v-if="cta.title"
class="
lg:text-6xl
text-center
uppercase
mb-2
leading-none
font-normal font-heading
"
>
{{ cta.title }}
<span class="font-bold">{{ cta.subtitle }}</span>
</h2>
<div v-html="cta.content" class="mt-6 mb-8 lg:text-2xl lg:max-w-4xl mx-auto px-4 "></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
"
target="_blank"
v-if="cta.button && cta.link.includes('http')"
:href="cta.link"
>{{ cta.button }}</a
>
<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-else
:href="cta.link"
>{{ cta.button }}</a
>
</div>
<!-- home -->
<div

View File

@@ -1,11 +1,11 @@
<template>
<div
class="bg-cover lg:my-10"
:class="{
bg: id == 'mission' && brandPanel3,
gry: id == 'farm' && brandPanel3 ,
gry2: id == 'developer' && brandPanel3
<div
class="bg-cover lg:my-20"
:class="{
bg: id == 'mission' && brandPanel3,
gry: id == 'farm' && brandPanel3,
gry2: id == 'developer' && brandPanel3,
gry3: id == 'newcommunity' && brandPanel3,
}"
>
<div class="mx-auto py-10">
@@ -412,7 +412,6 @@
text-center
lg:px-56
self-center
"
>
<div class="lg:self-center">
@@ -453,7 +452,7 @@
</div>
</div>
<div
<div
v-else-if="id == 'farm' && brandPanel2"
class="
flex flex-wrap
@@ -476,7 +475,13 @@
}}</span>
</h2>
<div
class="pb-6 text-gray-900 text-xl leading-tight tracking-wide lg:max-w-2xl"
class="
pb-6
text-gray-900 text-xl
leading-tight
tracking-wide
lg:max-w-2xl
"
v-html="brand.content"
></div>
<a
@@ -539,7 +544,13 @@
}}</span>
</h2>
<div
class="pb-6 text-gray-900 text-xl leading-tight tracking-wide lg:max-w-2xl"
class="
pb-6
text-gray-900 text-xl
leading-tight
tracking-wide
lg:max-w-2xl
"
v-html="brand.content"
></div>
<a
@@ -566,17 +577,11 @@
</div>
</div>
<!-- developer -->
<!-- developer -->
<div
<div
v-else-if="id == 'developer' && brandPanel2"
class="
flex flex-wrap
lg:text-left
text-center
px-4
lg:px-20
"
class="flex flex-wrap lg:text-left text-center px-4 lg:px-20"
>
<div class="lg:w-1/2 px-2 self-center">
<g-image class="mx-auto" :src="image" :alt="brand.title" />
@@ -590,7 +595,13 @@
}}</span>
</h2>
<div
class="pb-6 text-gray-900 text-xl leading-tight tracking-wide lg:max-w-2xl"
class="
pb-6
text-gray-900 text-xl
leading-tight
tracking-wide
lg:max-w-2xl
"
v-html="brand.content"
></div>
<a
@@ -653,7 +664,13 @@
}}</span>
</h2>
<div
class="pb-6 text-gray-900 text-xl leading-tight tracking-wide lg:max-w-2xl"
class="
pb-6
text-gray-900 text-xl
leading-tight
tracking-wide
lg:max-w-2xl
"
v-html="brand.content"
></div>
<a
@@ -680,6 +697,125 @@
</div>
</div>
<!-- newcommunity -->
<div
v-else-if="id == 'newcommunity' && brandPanel2"
class="flex flex-wrap lg:text-left text-center px-4 lg:p-20"
>
<div class="lg:w-1/2 px-2 self-center">
<g-image class="mx-auto" :src="image" :alt="brand.title" />
</div>
<div class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none self-center">
<div class="lg:self-center">
<h2 class="lg:text-6xl mb-8 uppercase leading-none font-light">
<span class="block font-normal">{{ brand.title }}</span>
<span class="block font-bold" v-if="brand.subtitle">{{
brand.subtitle
}}</span>
</h2>
<div
class="
pb-6
text-gray-900 text-xl
leading-tight
tracking-wide
lg:max-w-2xl
"
v-html="brand.content"
></div>
<a
v-if="brand.btnTxt"
target="_blank"
:href="brand.sourceUrl"
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
"
>{{ brand.btnTxt }}</a
>
<a
v-if="brand.btnTxt2"
target="_blank"
:href="brand.sourceUrl2"
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
"
>{{ brand.btnTxt2 }}</a
>
</div>
</div>
</div>
<div
v-else-if="id == 'newcommunity' && brandPanel3"
class="flex flex-wrap lg:text-left text-center lg:py-20 lg:px-32 px-4"
>
<div class="lg:w-1/2 px-2 lg:mt-20 order-1 lg:order-none">
<div class="lg:self-center">
<h2 class="lg:text-6xl mb-8 uppercase leading-none font-light">
<span class="block font-normal">{{ brand.title }}</span>
<span class="block font-bold" v-if="brand.subtitle">{{
brand.subtitle
}}</span>
</h2>
<div
class="
pb-6
text-gray-900 text-xl
leading-tight
tracking-wide
lg:max-w-2xl
"
v-html="brand.content"
></div>
<a
v-if="brand.btnTxt"
target="_blank"
:href="brand.sourceUrl"
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
"
>{{ brand.btnTxt }}</a
>
</div>
</div>
<div class="lg:w-1/2 px-2 self-center">
<g-image class="lg:w-2/3 mx-auto" :src="image" :alt="brand.title" />
</div>
</div>
<!-- mission -->
<div
v-else-if="id == 'mission' && !brandPanel2 && !brandPanel3"
@@ -1290,12 +1426,15 @@ export default {
background: -webkit-linear-gradient(to right, #70dfc9, #ea1ff7);
background: linear-gradient(to right, #70dfc9, #ea1ff7);
}
.gry{
.gry {
background: #f2f2f2;
}
.gry2{
.gry2 {
background: #f2f2f2;
}
.gry3 {
background: #f2f2f2;
}
</style>