Merge branch 'development' of github.com:threefoldfoundation/www_threefold_io into development
|
Before Width: | Height: | Size: 31 KiB After Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 40 KiB After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 55 KiB After Width: | Height: | Size: 16 KiB |
|
Before Width: | Height: | Size: 41 KiB After Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 70 KiB After Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 5.9 KiB |
BIN
content/page/home/carbon_neutral.png
Normal file
|
After Width: | Height: | Size: 105 KiB |
@@ -1,14 +1,19 @@
|
||||
---
|
||||
id: home_header
|
||||
id: carbon_neutral
|
||||
title: ''
|
||||
subtitle: Welcome to ThreeFold
|
||||
subtitle: Truly Better for Our Planet #Welcome to ThreeFold
|
||||
btn1: ''
|
||||
link1: ''
|
||||
btn2: ''
|
||||
link2: ''
|
||||
---
|
||||
|
||||
With our game-changing technology and incredible partners, together we are building a better Internet – for humanity and for our planet.
|
||||
ThreeFold’s peer-to-peer nature brings considerable energy efficiencies as compared to current solutions.
|
||||
<br/>
|
||||
<br/>
|
||||
The remaining carbon footprint of the grid will be converted into carbon credits and invested in planet positive projects to enable the world’s first carbon neutral grid.
|
||||
|
||||
<!-- With our game-changing technology and incredible partners, together we are building a better Internet – for humanity and for our planet.
|
||||
<br/>
|
||||
<br/>
|
||||
The ThreeFold peer-to-peer (P2P) Internet delivers on privacy and security, gives us all back ownership of our digital lives, can be made available everywhere in the world, and uses much less energy than today's solution.
|
||||
@@ -16,6 +21,6 @@ The ThreeFold peer-to-peer (P2P) Internet delivers on privacy and security, give
|
||||
<br/>
|
||||
It is the foundation for a more fair and equal tomorrow.
|
||||
<br/>
|
||||
And it is available, today!
|
||||
And it is available, today! -->
|
||||
|
||||
<!-- We are building the next generation peer-to-peer internet infrastructure. After creating a powerful and super sustainable operating system that can host all of humanity's digital needs and data in smart contracts, we are now creating a fair, equal and private Internet experience to free humanity from the tech giants that exploit our data.
|
||||
@@ -15,7 +15,6 @@ brandPanel: fix_internet
|
||||
brandPanel2: grid_solution
|
||||
cta3: home_cta3
|
||||
cta4: home_cta4
|
||||
solution_image3: ./bg3.png
|
||||
cta5: home_cta5
|
||||
comparisonMain: comparison
|
||||
comparisonSecs: [private, equal, sustainable]
|
||||
@@ -28,3 +27,6 @@ cta: home_cta
|
||||
<!-- header: home_header
|
||||
solution_image: ./home_header.png -->
|
||||
<!-- -->
|
||||
|
||||
<!-- solution_image3: ./carbon_neutral.png
|
||||
header: carbon_neutral -->
|
||||
|
||||
16
package.json
@@ -7,6 +7,10 @@
|
||||
"explore": "gridsome explore"
|
||||
},
|
||||
"dependencies": {
|
||||
"@fortawesome/fontawesome-svg-core": "^1.2.30",
|
||||
"@fortawesome/free-brands-svg-icons": "^5.14.0",
|
||||
"@fortawesome/free-solid-svg-icons": "^5.14.0",
|
||||
"@fortawesome/vue-fontawesome": "^2.0.0",
|
||||
"@gridsome/source-filesystem": "^0.6.2",
|
||||
"@gridsome/transformer-remark": "^0.6.2",
|
||||
"@noxify/gridsome-remark-classes": "^1.0.0",
|
||||
@@ -21,18 +25,16 @@
|
||||
"gridsome-source-graphql": "^1.0.2",
|
||||
"gridsome-source-static-meta": "github:noxify/gridsome-source-static-meta#master",
|
||||
"lodash": "^4.17.20",
|
||||
"node-sass": "^5.0.0",
|
||||
"pluralize": "^8.0.0",
|
||||
"sass-loader": "^10.0.2",
|
||||
"tailwindcss": "^1.8.4",
|
||||
"tailwindcss-gradients": "^3.0.0",
|
||||
"tailwindcss-tables": "^0.4.0",
|
||||
"v-tooltip": "^2.0.3",
|
||||
"vue-markdown": "^2.2.4",
|
||||
"@fortawesome/fontawesome-svg-core": "^1.2.30",
|
||||
"@fortawesome/free-brands-svg-icons": "^5.14.0",
|
||||
"@fortawesome/free-solid-svg-icons": "^5.14.0",
|
||||
"@fortawesome/vue-fontawesome": "^2.0.0",
|
||||
"node-sass": "^5.0.0"
|
||||
"vue-markdown": "^2.1.2"
|
||||
},
|
||||
"devDependencies": {}
|
||||
"devDependencies": {
|
||||
"@tailwindcss/aspect-ratio": "^0.2.0"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,314 +1,322 @@
|
||||
@tailwind base;
|
||||
@font-face {
|
||||
font-family: "Roboto";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url("https://fonts.googleapis.com/css2?family=Roboto");
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
@apply border-l;
|
||||
@apply border-l-4;
|
||||
@apply border-l-blue-500;
|
||||
@apply pl-4;
|
||||
@apply italic;
|
||||
@apply my-8;
|
||||
p {
|
||||
padding: 0 !important;
|
||||
}
|
||||
@apply border-l;
|
||||
@apply border-l-4;
|
||||
@apply border-l-blue-500;
|
||||
@apply pl-4;
|
||||
@apply italic;
|
||||
@apply my-8;
|
||||
p {
|
||||
padding: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Lato', sans-serif;
|
||||
font-family: "Roboto", sans-serif;
|
||||
}
|
||||
|
||||
body h2 {
|
||||
font-family: 'Lato', sans-serif;
|
||||
font-family: "Roboto", sans-serif;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: 'Lato', sans-serif;
|
||||
font-family: "Roboto", sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
padding-top: 60px;
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
body p {
|
||||
font-family: 'Lato', sans-serif;
|
||||
font-family: "Roboto", sans-serif;
|
||||
}
|
||||
|
||||
.act-link {
|
||||
@apply bg-gray-300;
|
||||
@apply bg-gray-300;
|
||||
}
|
||||
|
||||
pre {
|
||||
@apply border-l;
|
||||
@apply border-l-2;
|
||||
@apply border-l-gray-500;
|
||||
@apply pl-4;
|
||||
@apply mt-4;
|
||||
@apply text-base;
|
||||
@apply break-words;
|
||||
@apply overflow-x-auto;
|
||||
@apply border-l;
|
||||
@apply border-l-2;
|
||||
@apply border-l-gray-500;
|
||||
@apply pl-4;
|
||||
@apply mt-4;
|
||||
@apply text-base;
|
||||
@apply break-words;
|
||||
@apply overflow-x-auto;
|
||||
}
|
||||
|
||||
ol {
|
||||
@apply list-decimal;
|
||||
@apply ml-5;
|
||||
@apply list-decimal;
|
||||
@apply ml-5;
|
||||
}
|
||||
|
||||
ul {
|
||||
@apply list-disc;
|
||||
@apply ml-5;
|
||||
@apply list-disc;
|
||||
@apply ml-5;
|
||||
}
|
||||
|
||||
:not(pre)>code {
|
||||
@apply text-red-600;
|
||||
@apply text-base;
|
||||
:not(pre) > code {
|
||||
@apply text-red-600;
|
||||
@apply text-base;
|
||||
}
|
||||
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
@responsive {
|
||||
.pxi-0 {
|
||||
@apply px-0 #{!important};
|
||||
}
|
||||
.pyi-0 {
|
||||
@apply py-0 #{!important};
|
||||
}
|
||||
.pi-0 {
|
||||
@apply p-0 #{!important};
|
||||
}
|
||||
.pxi-0 {
|
||||
@apply px-0 #{!important};
|
||||
}
|
||||
.pyi-0 {
|
||||
@apply py-0 #{!important};
|
||||
}
|
||||
.pi-0 {
|
||||
@apply p-0 #{!important};
|
||||
}
|
||||
}
|
||||
|
||||
.animated-link:after {
|
||||
content: "";
|
||||
width: 0px;
|
||||
height: 1px;
|
||||
display: block;
|
||||
transition: 300ms;
|
||||
@apply bg-gray-500;
|
||||
content: "";
|
||||
width: 0px;
|
||||
height: 1px;
|
||||
display: block;
|
||||
transition: 300ms;
|
||||
@apply bg-gray-500;
|
||||
}
|
||||
|
||||
.footerlink {
|
||||
margin-left: 0rem !important;
|
||||
margin-left: 0rem !important;
|
||||
}
|
||||
|
||||
// .animated-link:hover:after {
|
||||
// width: 100%;
|
||||
// }
|
||||
.height-30px {
|
||||
height: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.text-3xl {
|
||||
font-size: 2.50rem
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
|
||||
.no-border {
|
||||
border-width: 0px !important;
|
||||
border-width: 0px !important;
|
||||
}
|
||||
|
||||
.flex-post {
|
||||
@apply border-b;
|
||||
@apply border-b-gray-300;
|
||||
@apply flex-col;
|
||||
@apply border-b;
|
||||
@apply border-b-gray-300;
|
||||
@apply flex-col;
|
||||
@apply w-full;
|
||||
.post-card-image {
|
||||
// @apply h-56;
|
||||
@apply h-full;
|
||||
@apply w-full;
|
||||
.post-card-image {
|
||||
// @apply h-56;
|
||||
@apply h-full;
|
||||
@apply w-full;
|
||||
@apply object-cover;
|
||||
@apply rounded;
|
||||
@apply relative;
|
||||
}
|
||||
.post-card-title {
|
||||
@apply leading-none;
|
||||
@apply text-2xl;
|
||||
@apply font-medium;
|
||||
}
|
||||
.post-card-excerpt {
|
||||
@apply font-serif;
|
||||
}
|
||||
@apply object-cover;
|
||||
@apply rounded;
|
||||
@apply relative;
|
||||
}
|
||||
.post-card-title {
|
||||
@apply leading-none;
|
||||
@apply text-2xl;
|
||||
@apply font-medium;
|
||||
}
|
||||
.post-card-excerpt {
|
||||
@apply font-serif;
|
||||
}
|
||||
}
|
||||
|
||||
.author-list-item:nth-child(n + 2) {
|
||||
@apply -ml-3;
|
||||
@apply -ml-3;
|
||||
}
|
||||
|
||||
button:focus {
|
||||
outline: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.telegram_icon {
|
||||
font-size: 1.2rem;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.post-content a {
|
||||
color: #4ec48f;
|
||||
color: #4ec48f;
|
||||
}
|
||||
|
||||
.text-8xl {
|
||||
font-size: 5rem;
|
||||
line-height: 1;
|
||||
font-family: 'Lato', sans-serif !important;
|
||||
font-size: 5rem;
|
||||
line-height: 1;
|
||||
font-family: "Roboto", sans-serif !important;
|
||||
}
|
||||
|
||||
text-6xl {
|
||||
font-family: 'Lato', sans-serif !important;
|
||||
font-family: "Roboto", sans-serif !important;
|
||||
}
|
||||
|
||||
text-5xl {
|
||||
font-family: 'Lato', sans-serif !important;
|
||||
font-family: "Roboto", sans-serif !important;
|
||||
}
|
||||
|
||||
@media (min-width: 375px) {
|
||||
.text-3xl {
|
||||
font-size: 2.25rem
|
||||
}
|
||||
.text-3xl {
|
||||
font-size: 2.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.with-large>.flex-post:nth-child(5n),
|
||||
.with-large>.flex-post:nth-child(5n-1) {
|
||||
// @apply flex-100;
|
||||
flex: 1 1 50%;
|
||||
@apply flex-col;
|
||||
.post-card-image-link {
|
||||
@apply relative;
|
||||
min-height: 400px;
|
||||
}
|
||||
.post-card-image {
|
||||
@apply absolute;
|
||||
@apply h-full;
|
||||
@apply w-full;
|
||||
@apply object-cover;
|
||||
@apply rounded-lg;
|
||||
}
|
||||
.post-card-content {
|
||||
// @apply flex-post-large-content;
|
||||
flex: 0 1 auto;
|
||||
@apply self-center;
|
||||
}
|
||||
.post-card-title {
|
||||
@apply text-4xl;
|
||||
}
|
||||
.post-card-excerpt {
|
||||
@apply text-xl;
|
||||
}
|
||||
.with-large > .flex-post:nth-child(5n),
|
||||
.with-large > .flex-post:nth-child(5n-1) {
|
||||
// @apply flex-100;
|
||||
flex: 1 1 50%;
|
||||
@apply flex-col;
|
||||
.post-card-image-link {
|
||||
@apply relative;
|
||||
min-height: 400px;
|
||||
}
|
||||
.news>.flex-post:nth-child(5n),
|
||||
.news>.flex-post:nth-child(5n-1) {
|
||||
// @apply flex-100;
|
||||
flex: 1 1 50%;
|
||||
@apply flex-col;
|
||||
.post-card-image-link {
|
||||
@apply relative;
|
||||
min-height: 300px;
|
||||
}
|
||||
.post-card-image {
|
||||
@apply absolute;
|
||||
@apply h-full;
|
||||
@apply w-full;
|
||||
@apply object-cover;
|
||||
@apply rounded-lg;
|
||||
}
|
||||
.post-card-content {
|
||||
// @apply flex-post-large-content;
|
||||
flex: 0 1 auto;
|
||||
@apply self-center;
|
||||
}
|
||||
.post-card-title {
|
||||
@apply text-4xl;
|
||||
}
|
||||
.post-card-excerpt {
|
||||
@apply text-xl;
|
||||
}
|
||||
.post-card-image {
|
||||
@apply absolute;
|
||||
@apply h-full;
|
||||
@apply w-full;
|
||||
@apply object-cover;
|
||||
@apply rounded-lg;
|
||||
}
|
||||
.text-3xl {
|
||||
font-size: 2.50rem
|
||||
.post-card-content {
|
||||
// @apply flex-post-large-content;
|
||||
flex: 0 1 auto;
|
||||
@apply self-center;
|
||||
}
|
||||
// .news>.flex-post:nth-child(9n+1),
|
||||
// .news>.flex-post:nth-child(9n+2) {
|
||||
// // @apply flex-100;
|
||||
// flex: 1 1 50%;
|
||||
// @apply flex-col;
|
||||
// .post-card-image-link {
|
||||
// @apply relative;
|
||||
// min-height: 300px;
|
||||
// }
|
||||
// .post-card-image {
|
||||
// @apply absolute;
|
||||
// @apply h-full;
|
||||
// @apply w-full;
|
||||
// @apply object-cover;
|
||||
// @apply rounded-lg;
|
||||
// }
|
||||
// .post-card-content {
|
||||
// // @apply flex-post-large-content;
|
||||
// flex: 0 1 auto;
|
||||
// @apply self-center;
|
||||
// }
|
||||
// .post-card-title {
|
||||
// @apply text-4xl;
|
||||
// }
|
||||
// .post-card-excerpt {
|
||||
// @apply text-xl;
|
||||
// }
|
||||
// }
|
||||
// .news>.flex-post:nth-child(9n+3),
|
||||
// .news>.flex-post:nth-child(9n+4),
|
||||
// .news>.flex-post:nth-child(9n+5) {
|
||||
// // @apply flex-100;
|
||||
// flex: 1 1 300px;
|
||||
// @apply flex-col;
|
||||
// .post-card-image-link {
|
||||
// @apply relative;
|
||||
// min-height: 180px;
|
||||
// }
|
||||
// .post-card-image {
|
||||
// @apply absolute;
|
||||
// @apply h-full;
|
||||
// @apply w-full;
|
||||
// @apply object-cover;
|
||||
// @apply rounded-lg;
|
||||
// }
|
||||
// .post-card-content {
|
||||
// // @apply flex-post-large-content;
|
||||
// flex: 0 1 auto;
|
||||
// @apply self-center;
|
||||
// }
|
||||
// .post-card-title {
|
||||
// @apply text-4xl;
|
||||
// }
|
||||
// .post-card-excerpt {
|
||||
// @apply text-xl;
|
||||
// }
|
||||
// }
|
||||
// .news>.flex-post:nth-child(9n+6),
|
||||
// .news>.flex-post:nth-child(9n+7),
|
||||
// .news>.flex-post:nth-child(9n+8),
|
||||
// .news>.flex-post:nth-child(9n+9) {
|
||||
// // @apply flex-100;
|
||||
// flex: 1 1 250px;
|
||||
// @apply flex-col;
|
||||
// .post-card-image-link {
|
||||
// @apply relative;
|
||||
// min-height: 300px;
|
||||
// }
|
||||
// .post-card-image {
|
||||
// @apply absolute;
|
||||
// @apply h-full;
|
||||
// @apply w-full;
|
||||
// @apply object-cover;
|
||||
// @apply rounded-lg;
|
||||
// }
|
||||
// .post-card-content {
|
||||
// // @apply flex-post-large-content;
|
||||
// flex: 0 1 auto;
|
||||
// @apply self-center;
|
||||
// }
|
||||
// .post-card-title {
|
||||
// @apply text-4xl;
|
||||
// }
|
||||
// .post-card-excerpt {
|
||||
// @apply text-xl;
|
||||
// }
|
||||
// }
|
||||
.post-card-title {
|
||||
@apply text-4xl;
|
||||
}
|
||||
.post-card-excerpt {
|
||||
@apply text-xl;
|
||||
}
|
||||
}
|
||||
.news > .flex-post:nth-child(5n),
|
||||
.news > .flex-post:nth-child(5n-1) {
|
||||
// @apply flex-100;
|
||||
flex: 1 1 50%;
|
||||
@apply flex-col;
|
||||
.post-card-image-link {
|
||||
@apply relative;
|
||||
min-height: 300px;
|
||||
}
|
||||
.post-card-image {
|
||||
@apply absolute;
|
||||
@apply h-full;
|
||||
@apply w-full;
|
||||
@apply object-cover;
|
||||
@apply rounded-lg;
|
||||
}
|
||||
.post-card-content {
|
||||
// @apply flex-post-large-content;
|
||||
flex: 0 1 auto;
|
||||
@apply self-center;
|
||||
}
|
||||
.post-card-title {
|
||||
@apply text-4xl;
|
||||
}
|
||||
.post-card-excerpt {
|
||||
@apply text-xl;
|
||||
}
|
||||
}
|
||||
.text-3xl {
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
// .news>.flex-post:nth-child(9n+1),
|
||||
// .news>.flex-post:nth-child(9n+2) {
|
||||
// // @apply flex-100;
|
||||
// flex: 1 1 50%;
|
||||
// @apply flex-col;
|
||||
// .post-card-image-link {
|
||||
// @apply relative;
|
||||
// min-height: 300px;
|
||||
// }
|
||||
// .post-card-image {
|
||||
// @apply absolute;
|
||||
// @apply h-full;
|
||||
// @apply w-full;
|
||||
// @apply object-cover;
|
||||
// @apply rounded-lg;
|
||||
// }
|
||||
// .post-card-content {
|
||||
// // @apply flex-post-large-content;
|
||||
// flex: 0 1 auto;
|
||||
// @apply self-center;
|
||||
// }
|
||||
// .post-card-title {
|
||||
// @apply text-4xl;
|
||||
// }
|
||||
// .post-card-excerpt {
|
||||
// @apply text-xl;
|
||||
// }
|
||||
// }
|
||||
// .news>.flex-post:nth-child(9n+3),
|
||||
// .news>.flex-post:nth-child(9n+4),
|
||||
// .news>.flex-post:nth-child(9n+5) {
|
||||
// // @apply flex-100;
|
||||
// flex: 1 1 300px;
|
||||
// @apply flex-col;
|
||||
// .post-card-image-link {
|
||||
// @apply relative;
|
||||
// min-height: 180px;
|
||||
// }
|
||||
// .post-card-image {
|
||||
// @apply absolute;
|
||||
// @apply h-full;
|
||||
// @apply w-full;
|
||||
// @apply object-cover;
|
||||
// @apply rounded-lg;
|
||||
// }
|
||||
// .post-card-content {
|
||||
// // @apply flex-post-large-content;
|
||||
// flex: 0 1 auto;
|
||||
// @apply self-center;
|
||||
// }
|
||||
// .post-card-title {
|
||||
// @apply text-4xl;
|
||||
// }
|
||||
// .post-card-excerpt {
|
||||
// @apply text-xl;
|
||||
// }
|
||||
// }
|
||||
// .news>.flex-post:nth-child(9n+6),
|
||||
// .news>.flex-post:nth-child(9n+7),
|
||||
// .news>.flex-post:nth-child(9n+8),
|
||||
// .news>.flex-post:nth-child(9n+9) {
|
||||
// // @apply flex-100;
|
||||
// flex: 1 1 250px;
|
||||
// @apply flex-col;
|
||||
// .post-card-image-link {
|
||||
// @apply relative;
|
||||
// min-height: 300px;
|
||||
// }
|
||||
// .post-card-image {
|
||||
// @apply absolute;
|
||||
// @apply h-full;
|
||||
// @apply w-full;
|
||||
// @apply object-cover;
|
||||
// @apply rounded-lg;
|
||||
// }
|
||||
// .post-card-content {
|
||||
// // @apply flex-post-large-content;
|
||||
// flex: 0 1 auto;
|
||||
// @apply self-center;
|
||||
// }
|
||||
// .post-card-title {
|
||||
// @apply text-4xl;
|
||||
// }
|
||||
// .post-card-excerpt {
|
||||
// @apply text-xl;
|
||||
// }
|
||||
// }
|
||||
}
|
||||
|
||||
// body[data-theme="dark"] {
|
||||
|
||||
@@ -1,35 +1,21 @@
|
||||
<template>
|
||||
<div>
|
||||
<div @click="handleClose">
|
||||
<div
|
||||
v-if="showModal"
|
||||
class="overflow-x-hidden overflow-y-auto fixed inset-0 z-50 outline-none focus:outline-none justify-center items-center flex"
|
||||
class="fixed inset-0 z-50 outline-none focus:outline-none justify-center items-center flex"
|
||||
>
|
||||
<div class="relative w-auto my-6 mx-auto max-w-6xl">
|
||||
<button
|
||||
class="p-1 ml-auto bg-transparent border-0 text-black opacity-5 float-right text-3xl leading-none font-semibold outline-none focus:outline-none"
|
||||
@click="handleClose"
|
||||
>
|
||||
<span
|
||||
class="bg-transparent text-white opacity-5 h-6 w-6 text-2xl block outline-none focus:outline-none"
|
||||
>
|
||||
×
|
||||
</span>
|
||||
</button>
|
||||
<div
|
||||
class="border-0 rounded-lg relative flex flex-col w-full outline-none focus:outline-none"
|
||||
>
|
||||
<div class="relative flex-auto">
|
||||
<iframe
|
||||
width="800"
|
||||
height="450"
|
||||
:src="link"
|
||||
frameborder="0"
|
||||
allow="accelerometer; autoplay; encrypted-media; gyroscope;
|
||||
picture-in-picture"
|
||||
allowfullscreen
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="iframe-container relative h-0 w-1/2"
|
||||
style="padding-bottom: 56.25%"
|
||||
>
|
||||
<iframe
|
||||
:src="link"
|
||||
frameborder="0"
|
||||
width="640"
|
||||
height="360"
|
||||
allowfullscreen
|
||||
class="absolute top-0 left-0 w-full h-full"
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="showModal" class="opacity-75 fixed inset-0 z-40 bg-black"></div>
|
||||
@@ -47,3 +33,10 @@ export default {
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
@media (max-width: 768px) {
|
||||
.iframe-container {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -12,10 +12,7 @@
|
||||
>
|
||||
{{ cta.slogan }}
|
||||
</span>
|
||||
<div
|
||||
v-html="cta.content"
|
||||
class="mt-6 mb-8 text-gray-600"
|
||||
></div>
|
||||
<div v-html="cta.content" class="mt-6 mb-8 text-gray-600"></div>
|
||||
<div class="mt-8 tracking-wide leading-loose" v-if="cta.video_button">
|
||||
<a
|
||||
@click="toggleModal"
|
||||
@@ -37,7 +34,8 @@
|
||||
>{{ cta.button2 }}</g-link
|
||||
>
|
||||
<g-link
|
||||
class="inline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full" v-if="cta.button3"
|
||||
class="inline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full"
|
||||
v-if="cta.button3"
|
||||
:to="cta.link3"
|
||||
>{{ cta.button3 }}</g-link
|
||||
>
|
||||
@@ -50,14 +48,11 @@
|
||||
>
|
||||
{{ cta.title }}
|
||||
</h2>
|
||||
<div
|
||||
v-html="cta.content"
|
||||
class="mt-6 mb-8 text-gray-600"
|
||||
></div>
|
||||
<div v-html="cta.content" class="mt-6 mb-8 text-gray-600"></div>
|
||||
<div class="mt-8 tracking-wide leading-loose" v-if="cta.video_button">
|
||||
<a
|
||||
@click="toggleModal"
|
||||
class="inline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full"
|
||||
class="inline-block cursor-pointer bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full"
|
||||
>{{ cta.video_button }}</a
|
||||
>
|
||||
</div>
|
||||
|
||||
@@ -66,5 +66,6 @@ export default {
|
||||
|
||||
.take_apart {
|
||||
background-color: #f5f5f5;
|
||||
max-height: 570px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
target="_blank"
|
||||
class="col-span-1 flex justify-center m-1 bg-gray-100"
|
||||
>
|
||||
<img class="" :src="img(partner.logo)" />
|
||||
<img :src="img(partner.logo)" />
|
||||
</g-link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -13,11 +13,6 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="container sm:pxi-0 mx-auto overflow-x-hidden py-5">
|
||||
<!-- <SolutionsHeader
|
||||
v-if="$page.markdownPage.header"
|
||||
:header="$page.markdownPage.header"
|
||||
/> -->
|
||||
|
||||
<g-image
|
||||
class="m-auto w-2/4 lg:mt-20"
|
||||
v-if="$page.markdownPage.solution_image2"
|
||||
@@ -29,6 +24,17 @@
|
||||
:cta="$page.markdownPage.cta2"
|
||||
/>
|
||||
|
||||
<!-- <g-image
|
||||
class="m-auto w-2/4 lg:mt-20"
|
||||
v-if="$page.markdownPage.solution_image3"
|
||||
:src="$page.markdownPage.solution_image3.src"
|
||||
/> -->
|
||||
|
||||
<!-- <SolutionsHeader
|
||||
v-if="$page.markdownPage.header"
|
||||
:header="$page.markdownPage.header"
|
||||
/> -->
|
||||
|
||||
<ShowcaseProducts
|
||||
:main="$page.markdownPage.productsMain"
|
||||
:products="$page.markdownPage.productData"
|
||||
@@ -48,11 +54,6 @@
|
||||
:cta="$page.markdownPage.cta4"
|
||||
/> -->
|
||||
|
||||
<!-- <g-image
|
||||
v-if="$page.markdownPage.solution_image3"
|
||||
:src="$page.markdownPage.solution_image3.src"
|
||||
/> -->
|
||||
|
||||
<!-- <CallToAction
|
||||
v-if="$page.markdownPage.cta5"
|
||||
:cta="$page.markdownPage.cta5"
|
||||
@@ -132,7 +133,7 @@
|
||||
link
|
||||
solution_image
|
||||
solution_image2
|
||||
solution_image3
|
||||
# solution_image3
|
||||
header{
|
||||
title
|
||||
subtitle
|
||||
|
||||
@@ -5,95 +5,97 @@ var flattenColorPalette = require('tailwindcss/lib/util/flattenColorPalette').de
|
||||
|
||||
|
||||
module.exports = {
|
||||
purge: ["./src/**/*.html", "./src/**/*.vue", "./src/**/*.jsx"],
|
||||
theme: {
|
||||
borderWidth: {
|
||||
default: '1px',
|
||||
'0': '0',
|
||||
'2': '2px',
|
||||
'3': '3px',
|
||||
'4': '4px',
|
||||
'6': '6px',
|
||||
'8': '8px'
|
||||
},
|
||||
flex: {
|
||||
'1': '1 1 0%',
|
||||
auto: '1 1 auto',
|
||||
initial: '0 1 auto',
|
||||
none: 'none',
|
||||
'post': '1 1 300px',
|
||||
'100': '1 1 100%',
|
||||
'post-large-content': '0 1 361px',
|
||||
},
|
||||
zIndex: {
|
||||
'-10': '-10',
|
||||
'0': 0,
|
||||
'10': 10,
|
||||
'20': 20,
|
||||
'30': 30,
|
||||
'40': 40,
|
||||
'50': 50,
|
||||
'25': 25,
|
||||
'50': 50,
|
||||
'75': 75,
|
||||
'100': 100,
|
||||
'1000': 1000,
|
||||
'auto': 'auto',
|
||||
},
|
||||
corePlugins: {
|
||||
container: false
|
||||
},
|
||||
extend: {},
|
||||
radialGradients: {
|
||||
shapes: { // defaults to this value
|
||||
'default': 'ellipse',
|
||||
},
|
||||
sizes: { // defaults to this value
|
||||
'default': '',
|
||||
},
|
||||
positions: { // defaults to these values
|
||||
'default': 'center',
|
||||
't': 'top'
|
||||
},
|
||||
colors: { // defaults to {}
|
||||
'gray-to-black': ['rgba(25, 25, 25, 1)', 'rgba(8, 8, 8, 1)', 'rgba(0, 0, 0, 1)']
|
||||
},
|
||||
},
|
||||
},
|
||||
variants: {},
|
||||
plugins: [
|
||||
function({
|
||||
addComponents
|
||||
}) {
|
||||
addComponents({
|
||||
'.container': {
|
||||
maxWidth: '100%',
|
||||
'@screen sm': {
|
||||
maxWidth: '640px',
|
||||
},
|
||||
'@screen md': {
|
||||
maxWidth: '768px',
|
||||
},
|
||||
'@screen lg': {
|
||||
maxWidth: '1024px',
|
||||
},
|
||||
'@screen xl': {
|
||||
maxWidth: '1040px',
|
||||
},
|
||||
}
|
||||
})
|
||||
},
|
||||
function({
|
||||
addUtilities,
|
||||
e,
|
||||
theme,
|
||||
variants
|
||||
}) {
|
||||
const colors = flattenColorPalette(theme('borderColor'))
|
||||
purge: ["./src/**/*.html", "./src/**/*.vue", "./src/**/*.jsx"],
|
||||
theme: {
|
||||
borderWidth: {
|
||||
default: '1px',
|
||||
'0': '0',
|
||||
'2': '2px',
|
||||
'3': '3px',
|
||||
'4': '4px',
|
||||
'6': '6px',
|
||||
'8': '8px'
|
||||
},
|
||||
flex: {
|
||||
'1': '1 1 0%',
|
||||
auto: '1 1 auto',
|
||||
initial: '0 1 auto',
|
||||
none: 'none',
|
||||
'post': '1 1 300px',
|
||||
'100': '1 1 100%',
|
||||
'post-large-content': '0 1 361px',
|
||||
},
|
||||
zIndex: {
|
||||
'-10': '-10',
|
||||
'0': 0,
|
||||
'10': 10,
|
||||
'20': 20,
|
||||
'30': 30,
|
||||
'40': 40,
|
||||
'50': 50,
|
||||
'25': 25,
|
||||
'50': 50,
|
||||
'75': 75,
|
||||
'100': 100,
|
||||
'1000': 1000,
|
||||
'auto': 'auto',
|
||||
},
|
||||
corePlugins: {
|
||||
container: false
|
||||
},
|
||||
extend: {},
|
||||
radialGradients: {
|
||||
shapes: { // defaults to this value
|
||||
'default': 'ellipse',
|
||||
},
|
||||
sizes: { // defaults to this value
|
||||
'default': '',
|
||||
},
|
||||
positions: { // defaults to these values
|
||||
'default': 'center',
|
||||
't': 'top'
|
||||
},
|
||||
colors: { // defaults to {}
|
||||
'gray-to-black': ['rgba(25, 25, 25, 1)', 'rgba(8, 8, 8, 1)', 'rgba(0, 0, 0, 1)']
|
||||
},
|
||||
},
|
||||
},
|
||||
variants: {},
|
||||
plugins: [
|
||||
require('@tailwindcss/aspect-ratio'),
|
||||
|
||||
const utilities = _.flatMap(_.omit(colors, 'default'), (value, modifier) => ({
|
||||
function ({
|
||||
addComponents
|
||||
}) {
|
||||
addComponents({
|
||||
'.container': {
|
||||
maxWidth: '100%',
|
||||
'@screen sm': {
|
||||
maxWidth: '640px',
|
||||
},
|
||||
'@screen md': {
|
||||
maxWidth: '768px',
|
||||
},
|
||||
'@screen lg': {
|
||||
maxWidth: '1024px',
|
||||
},
|
||||
'@screen xl': {
|
||||
maxWidth: '1040px',
|
||||
},
|
||||
}
|
||||
})
|
||||
},
|
||||
function ({
|
||||
addUtilities,
|
||||
e,
|
||||
theme,
|
||||
variants
|
||||
}) {
|
||||
const colors = flattenColorPalette(theme('borderColor'))
|
||||
|
||||
[`.${e(`border-t-${modifier}`)}`]: {
|
||||
const utilities = _.flatMap(_.omit(colors, 'default'), (value, modifier) => ({
|
||||
|
||||
[`.${e(`border-t-${modifier}`)}`]: {
|
||||
borderTopColor: `${value}`
|
||||
},
|
||||
[`.${e(`border-r-${modifier}`)}`]: {
|
||||
|
||||