ourworld_web/www_threefold_io
23
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
samaradel
2021-05-23 14:10:59 +02:00
parent ea66c58489 463a72a064
commit 5cc8fe5ca6
13 changed files with 175 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
content/page/home/features2/empty/index.md Normal file
View File

@@ -0,0 +1,3 @@
---
id: empty
---

7
content/page/home/features2/feature1/feature1.md Normal file
View File

@@ -0,0 +1,7 @@
---
id: decentralize_the_internet
svg:
title: Decentralize the internet
---
Bring capacity to new locations. No larger than a shoebox, the 3Node fits inside any home or office.

7
content/page/home/features2/feature2/feature2.md Normal file
View File

@@ -0,0 +1,7 @@
---
id: connect_the_world
svg:
title: Connect the world
---
Enable a more accessible, affordable, and sustainable Internet by creating shorter bridges between people and capacity.

5
content/page/home/features2/feature3/feature3.md Normal file
View File

@@ -0,0 +1,5 @@
---
id: make_data_safe
svg: ./titan_v2.png
title:
---

BIN
content/page/home/features2/feature3/titan_v2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 207 KiB

7
content/page/home/features2/feature4/feature4.md Normal file
View File

@@ -0,0 +1,7 @@
---
id: earn_passive_income
svg:
title: Make Data Safe
---
Give people unbreakable storage for their data, while they keep full ownership and access rights.

7
content/page/home/features2/feature5/feature5.md Normal file
View File

@@ -0,0 +1,7 @@
---
id: features2_sustainability
svg:
title: Earn Income
---
Simply plug in your 3Node to electricity and network, and start earning ThreeFold Tokens.

7
content/page/home/features2/main/main.md Normal file
View File

@@ -0,0 +1,7 @@
---
id: Features_home_2
title: INTRODUCING THE TITAN V2 3NODE
subtitle: Work with technology that can truly help change the world.
btn: Know More
link: https://threefold.io/info/threefold#/threefold__farming_hardware_overview?id=plug-amp-farm-3nodes
---

20
content/page/home/home.md
View File

@@ -1,14 +1,14 @@
---
id: home
metaTitle: ThreeFold | Home
metaDesc: Welcome to the world’s largest peer-to-peer Internet, formed by people who want to make a difference, by people who care, by people just like you.
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.png
header_slogan: YOU
header_title: ARE THE NEW INTERNET
header_slogan: BE
header_title: THE INTERNET
header_image: ./home_header.png
header_altImg: threefold
header_excerpt: Welcome to the world’s largest peer-to-peer internet, formed by people who want to make a difference, by people who care, by people just like you.
button: "Take Part"
button: "We invite you to join in!"
link: "#home"
solution_image2: ./video_play.png
cta2: home_cta2
@@ -26,6 +26,18 @@ inTheNews: in_the_news
solution_image: ./cta_image.svg
cta: home_cta
videoPanel: home_videoPanel
featuresMain2: Features_home_2
features2:
[
decentralize_the_internet,
make_data_safe,
earn_passive_income,
connect_the_world,
empty,
features2_sustainability
]
---
<!-- header: home_header

9
gridsome.config.js
View File

