Merge branch 'development' of github.com:threefoldfoundation/www_threefold_io into development

This commit is contained in:
Sacha
2021-04-18 16:14:53 +02:00
18 changed files with 386 additions and 377 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 31 KiB

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 40 KiB

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 55 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 41 KiB

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 70 KiB

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 5.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 105 KiB

View File

@@ -14,4 +14,4 @@ Get to know the ThreeFold vision better.
<!-- button2: Spread our Message <!-- button2: Spread our Message
link: '' link: ''
button3: Join our Community button3: Join our Community
link: '' --> link: '' -->

View File

@@ -1,14 +1,19 @@
--- ---
id: home_header id: carbon_neutral
title: '' title: ''
subtitle: Welcome to ThreeFold subtitle: Truly Better for Our Planet #Welcome to ThreeFold
btn1: '' btn1: ''
link1: '' link1: ''
btn2: '' btn2: ''
link2: '' link2: ''
--- ---
With our game-changing technology and incredible partners, together we are building a better Internet for humanity and for our planet. ThreeFolds 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 worlds 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/>
<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. 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/> <br/>
It is the foundation for a more fair and equal tomorrow. It is the foundation for a more fair and equal tomorrow.
<br/> <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. <!-- 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.

View File

@@ -15,7 +15,6 @@ brandPanel: fix_internet
brandPanel2: grid_solution brandPanel2: grid_solution
cta3: home_cta3 cta3: home_cta3
cta4: home_cta4 cta4: home_cta4
solution_image3: ./bg3.png
cta5: home_cta5 cta5: home_cta5
comparisonMain: comparison comparisonMain: comparison
comparisonSecs: [private, equal, sustainable] comparisonSecs: [private, equal, sustainable]
@@ -28,3 +27,6 @@ cta: home_cta
<!-- header: home_header <!-- header: home_header
solution_image: ./home_header.png --> solution_image: ./home_header.png -->
<!-- --> <!-- -->
<!-- solution_image3: ./carbon_neutral.png
header: carbon_neutral -->

View File

@@ -7,6 +7,10 @@
"explore": "gridsome explore" "explore": "gridsome explore"
}, },
"dependencies": { "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/source-filesystem": "^0.6.2",
"@gridsome/transformer-remark": "^0.6.2", "@gridsome/transformer-remark": "^0.6.2",
"@noxify/gridsome-remark-classes": "^1.0.0", "@noxify/gridsome-remark-classes": "^1.0.0",
@@ -21,18 +25,16 @@
"gridsome-source-graphql": "^1.0.2", "gridsome-source-graphql": "^1.0.2",
"gridsome-source-static-meta": "github:noxify/gridsome-source-static-meta#master", "gridsome-source-static-meta": "github:noxify/gridsome-source-static-meta#master",
"lodash": "^4.17.20", "lodash": "^4.17.20",
"node-sass": "^5.0.0",
"pluralize": "^8.0.0", "pluralize": "^8.0.0",
"sass-loader": "^10.0.2", "sass-loader": "^10.0.2",
"tailwindcss": "^1.8.4", "tailwindcss": "^1.8.4",
"tailwindcss-gradients": "^3.0.0", "tailwindcss-gradients": "^3.0.0",
"tailwindcss-tables": "^0.4.0", "tailwindcss-tables": "^0.4.0",
"v-tooltip": "^2.0.3", "v-tooltip": "^2.0.3",
"vue-markdown": "^2.2.4", "vue-markdown": "^2.1.2"
"@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"
}, },
"devDependencies": {} "devDependencies": {
"@tailwindcss/aspect-ratio": "^0.2.0"
}
} }

View File

