update home
This commit is contained in:
@@ -1,14 +1,10 @@
|
||||
---
|
||||
id: fix_internet
|
||||
title: Join the ThreeFold Community
|
||||
title: ZERO OS
|
||||
subtitle: ''
|
||||
sourceUrl: https://t.me/threefold
|
||||
btnTxt: Join the Community
|
||||
image: token_header.png # src/assets/brandPanel/..
|
||||
btnTxt: Get a Node
|
||||
image: zero_os.png # src/assets/brandPanel/..
|
||||
---
|
||||
|
||||
* Become a part of a collaborative community
|
||||
* Earn income for connecting sovereign capacity
|
||||
* Regenerate our planet with every sale and purchase
|
||||
* Reserve capacity without any intermediaries
|
||||
* Receive grants for regenerative initiatives
|
||||
Zero-OS is an autonomous open-source operating system that supports the peer-to-peer cloud and the deployment of infinitely scalable digital workloads with unparalleled levels of security and privacy.
|
||||
@@ -2,14 +2,20 @@
|
||||
id: home
|
||||
metaTitle: ThreeFold | Home
|
||||
metaDesc: ThreeFold is the engine for a planet positive and data sovereign Internet. A collaborative movement of people who care about a better future.
|
||||
metaImg: ./home_header.jpg
|
||||
header_slogan: BE
|
||||
header_title: THE INTERNET
|
||||
header_image: ./home_header.jpg
|
||||
metaImg: ./home_bg.jpg
|
||||
header_slogan: from zero
|
||||
header_title: to one
|
||||
header_image: ./home_bg.jpg
|
||||
|
||||
|
||||
header_altImg: threefold
|
||||
header_excerpt: ThreeFold is the engine for a planet positive and data sovereign Internet. A collaborative movement of people who care about a better future.
|
||||
button: ''
|
||||
link: ''
|
||||
header_excerpt: The digital infrastructure for an interconnected world.
|
||||
button: Expand the network
|
||||
link: /
|
||||
button2: Expand the network2
|
||||
link2: /
|
||||
button3: Expand the network3
|
||||
link3: /
|
||||
|
||||
cta2: home_cta2
|
||||
productsMain: product
|
||||
@@ -22,6 +28,7 @@ cta5: home_cta5
|
||||
comparisonMain: comparison
|
||||
comparisonSecs: [private, equal, sustainable]
|
||||
logos: [logo1, logo2, logo3, logo4, logo5, logo6]
|
||||
logosMain : logo_home
|
||||
inTheNews: in_the_news
|
||||
solution_image: ./cta_image.png
|
||||
cta: home_cta
|
||||
|
||||
BIN
content/page/home/home_bg.jpg
Normal file
BIN
content/page/home/home_bg.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 202 KiB |
5
content/page/home/logos/main/main.md
Normal file
5
content/page/home/logos/main/main.md
Normal file
@@ -0,0 +1,5 @@
|
||||
---
|
||||
id: logo_home
|
||||
title: Our Partners
|
||||
---
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
---
|
||||
id: product
|
||||
title: TECHNOLOGY FOR HUMANITY TO THRIVE AND HEAL OUR PLANET
|
||||
subtitle: The ThreeFold Movement is building a new peer-to-peer digital world – starting with compute and storage developer solutions and communication tools to empower humans with ultra-secure, scalable, and affordable technologies.
|
||||
title: THE THREEFOLD ECOSYSTEM
|
||||
subtitle: 'The ThreeFold Grid recently launched its 3rd release, representing the greatest leap towards a peer-to-peer world. Innovative organizations and developers have already started building on this revolutionary infrastructure. Check out these examples:'
|
||||
---
|
||||
|
||||
BIN
src/assets/images/brandPanel/zero_os.png
Normal file
BIN
src/assets/images/brandPanel/zero_os.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
120
src/assets/images/tft_color_logo.svg
Normal file
120
src/assets/images/tft_color_logo.svg
Normal file
@@ -0,0 +1,120 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 23.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 391.5 287.1" style="enable-background:new 0 0 391.5 287.1;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:url(#SVGID_1_);}
|
||||
.st1{clip-path:url(#SVGID_3_);fill:url(#SVGID_4_);}
|
||||
.st2{fill:url(#SVGID_5_);}
|
||||
.st3{fill:url(#SVGID_6_);}
|
||||
.st4{fill:url(#SVGID_7_);}
|
||||
.st5{fill:url(#SVGID_8_);}
|
||||
.st6{fill:url(#SVGID_9_);}
|
||||
.st7{fill:#1D1D1B;}
|
||||
</style>
|
||||
<g>
|
||||
|
||||
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="6077.7998" y1="-11708.6084" x2="6083.5737" y2="-11708.6084" gradientTransform="matrix(35.3735 0 0 35.3735 -214899.1875 414340.5938)">
|
||||
<stop offset="0" style="stop-color:#DB00E9"/>
|
||||
<stop offset="1" style="stop-color:#15FBFF"/>
|
||||
</linearGradient>
|
||||
<path class="st0" d="M273.2,187.5L273.2,187.5H94.4v-41.6H297v20.2C297,178,286.3,187.5,273.2,187.5L273.2,187.5L273.2,187.5
|
||||
c13.1,0,23.7-9.6,23.7-21.4v-20.2H94.4v41.6H273.2L273.2,187.5z"/>
|
||||
<g>
|
||||
<g>
|
||||
<defs>
|
||||
<path id="SVGID_2_" d="M94.4,24.9v41.6H297V46.1c0-11.8-10.6-21.2-23.5-21.2L94.4,24.9L94.4,24.9z"/>
|
||||
</defs>
|
||||
<clipPath id="SVGID_3_">
|
||||
<use xlink:href="#SVGID_2_" style="overflow:visible;"/>
|
||||
</clipPath>
|
||||
|
||||
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="6077.0327" y1="-11711.7119" x2="6082.8047" y2="-11711.7119" gradientTransform="matrix(35.089 0 0 35.089 -213142.6563 410998.0625)">
|
||||
<stop offset="0" style="stop-color:#2E3192"/>
|
||||
<stop offset="9.824239e-02" style="stop-color:#372F97"/>
|
||||
<stop offset="0.2567" style="stop-color:#4F29A3"/>
|
||||
<stop offset="0.4558" style="stop-color:#7520B7"/>
|
||||
<stop offset="0.6875" style="stop-color:#AB14D3"/>
|
||||
<stop offset="0.9439" style="stop-color:#EF04F7"/>
|
||||
<stop offset="1" style="stop-color:#FF00FF"/>
|
||||
</linearGradient>
|
||||
<rect x="94.4" y="24.9" class="st1" width="202.5" height="41.6"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="6038.4263" y1="-11723.8389" x2="6044.1987" y2="-11723.8389" gradientTransform="matrix(24.8071 0 0 24.8071 -149641.9375 290941.0625)">
|
||||
<stop offset="0" style="stop-color:#2E3192"/>
|
||||
<stop offset="9.824239e-02" style="stop-color:#372F97"/>
|
||||
<stop offset="0.2567" style="stop-color:#4F29A3"/>
|
||||
<stop offset="0.4558" style="stop-color:#7520B7"/>
|
||||
<stop offset="0.6875" style="stop-color:#AB14D3"/>
|
||||
<stop offset="0.9439" style="stop-color:#EF04F7"/>
|
||||
<stop offset="1" style="stop-color:#FF00FF"/>
|
||||
</linearGradient>
|
||||
<rect x="153.7" y="85.4" class="st2" width="143.2" height="41.6"/>
|
||||
|
||||
<linearGradient id="SVGID_6_" gradientUnits="userSpaceOnUse" x1="6077.0327" y1="-11708.8623" x2="6082.8047" y2="-11708.8623" gradientTransform="matrix(35.089 0 0 35.089 -213142.6563 411019.0313)">
|
||||
<stop offset="0" style="stop-color:#2E3192"/>
|
||||
<stop offset="9.824239e-02" style="stop-color:#372F97"/>
|
||||
<stop offset="0.2567" style="stop-color:#4F29A3"/>
|
||||
<stop offset="0.4558" style="stop-color:#7520B7"/>
|
||||
<stop offset="0.6875" style="stop-color:#AB14D3"/>
|
||||
<stop offset="0.9439" style="stop-color:#EF04F7"/>
|
||||
<stop offset="1" style="stop-color:#FF00FF"/>
|
||||
</linearGradient>
|
||||
<rect x="94.4" y="145.8" class="st3" width="202.5" height="41.6"/>
|
||||
<g>
|
||||
|
||||
<linearGradient id="SVGID_7_" gradientUnits="userSpaceOnUse" x1="6077.7998" y1="-11711.4365" x2="6083.5737" y2="-11711.4365" gradientTransform="matrix(35.3735 0 0 35.3735 -214899.1875 414319.6563)">
|
||||
<stop offset="0" style="stop-color:#DB00E9"/>
|
||||
<stop offset="1" style="stop-color:#15FBFF"/>
|
||||
</linearGradient>
|
||||
<path class="st4" d="M297,66.5L297,66.5H94.4V24.9h179c13.1,0,23.5,9.4,23.5,21.2V66.5L297,66.5L297,66.5V46.1
|
||||
c0-11.8-10.6-21.2-23.5-21.2h-179v41.6L297,66.5L297,66.5z"/>
|
||||
</g>
|
||||
<g>
|
||||
|
||||
<linearGradient id="SVGID_8_" gradientUnits="userSpaceOnUse" x1="6077.7998" y1="-11711.4365" x2="6083.5737" y2="-11711.4365" gradientTransform="matrix(35.3735 0 0 35.3735 -214899.1875 414319.6563)">
|
||||
<stop offset="0" style="stop-color:#DB00E9"/>
|
||||
<stop offset="1" style="stop-color:#15FBFF"/>
|
||||
</linearGradient>
|
||||
<path class="st5" d="M273.4,24.9L273.4,24.9h-179v41.6H297V46.1C297,34.5,286.5,24.9,273.4,24.9L273.4,24.9L273.4,24.9
|
||||
c13.1,0,23.5,9.4,23.5,21.2v20.4H94.4V24.9H273.4L273.4,24.9z"/>
|
||||
</g>
|
||||
<g>
|
||||
|
||||
<linearGradient id="SVGID_9_" gradientUnits="userSpaceOnUse" x1="6039.9355" y1="-11723.3252" x2="6045.7085" y2="-11723.3252" gradientTransform="matrix(25.0916 0 0 25.0916 -151398.6875 294262.9688)">
|
||||
<stop offset="0" style="stop-color:#DB00E9"/>
|
||||
<stop offset="1" style="stop-color:#15FBFF"/>
|
||||
</linearGradient>
|
||||
<polygon class="st6" points="297,127 297,127 153.7,127 153.7,85.4 297,85.4 297,127 297,127 297,127 297,85.4 153.7,85.4
|
||||
153.7,127 "/>
|
||||
</g>
|
||||
<polygon class="st7" points="59.8,229.9 47.3,229.9 47.3,261.7 38.6,261.7 38.6,229.9 26.1,229.9 26.1,223.6 59.8,223.6 "/>
|
||||
<polygon class="st7" points="101.5,223.6 101.5,261.7 92.8,261.7 92.8,245.3 74,245.3 74,261.7 65.1,261.7 65.1,223.6 74,223.6
|
||||
74,239.8 92.8,239.8 92.8,223.6 "/>
|
||||
<path class="st7" d="M144.5,261.9h-8c-1.5,0-2.5-0.5-3.1-1.5l-8.1-11.8c-0.3-0.5-0.7-0.8-1.2-1c-0.3-0.2-1-0.3-1.8-0.3h-3v14.6
|
||||
h-8.8v-38.3h13.4c3,0,5.5,0.3,7.6,0.8c2.2,0.5,3.8,1.3,5.1,2.3c1.3,1,2.3,2.2,3,3.5c0.7,1.3,1,2.8,1,4.5c0,1.3-0.2,2.5-0.7,3.6
|
||||
c-0.3,1.2-1,2.2-1.8,3.1c-0.8,1-1.7,1.8-2.8,2.5c-1.2,0.7-2.3,1.3-3.8,1.7c0.5,0.3,1.2,0.7,1.7,1c0.5,0.3,1,0.8,1.3,1.3
|
||||
L144.5,261.9z M123.9,241.6c1.5,0,2.7-0.2,3.6-0.5c1-0.3,1.8-0.8,2.5-1.3s1.2-1.3,1.5-2c0.3-0.8,0.5-1.7,0.5-2.5
|
||||
c0-1.8-0.7-3.1-2-4.1c-1.3-1-3.3-1.5-6.1-1.5h-4.6v12.1h4.6V241.6z"/>
|
||||
<polygon class="st7" points="157.6,229.7 157.6,239.5 171.6,239.5 171.6,245.5 157.6,245.5 157.6,255.6 175.8,255.6 175.8,261.9
|
||||
148.6,261.9 148.6,223.6 175.8,223.6 175.8,229.7 "/>
|
||||
<polygon class="st7" points="191.2,229.7 191.2,239.5 205.5,239.5 205.5,245.5 191.2,245.5 191.2,255.6 209.4,255.6 209.4,261.9
|
||||
182.4,261.9 182.4,223.6 209.4,223.6 209.4,229.7 "/>
|
||||
<polygon class="st7" points="224.9,229.7 224.9,240.3 240.3,240.3 240.3,246.5 224.9,246.5 224.9,261.9 216.1,261.9 216.1,223.6
|
||||
243.3,223.6 243.3,229.7 "/>
|
||||
<path class="st7" d="M290,242.6c0,2.8-0.5,5.5-1.5,7.8c-1,2.3-2.5,4.5-4.5,6.1c-2,1.7-4.1,3.1-7,4.1c-2.7,1-5.6,1.5-8.9,1.5
|
||||
c-3.3,0-6.3-0.5-8.9-1.5c-2.7-1-5-2.3-7-4.1c-2-1.8-3.5-3.8-4.5-6.1c-1-2.3-1.5-5-1.5-7.8c0-2.8,0.5-5.3,1.5-7.8
|
||||
c1-2.3,2.5-4.5,4.5-6.1s4.1-3.1,7-4.1c2.7-1,5.6-1.5,8.9-1.5c3.3,0,6.3,0.5,8.9,1.5s5,2.3,7,4.1c2,1.8,3.3,3.8,4.5,6.1
|
||||
C289.5,237.3,290,239.8,290,242.6 M281,242.6c0-2-0.3-3.8-0.8-5.5c-0.7-1.7-1.5-3-2.5-4.1c-1.2-1.2-2.5-2-4-2.5
|
||||
c-1.5-0.7-3.3-0.8-5.3-0.8s-3.8,0.3-5.3,0.8c-1.7,0.7-3,1.5-4,2.5c-1.2,1.2-2,2.5-2.5,4.1c-0.7,1.7-0.8,3.3-0.8,5.5
|
||||
c0,2,0.3,3.8,0.8,5.5c0.7,1.7,1.5,3,2.5,4c1.2,1.2,2.5,2,4,2.5c1.7,0.7,3.3,0.8,5.3,0.8s3.8-0.3,5.3-0.8c1.7-0.7,3-1.5,4-2.5
|
||||
c1.2-1.2,2-2.5,2.5-4C280.7,246.5,281,244.6,281,242.6"/>
|
||||
<polygon class="st7" points="321.8,255.4 321.8,261.9 296.5,261.9 296.5,223.6 305.2,223.6 305.2,255.4 "/>
|
||||
<path class="st7" d="M365.4,242.6c0,2.8-0.5,5.3-1.5,7.8c-1,2.3-2.5,4.3-4.5,6c-2,1.7-4.1,3-7,4c-2.7,1-5.6,1.5-8.9,1.5h-16.4
|
||||
v-38.3h16.4c3.3,0,6.3,0.5,8.9,1.5s5,2.3,7,4c2,1.7,3.3,3.6,4.5,6.1C364.9,237.3,365.4,239.8,365.4,242.6 M356.3,242.6
|
||||
c0-2-0.3-3.8-0.8-5.5c-0.7-1.7-1.5-3-2.5-4.1c-1.2-1.2-2.5-2-4-2.5c-1.7-0.7-3.3-0.8-5.3-0.8h-7.5v25.9h7.5c2,0,3.8-0.3,5.3-0.8
|
||||
c1.7-0.7,3-1.5,4-2.5c1.2-1.2,2-2.5,2.5-4.1C356,246.5,356.3,244.6,356.3,242.6"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 7.5 KiB |
@@ -22,7 +22,7 @@
|
||||
<div class="inline-flex items-center flex-shrink-0">
|
||||
<a href="/">
|
||||
<g-image
|
||||
:src="require(`!!assets-loader!@images/tfn_black.svg`)"
|
||||
:src="require(`!!assets-loader!@images/tft_color_logo.svg`)"
|
||||
class="mr-3 fill-current logo"
|
||||
alt=""
|
||||
/>
|
||||
@@ -447,7 +447,7 @@ a.active--exact.active {
|
||||
width: auto;
|
||||
}
|
||||
.logo {
|
||||
max-width: 180px;
|
||||
max-width: 80px;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.navbar {
|
||||
|
||||
@@ -144,17 +144,18 @@
|
||||
<a
|
||||
class="
|
||||
inline-block
|
||||
bg-blue-900
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-2
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
border-2
|
||||
shadow
|
||||
rounded-full
|
||||
border-black
|
||||
"
|
||||
target="_blank"
|
||||
v-if="cta.button && cta.link.includes('http')"
|
||||
@@ -164,17 +165,18 @@
|
||||
<a
|
||||
class="
|
||||
inline-block
|
||||
bg-blue-900
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-2
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
border-2
|
||||
shadow
|
||||
rounded-full
|
||||
border-black
|
||||
"
|
||||
v-else
|
||||
:href="cta.link"
|
||||
@@ -183,17 +185,18 @@
|
||||
<a
|
||||
class="
|
||||
inline-block
|
||||
bg-blue-900
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-2
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
border-2
|
||||
shadow
|
||||
rounded-full
|
||||
border-black
|
||||
"
|
||||
target="_blank"
|
||||
v-if="cta.button2 && cta.link2.includes('http')"
|
||||
@@ -203,17 +206,18 @@
|
||||
<a
|
||||
class="
|
||||
inline-block
|
||||
bg-blue-900
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-2
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
border-2
|
||||
shadow
|
||||
rounded-full
|
||||
border-black
|
||||
"
|
||||
v-else
|
||||
:href="cta.link2"
|
||||
@@ -222,17 +226,18 @@
|
||||
<a
|
||||
class="
|
||||
inline-block
|
||||
bg-blue-900
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-2
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
border-2
|
||||
shadow
|
||||
rounded-full
|
||||
border-black
|
||||
"
|
||||
target="_blank"
|
||||
v-if="cta.button3 && cta.link3.includes('http')"
|
||||
@@ -242,17 +247,18 @@
|
||||
<a
|
||||
class="
|
||||
inline-block
|
||||
bg-blue-900
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-2
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
border-2
|
||||
shadow
|
||||
rounded-full
|
||||
border-black
|
||||
"
|
||||
v-else
|
||||
:href="cta.link3"
|
||||
@@ -261,17 +267,18 @@
|
||||
<a
|
||||
class="
|
||||
inline-block
|
||||
bg-blue-900
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-2
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
border-2
|
||||
shadow
|
||||
rounded-full
|
||||
border-black
|
||||
"
|
||||
target="_blank"
|
||||
v-if="cta.button4 && cta.link4.includes('http')"
|
||||
@@ -281,17 +288,18 @@
|
||||
<a
|
||||
class="
|
||||
inline-block
|
||||
bg-blue-900
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-2
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
border-2
|
||||
shadow
|
||||
rounded-full
|
||||
border-black
|
||||
"
|
||||
v-else
|
||||
:href="cta.link4"
|
||||
|
||||
@@ -164,114 +164,77 @@
|
||||
</div>
|
||||
|
||||
<!-- home -->
|
||||
<div v-else-if="id == 'home'" class="brandpanel lg:grid lg:grid-cols-2">
|
||||
<div
|
||||
class="
|
||||
py-12
|
||||
px-6
|
||||
sm:pt-16
|
||||
sm:px-16
|
||||
lg:py-16
|
||||
lg:pr-0
|
||||
xl:py-20
|
||||
xl:px-15
|
||||
"
|
||||
v-else-if="id == 'home'"
|
||||
class="flex flex-wrap lg:text-left lg:pt-16 px-4"
|
||||
>
|
||||
<div class="lg:w-1/3 lg:px-6 self-center">
|
||||
<g-image :src="image" :alt="brand.title" />
|
||||
</div>
|
||||
<div class="lg:w-2/3 lg:px-10 order-1 lg:order-none">
|
||||
<div class="lg:self-center">
|
||||
<h2
|
||||
class="
|
||||
text-4xl
|
||||
leading-tight
|
||||
mb-6
|
||||
font-bold font-heading
|
||||
uppercase
|
||||
"
|
||||
>
|
||||
<h2 class="text-5xl mb-8 uppercase leading-none font-heading">
|
||||
<span class="block">{{ brand.title }}</span>
|
||||
<span class="block" v-if="brand.subtitle">{{
|
||||
<!-- <span class="block" v-if="brand.subtitle">{{
|
||||
brand.subtitle
|
||||
}}</span>
|
||||
}}</span> -->
|
||||
</h2>
|
||||
<div
|
||||
class="mt-4 mx-4 mb-10 text-black"
|
||||
class="pb-6 text-gray-900 text-xl leading-tight tracking-wide"
|
||||
v-html="brand.content"
|
||||
></div>
|
||||
<a
|
||||
v-if="brand.sourceUrl.includes('http')"
|
||||
:href="brand.sourceUrl"
|
||||
v-if="brand.btnTxt"
|
||||
target="_blank"
|
||||
class="
|
||||
bg-teal-300
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-57EEF8-400
|
||||
text-gray-900
|
||||
px-12
|
||||
py-2
|
||||
mr-3
|
||||
shadow
|
||||
rounded-full
|
||||
"
|
||||
>{{ brand.btnTxt }}</a
|
||||
>
|
||||
<a
|
||||
v-else
|
||||
:href="brand.sourceUrl"
|
||||
class="
|
||||
bg-teal-300
|
||||
inline-block
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-57EEF8-400
|
||||
text-gray-900
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-2
|
||||
mr-3
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
border-2
|
||||
shadow
|
||||
rounded-full
|
||||
border-black
|
||||
"
|
||||
>{{ brand.btnTxt }}</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative -mt-6">
|
||||
<g-image
|
||||
class="relative brandpanel inset-0 transform rounded-md object-fill"
|
||||
:src="image"
|
||||
:alt="brand.title"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- tft -->
|
||||
<div
|
||||
v-else-if="id == 'tft' && !diveInto"
|
||||
class="flex flex-wrap text-center tft_section lg:text-left"
|
||||
|
||||
>
|
||||
<div class="lg:w-1/2 px-2 self-center">
|
||||
<g-image
|
||||
|
||||
:src="image"
|
||||
:alt="brand.title"
|
||||
/>
|
||||
<g-image :src="image" :alt="brand.title" />
|
||||
</div>
|
||||
<div
|
||||
class="
|
||||
lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none text-center
|
||||
"
|
||||
>
|
||||
<div class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none text-center">
|
||||
<div class="lg:self-center">
|
||||
<h2
|
||||
class="
|
||||
text-6xl mb-6 uppercase leading-none font-heading
|
||||
"
|
||||
>
|
||||
<h2 class="text-6xl mb-6 uppercase leading-none font-heading">
|
||||
<span class="block">{{ brand.title }}</span>
|
||||
<span class="block" v-if="brand.subtitle">{{
|
||||
brand.subtitle
|
||||
}}</span>
|
||||
</h2>
|
||||
<div class="py-6 mt-4 text-gray-900 text-2xl leading-tight tft_subtitle tracking-wide" v-html="brand.content"></div>
|
||||
<div
|
||||
class="
|
||||
py-6
|
||||
mt-4
|
||||
text-gray-900 text-2xl
|
||||
leading-tight
|
||||
tft_subtitle
|
||||
tracking-wide
|
||||
"
|
||||
v-html="brand.content"
|
||||
></div>
|
||||
<a
|
||||
v-if="brand.btnTxt"
|
||||
target="_blank"
|
||||
@@ -297,32 +260,28 @@
|
||||
<div
|
||||
v-else-if="id == 'tft' && diveInto"
|
||||
class="flex flex-wrap tft_section lg:text-left lg:pt-16 px-4"
|
||||
|
||||
>
|
||||
<div class="lg:w-1/2 px-2 self-center">
|
||||
<g-image
|
||||
|
||||
:src="image"
|
||||
:alt="brand.title"
|
||||
/>
|
||||
<g-image :src="image" :alt="brand.title" />
|
||||
</div>
|
||||
<div
|
||||
class="
|
||||
lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none
|
||||
"
|
||||
>
|
||||
<div class="lg:w-1/2 px-2 lg:mt-10 order-1 lg:order-none">
|
||||
<div class="lg:self-center">
|
||||
<h2
|
||||
class="
|
||||
text-6xl mb-8 uppercase leading-none font-heading
|
||||
"
|
||||
>
|
||||
<h2 class="text-6xl mb-8 uppercase leading-none font-heading">
|
||||
<span class="block">{{ brand.title }}</span>
|
||||
<span class="block" v-if="brand.subtitle">{{
|
||||
brand.subtitle
|
||||
}}</span>
|
||||
</h2>
|
||||
<div class="pb-6 text-gray-900 text-2xl leading-tight tft_subtitle tracking-wide" v-html="brand.content"></div>
|
||||
<div
|
||||
class="
|
||||
pb-6
|
||||
text-gray-900 text-2xl
|
||||
leading-tight
|
||||
tft_subtitle
|
||||
tracking-wide
|
||||
"
|
||||
v-html="brand.content"
|
||||
></div>
|
||||
<a
|
||||
v-if="brand.btnTxt"
|
||||
target="_blank"
|
||||
|
||||
@@ -1,5 +1,7 @@
|
||||
<template>
|
||||
<section class="py-15 mb-10 px-4">
|
||||
<section class="mb-10 px-4 bg-no-repeats bg-cover"
|
||||
:style="{ 'background-image': 'url(' + image.src + ')' }"
|
||||
>
|
||||
<div
|
||||
class="flex flex-wrap text-center items-center pb-20 lg:text-left -mx-2"
|
||||
v-if="id == 'why'"
|
||||
@@ -43,7 +45,7 @@
|
||||
v-if="link.includes('http')"
|
||||
target="_blank"
|
||||
class="
|
||||
nline-block
|
||||
inline-block
|
||||
bg-blue-900
|
||||
text-sm
|
||||
learn-button
|
||||
@@ -63,7 +65,7 @@
|
||||
<a
|
||||
v-else
|
||||
class="
|
||||
nline-block
|
||||
inline-block
|
||||
bg-blue-900
|
||||
text-md
|
||||
learn-button
|
||||
@@ -224,29 +226,31 @@
|
||||
class="flex flex-wrap text-center lg:text-left lg:mt-10 lg:pt-10 -mx-2"
|
||||
v-else
|
||||
>
|
||||
<div class="lg:w-2/5 px-2 lg:pr-20 lg:mt-10 order-1 lg:order-none">
|
||||
<h2 class="text-6xl mb-6 mt-20 leading-none font-heading">
|
||||
<span class="text-blue-600">{{ slogan }}</span> {{ title }}
|
||||
<div class="px-2 lg:py-40 lg:mt-10 order-1 lg:order-none mx-auto text-center">
|
||||
<h2 class="text-8xl uppercase mb-6 mt-20 leading-none font-heading">
|
||||
<span class="">{{ slogan }}</span><br>
|
||||
{{ title }}
|
||||
</h2>
|
||||
<div class="mb-8 text-gray-700 leading-relaxed" v-html="excerpt"></div>
|
||||
<div v-if="button">
|
||||
<div class="mb-8 text-lg leading-relaxed" v-html="excerpt"></div>
|
||||
|
||||
<a
|
||||
v-if="link.includes('http')"
|
||||
target="_blank"
|
||||
class="
|
||||
inline-block
|
||||
bg-blue-900
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-2
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
rounded
|
||||
border-2
|
||||
shadow
|
||||
rounded-full
|
||||
border-black
|
||||
|
||||
"
|
||||
:href="link"
|
||||
>{{ button }}</a
|
||||
@@ -255,28 +259,74 @@
|
||||
v-else
|
||||
class="
|
||||
inline-block
|
||||
bg-blue-900
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-2
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
rounded
|
||||
border-2
|
||||
shadow
|
||||
rounded-full
|
||||
border-black
|
||||
|
||||
"
|
||||
:href="link"
|
||||
>{{ button }}</a
|
||||
|
||||
>
|
||||
<a
|
||||
|
||||
class="
|
||||
inline-block
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
border-2
|
||||
shadow
|
||||
border-black
|
||||
|
||||
"
|
||||
:href="link2"
|
||||
>{{ button2 }}</a
|
||||
|
||||
>
|
||||
<a
|
||||
|
||||
class="
|
||||
inline-block
|
||||
bg-white
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-gray-400
|
||||
bo
|
||||
px-12
|
||||
py-1
|
||||
mr-5
|
||||
mb-4
|
||||
border-2
|
||||
shadow
|
||||
border-black
|
||||
|
||||
"
|
||||
:href="link3"
|
||||
>{{ button3 }}</a
|
||||
|
||||
>
|
||||
<!-- <a class="text-gray-600 hover:underline" href="#">Learn more</a> -->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="lg:w-3/5 px-2 self-center">
|
||||
<!-- <div class="lg:w-3/5 px-2 self-center">
|
||||
<g-image :src="img" :alt="altImg" />
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
@@ -291,7 +341,11 @@ export default {
|
||||
"altImg",
|
||||
"image",
|
||||
"button",
|
||||
"button2",
|
||||
"button3",
|
||||
"link",
|
||||
"link2",
|
||||
"link3",
|
||||
],
|
||||
computed: {
|
||||
img: function () {
|
||||
|
||||
@@ -20,23 +20,25 @@
|
||||
:href="product.url"
|
||||
class="m-auto rounded overflow-hidden transition duration-500"
|
||||
>
|
||||
<div class="take_apart text-center pb-8 my-5">
|
||||
<div class="part text-center pb-8 my-5"
|
||||
:class="{ active: index !== 1 }"
|
||||
>
|
||||
<g-image :src="img(product.image)" />
|
||||
<h3 class="font-bold text-2xl">{{ product.title }}</h3>
|
||||
<div v-html="product.content" class="pb-4 px-5 text-gray-600"></div>
|
||||
<div v-html="product.content" class="pb-4 px-5 "></div>
|
||||
|
||||
<div v-if="product.button">
|
||||
<a
|
||||
v-if="product.url.includes('http')"
|
||||
target="_blank"
|
||||
:href="product.url"
|
||||
class="bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mb-5 shadow rounded-full"
|
||||
class="bg-white text-sm learn-button hover:bg-gray-400 px-12 py-2 mb-5 shadows border-black border-2"
|
||||
>{{ product.button }}</a
|
||||
>
|
||||
<a
|
||||
v-else
|
||||
:href="product.url"
|
||||
class="bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mb-5 shadow rounded-full"
|
||||
class="bg-white text-sm learn-button hover:bg-gray-400 px-12 py-2 mb-5 shadows border-black border-2"
|
||||
>{{ product.button }}</a
|
||||
>
|
||||
</div>
|
||||
@@ -64,8 +66,21 @@ export default {
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.take_apart {
|
||||
/* .take_apart {
|
||||
background-color: #f5f5f5;
|
||||
max-height: 570px;
|
||||
} */
|
||||
|
||||
.part {
|
||||
max-height: 570px;
|
||||
background-color: #ea1ff7;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.active {
|
||||
|
||||
background-color: #70dfc9;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<section class="py-10 pb-8 px-4 text-center">
|
||||
<div class="max-w-2xl mx-auto mb-16" v-if="main">
|
||||
<h2 class="text-4xl leading-tight mb-6 font-bold font-heading">
|
||||
<h2 class="text-5xl uppercase leading-tight mb-6 font-bold font-heading">
|
||||
{{ main.title }}
|
||||
</h2>
|
||||
<p class="text-gray-400 leading-relaxed"></p>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<Layout :hideHeader="true" :disableScroll="true">
|
||||
<div class="container mx-auto sm:pxi-0 overflow-x-hidden">
|
||||
<div class="container-fluid sm:pxi-0 mx-auto overflow-x-hidden">
|
||||
<Header
|
||||
:id="$page.markdownPage.id"
|
||||
:title="$page.markdownPage.header_title"
|
||||
@@ -9,10 +9,26 @@
|
||||
:altImg="$page.markdownPage.header_altImg"
|
||||
:excerpt="$page.markdownPage.header_excerpt"
|
||||
:button="$page.markdownPage.button"
|
||||
:button2="$page.markdownPage.button2"
|
||||
:button3="$page.markdownPage.button3"
|
||||
:link="$page.markdownPage.link"
|
||||
:link2="$page.markdownPage.link2"
|
||||
:link3="$page.markdownPage.link3"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<VideoPanel :card="$page.markdownPage.videoPanel" />
|
||||
<div class="container mx-auto sm:pxi-0 overflow-x-hidden">
|
||||
<!-- <VideoPanel :card="$page.markdownPage.videoPanel" /> -->
|
||||
|
||||
<ShowcaseProducts
|
||||
v-if="
|
||||
$page.markdownPage.productData &&
|
||||
$page.markdownPage.productData.length > 0
|
||||
"
|
||||
:id="$page.markdownPage.id"
|
||||
:main="$page.markdownPage.productsMain"
|
||||
:products="$page.markdownPage.productData"
|
||||
/>
|
||||
|
||||
<Map
|
||||
v-if="$page.markdownPage.stats"
|
||||
@@ -37,7 +53,9 @@
|
||||
|
||||
<logoShowcase
|
||||
v-if="$page.markdownPage.logos.length > 0"
|
||||
:id="$page.markdownPage.id"
|
||||
:logos="$page.markdownPage.logos"
|
||||
:main="$page.markdownPage.logosMain"
|
||||
/>
|
||||
|
||||
<BrandPanel
|
||||
@@ -52,15 +70,6 @@
|
||||
:id="$page.markdownPage.id"
|
||||
/> -->
|
||||
|
||||
<ShowcaseProducts
|
||||
v-if="
|
||||
$page.markdownPage.productData &&
|
||||
$page.markdownPage.productData.length > 0
|
||||
"
|
||||
:id="$page.markdownPage.id"
|
||||
:main="$page.markdownPage.productsMain"
|
||||
:products="$page.markdownPage.productData"
|
||||
/>
|
||||
<!-- <g-image
|
||||
class="mx-auto"
|
||||
v-if="$page.markdownPage.solution_image2"
|
||||
@@ -118,6 +127,11 @@
|
||||
header_altImg
|
||||
button
|
||||
link
|
||||
button2
|
||||
link2
|
||||
button3
|
||||
link3
|
||||
|
||||
solution_image
|
||||
# solution_image2
|
||||
# solution_image3
|
||||
@@ -286,6 +300,10 @@
|
||||
btnTxt2
|
||||
image
|
||||
}
|
||||
logosMain {
|
||||
id
|
||||
title
|
||||
}
|
||||
logos{
|
||||
id
|
||||
image
|
||||
|
||||
Reference in New Issue
Block a user