@@ -88,6 +88,13 @@ module.exports = {
path: './content/page/**/features/**/*.md',
}
},
{
use: '@gridsome/source-filesystem',
options: {
typeName: 'Features2',
path: './content/page/**/features2/**/*.md',
}
},
{
use: '@gridsome/source-filesystem',
options: {
@@ -258,6 +265,8 @@ module.exports = {
appData: 'Product',
featuresMain: 'Features',
features: 'Features',
featuresMain2: 'Features2',
features2: 'Features2',
logos: 'Logo',
cta: 'Cta',
cta2: 'Cta',

1
package.json
View File

@@ -15,6 +15,7 @@
"@gridsome/transformer-remark": "^0.6.2",
"@noxify/gridsome-remark-classes": "^1.0.0",
"@noxify/gridsome-remark-table-align": "^1.0.0",
"axios": "^0.21.1",
"babel-runtime": "^6.26.0",
"core-js": "^3.6.5",
"gridsome": "^0.7.3",

88
src/components/custom/sections/Features.vue
View File

@@ -1,8 +1,52 @@
<template>
<section class="py-12 px-4">
<h2 class="text-4xl text-center mb-12 font-semibold font-heading">
<section class="py-12 px-4 text-center" v-if="id == 'home'">
<h2 class="text-4xl font-normal leading-tight font-heading">
{{ main.title }}
</h2>
<p v-if="main.subtitle" class="mb-6 text-2xl text-gray-800">
{{ main.subtitle }}
</p>
<div class="flex flex-wrap items-center -mx-4 mb-6">
<div
v-for="(feature, index) in features"
:key="index"
class="lg:w-1/3 mt-5 lg:mt-0 feature px-4 text-center"
>
<div v-if="index == 1">
<div class="w-1/2 lg:w-full lg:h-full mx-auto px-2 order-1">
<g-image :src="feature.svg" :alt="feature.title" />
</div>
</div>
<div v-else>
<span v-if="index !== 4" class="img-border"></span>
<h2 class="text-x2 mt-5 mb-3 font-normal font-heading leading-9">
{{ feature.title }}
</h2>
<div
v-html="feature.content"
class="text-lg text-gray-700 leading-relaxed"
></div>
</div>
</div>
</div>
<div class="border-wrap mx-auto mt-20" v-if="main.btn">
<g-link
class="inline-block py-2 module px-2 leading-none text-white hover:bg-gray-700 rounded shadow"
:to="main.link"
>{{ main.btn }}</g-link
>
<!-- <div v-html="main.content" class="text-sm text-gray-400 mt-5"></div> -->
</div>
</section>
<section class="py-12 px-4" v-else>
<h2 class="text-4xl text-center mb-12 font-normal font-heading">
{{ main.title }}
</h2>
<p v-if="main.subtitle" class="mb-6 text-2xl text-center font-ligh text-gray-800">
{{ main.subtitle }}
</p>
<div class="flex flex-wrap -mx-4 mb-6">
<div
v-for="feature in features"
@@ -10,17 +54,17 @@
class="lg:w-1/2 px-4 mb-6 text-center"
>
<g-image
class="w-10 h-10 mx-auto"
class="w-1/3 mx-auto"
v-if="feature.svg"
:src="feature.svg.src"
:alt="feature.svg"
></g-image>
<h3 class="text-xl my-3 font-semibold font-heading">
<h2 class="text-3xl mt-5 mb-3 font-normal font-heading">
{{ feature.title }}
</h3>
</h2>
<div
v-html="feature.content"
class="text-sm text-gray-700 leading-relaxed"
class="text-lg text-gray-700 leading-relaxed"
></div>
</div>
</div>
@@ -37,6 +81,36 @@
<script>
export default {
props: ["main", "features"],
props: ["id", "main", "features"],
};
</script>
<style scoped>
.img-border {
display: block;
width: 50px;
margin: auto;
height: 5px;
background: linear-gradient(to right, #b8a5e9, #2e3192);
}
.border-wrap {
max-width: 250px;
padding: 1rem;
position: relative;
background: linear-gradient(to right, #b8a5e9, #23256e);
padding: 3px;
border-radius: 20px;
}
.module {
width: 245px;
background: #252e6e;
color: white;
text-align: center;
border-radius: 20px;
}
.feature {
max-height: 315px !important;
}
</style>

26
src/pages/Index.vue
View File

@@ -36,14 +36,14 @@
:header="$page.markdownPage.header"
/> -->
<ShowcaseProducts
<!-- <ShowcaseProducts
:main="$page.markdownPage.productsMain"
:products="$page.markdownPage.productData"
v-if="
$page.markdownPage.productData &&
$page.markdownPage.productData.length > 0
"
/>
/> -->
<!-- <CallToActionbg1
v-if="$page.markdownPage.cta3"
@@ -60,6 +60,12 @@
:cta="$page.markdownPage.cta5"
/> -->
<Features
:id="$page.markdownPage.id"
:main="$page.markdownPage.featuresMain2"
:features="$page.markdownPage.features2"
/>
<BrandPanel
:brand="$page.markdownPage.brandPanel"
v-if="$page.markdownPage.brandPanel"
@@ -233,6 +239,20 @@
link2
link3
}
featuresMain2{
id
title
subtitle
btn
link
content
}
features2{
id
title
svg
content
}
comparisonMain{
id
title
@@ -315,6 +335,7 @@ import Header from "~/components/marketing/sections/cta-sections/Header.vue";
import SolutionsHeader from "~/components/custom/sections/header/HeaderSection.vue";
import ShowcaseProducts from "~/components/marketing/sections/cta-sections/ShowcaseProductsHome.vue";
import Comparison from "~/components/custom/sections/Comparison.vue";
import Features from "~/components/custom/sections/Features.vue";
import NewCard from "~/components/marketing/sections/cta-sections/NewCard.vue";
import BrandPanel from "~/components/marketing/sections/cta-sections/BrandPanel.vue";
import BrandPanel2 from "~/components/marketing/sections/cta-sections/BrandPanel2.vue";
@@ -329,6 +350,7 @@ import VideoPanel from "~/components/custom/VideoPanel.vue";
export default {
components: {
Header,
Features,
SolutionsHeader,
ShowcaseProducts,
Comparison,