@@ -1,314 +1,322 @@
@tailwind base; @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 { blockquote {
@apply border-l; @apply border-l;
@apply border-l-4; @apply border-l-4;
@apply border-l-blue-500; @apply border-l-blue-500;
@apply pl-4; @apply pl-4;
@apply italic; @apply italic;
@apply my-8; @apply my-8;
p { p {
padding: 0 !important; padding: 0 !important;
} }
} }
body { body {
font-family: 'Lato', sans-serif; font-family: "Roboto", sans-serif;
} }
body h2 { body h2 {
font-family: 'Lato', sans-serif; font-family: "Roboto", sans-serif;
} }
h1 { h1 {
font-family: 'Lato', sans-serif; font-family: "Roboto", sans-serif;
} }
body { body {
padding-top: 60px; padding-top: 60px;
} }
body p { body p {
font-family: 'Lato', sans-serif; font-family: "Roboto", sans-serif;
} }
.act-link { .act-link {
@apply bg-gray-300; @apply bg-gray-300;
} }
pre { pre {
@apply border-l; @apply border-l;
@apply border-l-2; @apply border-l-2;
@apply border-l-gray-500; @apply border-l-gray-500;
@apply pl-4; @apply pl-4;
@apply mt-4; @apply mt-4;
@apply text-base; @apply text-base;
@apply break-words; @apply break-words;
@apply overflow-x-auto; @apply overflow-x-auto;
} }
ol { ol {
@apply list-decimal; @apply list-decimal;
@apply ml-5; @apply ml-5;
} }
ul { ul {
@apply list-disc; @apply list-disc;
@apply ml-5; @apply ml-5;
} }
:not(pre)>code { :not(pre) > code {
@apply text-red-600; @apply text-red-600;
@apply text-base; @apply text-base;
} }
@tailwind components; @tailwind components;
@tailwind utilities; @tailwind utilities;
@responsive { @responsive {
.pxi-0 { .pxi-0 {
@apply px-0 #{!important}; @apply px-0 #{!important};
} }
.pyi-0 { .pyi-0 {
@apply py-0 #{!important}; @apply py-0 #{!important};
} }
.pi-0 { .pi-0 {
@apply p-0 #{!important}; @apply p-0 #{!important};
} }
} }
.animated-link:after { .animated-link:after {
content: ""; content: "";
width: 0px; width: 0px;
height: 1px; height: 1px;
display: block; display: block;
transition: 300ms; transition: 300ms;
@apply bg-gray-500; @apply bg-gray-500;
} }
.footerlink { .footerlink {
margin-left: 0rem !important; margin-left: 0rem !important;
} }
// .animated-link:hover:after { // .animated-link:hover:after {
// width: 100%; // width: 100%;
// } // }
.height-30px { .height-30px {
height: 30px; height: 30px;
} }
.text-3xl { .text-3xl {
font-size: 2.50rem font-size: 2.5rem;
} }
.no-border { .no-border {
border-width: 0px !important; border-width: 0px !important;
} }
.flex-post { .flex-post {
@apply border-b; @apply border-b;
@apply border-b-gray-300; @apply border-b-gray-300;
@apply flex-col; @apply flex-col;
@apply w-full;
.post-card-image {
// @apply h-56;
@apply h-full;
@apply w-full; @apply w-full;
.post-card-image { @apply object-cover;
// @apply h-56; @apply rounded;
@apply h-full; @apply relative;
@apply w-full; }
@apply object-cover; .post-card-title {
@apply rounded; @apply leading-none;
@apply relative; @apply text-2xl;
} @apply font-medium;
.post-card-title { }
@apply leading-none; .post-card-excerpt {
@apply text-2xl; @apply font-serif;
@apply font-medium; }
}
.post-card-excerpt {
@apply font-serif;
}
} }
.author-list-item:nth-child(n + 2) { .author-list-item:nth-child(n + 2) {
@apply -ml-3; @apply -ml-3;
} }
button:focus { button:focus {
outline: none; outline: none;
} }
.telegram_icon { .telegram_icon {
font-size: 1.2rem; font-size: 1.2rem;
} }
.post-content a { .post-content a {
color: #4ec48f; color: #4ec48f;
} }
.text-8xl { .text-8xl {
font-size: 5rem; font-size: 5rem;
line-height: 1; line-height: 1;
font-family: 'Lato', sans-serif !important; font-family: "Roboto", sans-serif !important;
} }
text-6xl { text-6xl {
font-family: 'Lato', sans-serif !important; font-family: "Roboto", sans-serif !important;
} }
text-5xl { text-5xl {
font-family: 'Lato', sans-serif !important; font-family: "Roboto", sans-serif !important;
} }
@media (min-width: 375px) { @media (min-width: 375px) {
.text-3xl { .text-3xl {
font-size: 2.25rem font-size: 2.25rem;
} }
} }
@media (min-width: 768px) { @media (min-width: 768px) {
.with-large>.flex-post:nth-child(5n), .with-large > .flex-post:nth-child(5n),
.with-large>.flex-post:nth-child(5n-1) { .with-large > .flex-post:nth-child(5n-1) {
// @apply flex-100; // @apply flex-100;
flex: 1 1 50%; flex: 1 1 50%;
@apply flex-col; @apply flex-col;
.post-card-image-link { .post-card-image-link {
@apply relative; @apply relative;
min-height: 400px; 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;
}
} }
.news>.flex-post:nth-child(5n), .post-card-image {
.news>.flex-post:nth-child(5n-1) { @apply absolute;
// @apply flex-100; @apply h-full;
flex: 1 1 50%; @apply w-full;
@apply flex-col; @apply object-cover;
.post-card-image-link { @apply rounded-lg;
@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 { .post-card-content {
font-size: 2.50rem // @apply flex-post-large-content;
flex: 0 1 auto;
@apply self-center;
} }
// .news>.flex-post:nth-child(9n+1), .post-card-title {
// .news>.flex-post:nth-child(9n+2) { @apply text-4xl;
// // @apply flex-100; }
// flex: 1 1 50%; .post-card-excerpt {
// @apply flex-col; @apply text-xl;
// .post-card-image-link { }
// @apply relative; }
// min-height: 300px; .news > .flex-post:nth-child(5n),
// } .news > .flex-post:nth-child(5n-1) {
// .post-card-image { // @apply flex-100;
// @apply absolute; flex: 1 1 50%;
// @apply h-full; @apply flex-col;
// @apply w-full; .post-card-image-link {
// @apply object-cover; @apply relative;
// @apply rounded-lg; min-height: 300px;
// } }
// .post-card-content { .post-card-image {
// // @apply flex-post-large-content; @apply absolute;
// flex: 0 1 auto; @apply h-full;
// @apply self-center; @apply w-full;
// } @apply object-cover;
// .post-card-title { @apply rounded-lg;
// @apply text-4xl; }
// } .post-card-content {
// .post-card-excerpt { // @apply flex-post-large-content;
// @apply text-xl; flex: 0 1 auto;
// } @apply self-center;
// } }
// .news>.flex-post:nth-child(9n+3), .post-card-title {
// .news>.flex-post:nth-child(9n+4), @apply text-4xl;
// .news>.flex-post:nth-child(9n+5) { }
// // @apply flex-100; .post-card-excerpt {
// flex: 1 1 300px; @apply text-xl;
// @apply flex-col; }
// .post-card-image-link { }
// @apply relative; .text-3xl {
// min-height: 180px; font-size: 2.5rem;
// } }
// .post-card-image { // .news>.flex-post:nth-child(9n+1),
// @apply absolute; // .news>.flex-post:nth-child(9n+2) {
// @apply h-full; // // @apply flex-100;
// @apply w-full; // flex: 1 1 50%;
// @apply object-cover; // @apply flex-col;
// @apply rounded-lg; // .post-card-image-link {
// } // @apply relative;
// .post-card-content { // min-height: 300px;
// // @apply flex-post-large-content; // }
// flex: 0 1 auto; // .post-card-image {
// @apply self-center; // @apply absolute;
// } // @apply h-full;
// .post-card-title { // @apply w-full;
// @apply text-4xl; // @apply object-cover;
// } // @apply rounded-lg;
// .post-card-excerpt { // }
// @apply text-xl; // .post-card-content {
// } // // @apply flex-post-large-content;
// } // flex: 0 1 auto;
// .news>.flex-post:nth-child(9n+6), // @apply self-center;
// .news>.flex-post:nth-child(9n+7), // }
// .news>.flex-post:nth-child(9n+8), // .post-card-title {
// .news>.flex-post:nth-child(9n+9) { // @apply text-4xl;
// // @apply flex-100; // }
// flex: 1 1 250px; // .post-card-excerpt {
// @apply flex-col; // @apply text-xl;
// .post-card-image-link { // }
// @apply relative; // }
// min-height: 300px; // .news>.flex-post:nth-child(9n+3),
// } // .news>.flex-post:nth-child(9n+4),
// .post-card-image { // .news>.flex-post:nth-child(9n+5) {
// @apply absolute; // // @apply flex-100;
// @apply h-full; // flex: 1 1 300px;
// @apply w-full; // @apply flex-col;
// @apply object-cover; // .post-card-image-link {
// @apply rounded-lg; // @apply relative;
// } // min-height: 180px;
// .post-card-content { // }
// // @apply flex-post-large-content; // .post-card-image {
// flex: 0 1 auto; // @apply absolute;
// @apply self-center; // @apply h-full;
// } // @apply w-full;
// .post-card-title { // @apply object-cover;
// @apply text-4xl; // @apply rounded-lg;
// } // }
// .post-card-excerpt { // .post-card-content {
// @apply text-xl; // // @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"] { // body[data-theme="dark"] {
@@ -378,4 +386,4 @@ text-5xl {
// } // }
// } // }
// } // }
// } // }

View File

@@ -1,35 +1,21 @@
<template> <template>
<div> <div @click="handleClose">
<div <div
v-if="showModal" 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"> <div
<button class="iframe-container relative h-0 w-1/2"
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" style="padding-bottom: 56.25%"
@click="handleClose" >
> <iframe
<span :src="link"
class="bg-transparent text-white opacity-5 h-6 w-6 text-2xl block outline-none focus:outline-none" frameborder="0"
> width="640"
× height="360"
</span> allowfullscreen
</button> class="absolute top-0 left-0 w-full h-full"
<div ></iframe>
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> </div>
</div> </div>
<div v-if="showModal" class="opacity-75 fixed inset-0 z-40 bg-black"></div> <div v-if="showModal" class="opacity-75 fixed inset-0 z-40 bg-black"></div>
@@ -46,4 +32,11 @@ export default {
}, },
}, },
}; };
</script> </script>
<style scoped>
@media (max-width: 768px) {
.iframe-container {
width: 100%;
}
}
</style>

View File

@@ -12,10 +12,7 @@
> >
{{ cta.slogan }} {{ cta.slogan }}
</span> </span>
<div <div v-html="cta.content" class="mt-6 mb-8 text-gray-600"></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"> <div class="mt-8 tracking-wide leading-loose" v-if="cta.video_button">
<a <a
@click="toggleModal" @click="toggleModal"
@@ -37,7 +34,8 @@
>{{ cta.button2 }}</g-link >{{ cta.button2 }}</g-link
> >
<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" :to="cta.link3"
>{{ cta.button3 }}</g-link >{{ cta.button3 }}</g-link
> >
@@ -50,14 +48,11 @@
> >
{{ cta.title }} {{ cta.title }}
</h2> </h2>
<div <div v-html="cta.content" class="mt-6 mb-8 text-gray-600"></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"> <div class="mt-8 tracking-wide leading-loose" v-if="cta.video_button">
<a <a
@click="toggleModal" @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 >{{ cta.video_button }}</a
> >
</div> </div>

View File

@@ -38,7 +38,7 @@
:href="product.url" :href="product.url"
class="bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 shadow rounded-full" class="bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 shadow rounded-full"
>{{ product.button }}</a >{{ product.button }}</a
> >
</div> </div>
</div> </div>
</a> </a>
@@ -66,5 +66,6 @@ export default {
.take_apart { .take_apart {
background-color: #f5f5f5; background-color: #f5f5f5;
max-height: 570px;
} }
</style> </style>

View File

@@ -13,7 +13,7 @@
target="_blank" target="_blank"
class="col-span-1 flex justify-center m-1 bg-gray-100" 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> </g-link>
</div> </div>
</div> </div>

View File

@@ -13,11 +13,6 @@
/> />
</div> </div>
<div class="container sm:pxi-0 mx-auto overflow-x-hidden py-5"> <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 <g-image
class="m-auto w-2/4 lg:mt-20" class="m-auto w-2/4 lg:mt-20"
v-if="$page.markdownPage.solution_image2" v-if="$page.markdownPage.solution_image2"
@@ -29,6 +24,17 @@
:cta="$page.markdownPage.cta2" :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 <ShowcaseProducts
:main="$page.markdownPage.productsMain" :main="$page.markdownPage.productsMain"
:products="$page.markdownPage.productData" :products="$page.markdownPage.productData"
@@ -48,11 +54,6 @@
:cta="$page.markdownPage.cta4" :cta="$page.markdownPage.cta4"
/> --> /> -->
<!-- <g-image
v-if="$page.markdownPage.solution_image3"
:src="$page.markdownPage.solution_image3.src"
/> -->
<!-- <CallToAction <!-- <CallToAction
v-if="$page.markdownPage.cta5" v-if="$page.markdownPage.cta5"
:cta="$page.markdownPage.cta5" :cta="$page.markdownPage.cta5"
@@ -132,7 +133,7 @@
link link
solution_image solution_image
solution_image2 solution_image2
solution_image3 # solution_image3
header{ header{
title title
subtitle subtitle
@@ -345,4 +346,4 @@ export default {
v-if="$page.markdownPage.solution_image" v-if="$page.markdownPage.solution_image"
:src="$page.markdownPage.solution_image.src" :src="$page.markdownPage.solution_image.src"
/> />
</div> --> </div> -->

View File

@@ -5,95 +5,97 @@ var flattenColorPalette = require('tailwindcss/lib/util/flattenColorPalette').de
module.exports = { module.exports = {
purge: ["./src/**/*.html", "./src/**/*.vue", "./src/**/*.jsx"], purge: ["./src/**/*.html", "./src/**/*.vue", "./src/**/*.jsx"],
theme: { theme: {
borderWidth: { borderWidth: {
default: '1px', default: '1px',
'0': '0', '0': '0',
'2': '2px', '2': '2px',
'3': '3px', '3': '3px',
'4': '4px', '4': '4px',
'6': '6px', '6': '6px',
'8': '8px' '8': '8px'
}, },
flex: { flex: {
'1': '1 1 0%', '1': '1 1 0%',
auto: '1 1 auto', auto: '1 1 auto',
initial: '0 1 auto', initial: '0 1 auto',
none: 'none', none: 'none',
'post': '1 1 300px', 'post': '1 1 300px',
'100': '1 1 100%', '100': '1 1 100%',
'post-large-content': '0 1 361px', 'post-large-content': '0 1 361px',
}, },
zIndex: { zIndex: {
'-10': '-10', '-10': '-10',
'0': 0, '0': 0,
'10': 10, '10': 10,
'20': 20, '20': 20,
'30': 30, '30': 30,
'40': 40, '40': 40,
'50': 50, '50': 50,
'25': 25, '25': 25,
'50': 50, '50': 50,
'75': 75, '75': 75,
'100': 100, '100': 100,
'1000': 1000, '1000': 1000,
'auto': 'auto', 'auto': 'auto',
}, },
corePlugins: { corePlugins: {
container: false container: false
}, },
extend: {}, extend: {},
radialGradients: { radialGradients: {
shapes: { // defaults to this value shapes: { // defaults to this value
'default': 'ellipse', 'default': 'ellipse',
}, },
sizes: { // defaults to this value sizes: { // defaults to this value
'default': '', 'default': '',
}, },
positions: { // defaults to these values positions: { // defaults to these values
'default': 'center', 'default': 'center',
't': 'top' 't': 'top'
}, },
colors: { // defaults to {} colors: { // defaults to {}
'gray-to-black': ['rgba(25, 25, 25, 1)', 'rgba(8, 8, 8, 1)', 'rgba(0, 0, 0, 1)'] 'gray-to-black': ['rgba(25, 25, 25, 1)', 'rgba(8, 8, 8, 1)', 'rgba(0, 0, 0, 1)']
}, },
}, },
}, },
variants: {}, variants: {},
plugins: [ plugins: [
function({ require('@tailwindcss/aspect-ratio'),
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'))
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}` borderTopColor: `${value}`
}, },
[`.${e(`border-r-${modifier}`)}`]: { [`.${e(`border-r-${modifier}`)}`]: {