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

Merge pull request #499 from threefoldfoundation/development

Browse Source 
12.12
This commit is contained in:
sasha-astiadi
2024-12-12 19:38:01 +01:00
committed by GitHub
parent 40c2f11a89 c3ffc9cf79
commit e6db33f79c
27 changed files with 405 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
content/blog/roadmap_to_web4/index.md Normal file
View File

@@ -0,0 +1,111 @@
---
id: roadmap_to_web4
title: "ThreeFold's Roadmap to Web4"
image_caption: Roadmap to Web4
description: Web4. Where humans and AI collaborate to develop a new paradigm aimed at advancing planetary well-being.
date: 2024-12-12
taxonomies:
people: [sam_taggart]
tags: [community, decentralization, farming, grid, cloud]
categories: [community, decentralization, farming, grid, cloud]
extra:
imgPath: roadmap_to_web4.png
isFeatured: true
---
### **Part I: A Natural Evolution**
The story of the Internet is one of ongoing evolution.
<br>
It began in the 1960s and 70s with a decentralized dream. Researchers and early pioneers built networks where computers communicated directly – peer-to-peer. There were no gatekeepers, no central authorities. Just nodes of people and their computers, freely exchanging data. This was the foundation for what we now call the Internet.
<br>
But as the Internet grew in the 90s, things started to change. The scrappy network of computers connected in an ad hoc manner started becoming an economic arena. Companies built platforms, services, and hubs. Massive infrastructure emerged to support this growth — hyperscale data centers, global fiber-optic networks, and powerful servers. The world logged on, and the web became commercialized.
<br>
This was Web 1.0 – static pages and basic information sharing. Then came Web 2.0 – the age of social media, cloud computing, and user-generated content, which makes up the vast majority of our shared digital lives. Connection became easier, but power was consolidated. Big platforms have taken ownership of our data and control our experiences.
<br>
In response, a new idea emerged – Web 3.0. Decentralized technologies like blockchain aimed to give control back to users. But Web3 is still finding its way, grappling with scalability, accessibility, and adoption.
<br>
And now, with the introduction of AI, we stand at the dawn of Web 4.0, the next evolution of the Internet. Web 4.0 is an agent-centric model, also sometimes referred to as the symbiotic web. In Web 4.0, we’ll interact both with humans and with virtual AI agents, our digital counterparts. These agents will be able to help with everything, from organizing our days to navigating our online presence.
But here’s the catch – if we stay on the current path, these agents and the powerful intelligence systems behind them won’t belong to us. They’ll be owned – just like our data is today – by someone else. Web 4.0 will be no different than what we’ve had in the past.
<br>
This isn’t just about data anymore, it’s about intelligence itself. It's about the future of our species and the planet. The question is: will we seize the opportunity to create something new – a decentralized network of augmented, collective intelligence.
<br>
This vision is what *we* call Web4.
### **Part II: Our Web4 Vision**
Web4. Where humans and AI collaborate to develop a new paradigm aimed at advancing planetary well-being. To our knowledge, we are the world’s first project approaching a fully functional Web4 infrastructure. But what does a Web4 infrastructure look like?
<br>
A Web4 infrastructure is built on three essential layers: personal, infrastructure, and physical.
<br>
At the heart of Web4 is the individual – you. The personal level involves an AI assistant, your digital counterpart, which manages your digital life and is owned fully by you. An identity layer ensures reputation and authenticity of information, an intelligence layer brings decentralized personal AI systems for smarter collaboration and decision-making. And a transaction layer integrates seamlessly with Web3 systems and beyond for secure and efficient transactions.
<br>
Next is the infrastructure layer, the backbone of Web4. This layer re-imagines how the Internet works. The network layer delivers private, scalable communication. The data layer revolutionizes how we store, share, and control data. Serverless compute resources allow applications to run closer to users and their data, improving speed and performance. And the cloud layer bridges today’s Web2 systems with a Web4 future, ensuring everything works together.
<br>
Finally, the physical layer brings Web4 into the real world. Routers act as gateways between the old web and the new, creating secure, next-generation communication channels. Nodes power the ecosystem by delivering AI, data, and compute capabilities. Phones become more than just a device, they are your portal into Web4, and capable of building meshed networks for better connectivity. And any modern desktop running Linux, Windows, or MacOS integrates seamlessly into this new ecosystem.
<br>
This vision may seem bold, but at ThreeFold, we are well on our way to making it a reality. Over the past decade, we have tackled complex challenges in areas such as data storage, secure overlay networking, and autonomous cloud security. A working proof of concept infrastructure grid is alive today thanks to the ThreeFold developers and a global community.
<br>
Today, we are pleased to announce the next step in the roadmap to Web4: Web4 Node, Web4 Phone, and Web4 Router.
### **Part III: The Journey Begins**
Today, we are pleased to announce the next step in the roadmap to Web4: V4 3Node, 3Phone equipped with 3Bot technology, and 3Router.
<br>
**3Nodes** are a familiar concept in the ThreeFold ecosystem, now also entering their fourth generation. Nodes provide capacity to the network, and in exchange generate rewards. Today, in collaboration with ThreeFold community vendors HostServiceNL in Europe and DuckFarmData in North America, we are announcing three different models of the V4 3Node. You can find more info and how to place orders [here](https://docs.threefold.io/docs/become-a-farmer/get_started).
<br>
**[3Phones](https://docs.threefold.io/docs/components/3phone)** are a portal into the Web4 world. We are pleased to share that we will be offering several models of 3Phones into the market based on the [Volla Phone](https://volla.online/en/) platform. 3Phones will be equipped with your own decentralized AI agent called **[3Bot](https://docs.threefold.io/docs/components/3bot)**. You can pre-order a 3Phone [here](https://threefold.io/signup).
<br>
And then there are **[3Routers](https://docs.threefold.io/docs/components/3router)**. Routers ensure that Web4 devices (phones and desktops running Mycelium) can communicate with one another – peer-to-peer, private, and secure. 3Routers will be available next year, and you can express your interest [here](https://threefold.io/signup).
<br>
<iframe width="896" height="504" src="https://www.youtube.com/embed/Z3TRrwxOIz0?si=fCnX1D1uHnU4k411" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
<br>
Now, we need more than technology – we need pioneers, thinkers, and creators to help expand the Web4 ecosystem. Whether you contribute as a developer, a node operator, or via any other role, your participation is crucial. We need to bring millions of nodes, routers, and phones into the ecosystem. This is the next step in our journey.
<br>
The future of the Internet is being written today, and Web4 is the next chapter – a chapter where control, collaboration, and innovation belong to everyone. But this isn’t just our journey – it’s yours too. Together, we can build a smarter, more equitable digital world, where AI and humans work side by side to solve our greatest challenges.
<br>
Will you join us in realizing this vision?
<br>
Today we make these announcements to our incredible community, so you can provide your feedback and be amongst the first to register. In the coming weeks, after the new year, we will begin to spread this vision further. And this is only the beginning of our Web4 journey. Every three months, on 03.03, 06.06, 09.09, and 12.12 of next year we will continue to unveil major aspects of the Web4 vision. Of course there will be plenty of discussion and updates as we go, as well. Stay tuned.

BIN
content/blog/roadmap_to_web4/roadmap_to_web4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 304 KiB

2
content/header/index.md
View File

@@ -9,7 +9,7 @@ extra:
- [Why]("/why")
- [What]("/what")
- [12.12.24]("/action")
- [Take Actions]("/action")
- Info

58
content/signup/index.md Normal file
View File

@@ -0,0 +1,58 @@
---
title: "Sign Up"
description: "Take actions and become a part of a pioneering Web4 movement with ThreeFold on 12.12.2024" # quotation marks to allow colons where used
template: "layouts/signup.html"
insert_anchor_links: "left"
extra:
author: ThreeFold
imgPath: tf.png
---
<style>
.rounded_img img {
border-radius: 8px;
}
.person img{
border-radius: 100%;
max-width:100px;
}
.myscale{
transition: transform .5s;
}
.myscale:hover{
transform: scale(1.2);
background-color: whitesmoke;
}
.road_border{
border-left: 1px solid rgb(156, 156, 156);
}
.white-gray{
color: #9f9f9f;
}
</style>

BIN
content/signup/tf.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 510 B

BIN
static/images/web4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 125 KiB

BIN
static/images/web4_tools.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 257 KiB

BIN
static/images/web4_tools2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 246 KiB

BIN
static/images/web4_tools3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 216 KiB

1
templates/index.html
View File

@@ -2,7 +2,6 @@
{% block content %}
{% include "partials/home/hero.html" %}
{% include "partials/home/banner.html" %}
{% include "partials/home/grid_stats.html" %}
{% include "partials/home/farmers.html" %}
{% include "partials/home/features.html" %}

7
templates/layouts/action.html
View File

@@ -1,9 +1,8 @@
{% extends "_default/base.html" %}
{% block content %}
{% include "partials/action/banner.html" %}
{% include "partials/action/announcements.html" %}
{% include "partials/action/video.html" %}
{% include "partials/action/web4tools.html" %}
{% include "partials/action/action.html" %}
{% include "partials/action/cta.html" %}
{% include "partials/home/cta.html" %}
{% endblock content %}

6
templates/layouts/signup.html Normal file
View File

@@ -0,0 +1,6 @@
{% extends "_default/base.html" %}
{% block content %}
{% include "partials/form.html" %}
{% endblock content %}

3
templates/partials/action/action.html
View File

@@ -22,7 +22,8 @@
This page is in black & white, to let YOU be the <span style="color: red;">color</span> of the future of the internet.
</p>
</blockquote>
<br>
<br>
<a href="/signup" target="_blank" class="mt-4 border border-white px-6 py-2 fade-in lg:text-2xl text-xl rounded-2xl tracking-normal font-medium text-white hover:text-gray-400 blinking-effect"><span aria-hidden="true">→ </span>Pre-register Now</a>
</figure>
</div>
</div>

6
templates/partials/action/banner.html
View File

@@ -1,12 +1,8 @@
<div class="h-screen flex flex-col justify-center items-center ">
<div class="h-screen flex flex-col justify-center items-center">
<div class="">
<img
class="mx-auto"
src="/images/mycel2.gif"
alt="TF">
<div class="text-center">
<h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-5xl fade-in">Save the Date</h2>
<p class="fade-in mx-auto mt-4 max-w-3xl text-pretty lg:text-5xl text-4xl font-medium text-gray-200 fade-in">12.12.24</p>
</div>
</div>
</div>

40
templates/partials/action/tools.html Normal file
View File

@@ -0,0 +1,40 @@
<div class="bg-transparent py-24 sm:py-32">
<div class="mx-auto max-w-7xl grid grid-cols-1 gap-x-16 gap-y-16 sm:gap-y-20 lg:grid-cols-2 lg:items-start px-6">
<div class="mx-auto w-full max-w-3xl lg:mx-0">
<h2 class="fade-in text-balance lg:text-5xl text-4xl leading-tight font-normal tracking-tight text-white">Unlock the Web4 Revolution with ThreeFold</h2>
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">From secure phones and AI-driven virtual assistants to encrypted routers and decentralized nodes, explore a suite of innovative Web4 products designed to redefine connectivity, empower autonomy, and simplify daily life with cutting-edge technology.</p>
<div class="mt-8 flex gap-x-6">
</div>
</div>
<div class="mx-auto grid w-full max-w-xl grid-cols-2 gap-2 items-center gap-y-12 sm:gap-y-14 lg:mx-0 lg:max-w-none lg:pl-8">
<div class="grid-item bg-white/5 p-2 lg:p-12">
<div class="p-10">
<p class="mt-2 lg:text-xl text-lg font-medium tracking-tight text-white">Web4 Phone</p>
<p class="mt-2 max-w-lg text-sm/6 text-gray-400 font-light leading-tight">The world’s first truly decentralized smartphone on a mission to define Web4 mobile connectivity.</p>
<a href="#" class="mt-6 text-sm/6 font-semibold text-white">Learn more <span aria-hidden="true">→</span></a>
</div>
</div>
<div class="grid-item bg-white/5 p-2 lg:p-12">
<div class="p-10">
<p class="mt-2 lg:text-xl text-lg font-medium tracking-tight text-white">Web4 Router</p>
<p class="mt-2 max-w-lg text-sm/6 text-gray-400 font-light leading-tight">Be your own Internet and unlock the full potential of Web4 from the convenience of your home.</p>
<a href="#" class="mt-6 text-sm/6 font-semibold text-white">Learn more <span aria-hidden="true">→</span></a>
</div>
</div>
<div class="grid-item bg-white/5 p-2 lg:p-12 lg:pt-4">
<div class="p-10">
<p class="mt-2 lg:text-xl text-lg font-medium tracking-tight text-white">Web4 Nodes</p>
<p class="mt-2 max-w-lg text-sm/6 text-gray-400 font-light leading-tight">Power the Internet by hosting your own Web4 Node—contributing to a secure, scalable, and autonomous Web4 ecosystem.</p>
<a href="#" class="mt-6 text-sm/6 font-semibold text-white">Learn more <span aria-hidden="true">→</span></a>
</div>
</div>
<div class="grid-item bg-white/5 p-2 lg:p-12 lg:pt-4">
<div class="p-10">
<p class="mt-2 lg:text-xl text-lg font-medium tracking-tight text-white">TF Genie</p>
<p class="mt-2 max-w-lg text-sm/6 text-gray-400 font-light leading-tight">Your AI-powered Web4 assistant, designed to enhance productivity and simplify daily tasks with seamless integration.</p>
<a href="#" class="mt-6 text-sm/6 font-semibold text-white">Learn more <span aria-hidden="true">→</span></a>
</div>
</div>
</div>
</div>
</div>

93
templates/partials/action/video.html Normal file
View File

@@ -0,0 +1,93 @@
<div class="flex bg-transparent pt-16 pb-10 justify-center">
<div class="lg:max-w-7xl max-w-2xl p-8 mx-auto text-center">
<!-- Main Heading -->
<h2 class="fade-in text-pretty lg:text-6xl text-4xl leading-tight font-normal tracking-tight text-white">
Join the Web4 Revolution
</h2>
<!-- Subtext -->
<p class="mx-auto mt-6 max-w-2xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in fade-in-delay">
Join us on our journey to the decentralized internet. Watch the video below to learn more about our mission and products.
</p>
<br>
<!-- Embed YouTube Video -->
<div class="mt-8 flex justify-center">
<iframe width="800" height="450" src="https://www.youtube.com/embed/64mbEewI0Ag?si=I0m_ShxlTUk3mok-" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
<!-- Call to Action Button -->
<div class="mt-12 fade-in flex items-center justify-center gap-x-6">
<a href="/signup" target="_blank"
class="fade-in rounded-2xl bg-white px-4 py-2.5 text-sm font-semibold text-black shadow-sm hover:text-gray-800 hover:bg-green focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 blinking-effect">
Pre-register Now
</a>
</div>
</div>
</div>
<style>
/* Fade-in animation */
.fade-in {
opacity: 0;
animation: fadeIn 1s ease-out forwards;
}
/* Fade-in keyframe */
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
/* Responsive iframe for YouTube video */
.responsive-iframe {
width: 100%;
height: 0;
padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
position: relative;
border: none;
}
.responsive-iframe iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* Ensure content aligns properly */
.flex.justify-center {
display: flex;
justify-content: center;
}
/* Style for the button */
.blinking-effect {
animation: blink 1.5s step-start infinite;
}
@keyframes blink {
50% {
opacity: 0.5;
}
}
</style>
<script>
// JavaScript to add 'visible' class after loading
window.addEventListener('DOMContentLoaded', () => {
const fadeInElements = document.querySelectorAll('.fade-in');
fadeInElements.forEach((element, index) => {
// Adding a delay for each fade-in effect (increasing delay with index)
setTimeout(() => {
element.classList.add('visible');
}, index * 1000); // 1000ms delay between each element
});
});
</script>

41
templates/partials/action/web4tools.html Normal file
View File

@@ -0,0 +1,41 @@
<div class="overflow-hidden bg-transparent py-16 lg:py-24">
<div class="relative mx-auto max-w-xl px-6 lg:max-w-7xl lg:px-8">
<div class="mx-auto max-w-2xl px-6 lg:max-w-6xl lg:px-8">
<h2 class="mx-auto fade-in text-left lg:text-5xl text-4xl leading-snug font-normal tracking-tight text-white">Discover ThreeFold's Web4 Products for a Smarter, Secure Future</h2>
<p class="text-left my-6 max-w-5xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">
From secure phones and AI-driven virtual assistants to encrypted routers and decentralized nodes, explore a suite of innovative Web4 products designed to redefine connectivity, empower autonomy, and simplify daily life with cutting-edge technology.</p>
</div>
<div class="relative lg:grid lg:grid-cols-2 lg:items-center lg:gap-8">
<!-- Image on the left and text on the right -->
<div class="fade-in relative -mx-4 mt-10 lg:mt-0" aria-hidden="true">
<img class="fade-in blinking-effect relative mx-auto" width="490" src="/images/web4_tools3.png" alt="">
</div>
<!-- Text on the left -->
<div class="relative p-4"> <!-- Add padding here for all sides -->
<div class="gap-y-4">
<div class="fade-in relative p-6 bg-white/5 rounded-lg"> <!-- Add padding inside this div -->
<dt class="mt-2 lg:text-xl text-lg font-medium tracking-tight text-white">3Phone</dt>
<dd class="my-2 max-w-lg text-sm/6 text-gray-400 font-light leading-tight">Secure smartphones come with built-in decentralized apps and seamlessly integrate with the ThreeFold Grid.</dd>
<a href="https://docs.threefold.io/docs/components/3phone/" target="_blank" class="text-sm/6 font-semibold text-white hover:text-gray-200">Learn more <span aria-hidden="true">→</span></a>
</div>
<div class="fade-in relative p-6 mt-4 bg-white/5 rounded-lg"> <!-- Add padding inside this div -->
<dt class="mt-2 lg:text-xl text-lg font-medium tracking-tight text-white">3Bot</dt>
<dd class="my-2 max-w-lg text-sm/6 text-gray-400 font-light leading-tight">An AI-powered virtual system administrator helps deploy and manage your digital life.</dd>
<a href="https://docs.threefold.io/docs/components/3bot" target="_blank" class=" text-sm/6 font-semibold text-white hover:text-gray-200">Learn more <span aria-hidden="true">→</span></a>
</div>
<div class="fade-in relative p-6 mt-4 bg-white/5 rounded-lg"> <!-- Add padding inside this div -->
<dt class="mt-2 lg:text-xl text-lg font-medium tracking-tight text-white">3Node</dt>
<dd class="my-2 max-w-lg text-sm/6 text-gray-400 font-light leading-tight">The backbone of Web4's cloud infrastructure, providing compute and data resources.</dd>
<a href="https://docs.threefold.io/docs/components/3node" target="_blank" class=" text-sm/6 font-semibold text-white hover:text-gray-200">Learn more <span aria-hidden="true">→</span></a>
</div>
<div class="fade-in relative p-6 mt-4 bg-white/5 rounded-lg"> <!-- Add padding inside this div -->
<dt class="mt-2 lg:text-xl text-lg font-medium tracking-tight text-white">3Router</dt>
<dd class="my-2 max-w-lg text-sm/6 text-gray-400 font-light leading-tight">Smart routers ensure shortest-path connections between nodes and phones with end-to-end encryption.</dd>
<a href="https://docs.threefold.io/docs/components/3router" target="_blank" class=" text-sm/6 font-semibold text-white hover:text-gray-200">Learn more <span aria-hidden="true">→</span></a>
</div>
</div>
</div>
</div>
</div>
</div>

2
templates/partials/cta.html
View File

@@ -7,6 +7,8 @@
<a href="https://docs.threefold.io/" target="_blank" class="fade-in rounded-2xl bg-white px-4 py-2.5 text-sm font-semibold text-black shadow-sm hover:bg-gray-200 hover:text-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-offset-2 mb-4 lg:mb-0">
Dive Deeper
</a>
<a href="/action" class="text-sm/6 font-semibold text-gray-900">Learn more <span aria-hidden="true">→</span></a>
</div>
</div>
</div>

1
templates/partials/form.html Normal file
View File

@@ -0,0 +1 @@
<div data-tf-live="01JEXHAZ930FVKSDJ440Y8X375"></div><script src="//embed.typeform.com/next/embed.js"></script>

2
templates/partials/header.html
View File

@@ -107,7 +107,7 @@
</a>
</li>
</ul> #}
<a href="https://docs.threefold.io/" target="_blank" class="dashboard rounded-2xl bg-white px-4 p-2 text-sm font-semibold text-black shadow-sm hover:text-gray-800 hover:bg-green">TF Docs</a>
<a href="/signup" target="_blank" class="blinking-effect dashboard rounded-2xl bg-white px-4 p-2 text-sm font-semibold text-black shadow-sm hover:text-gray-800 hover:bg-green">Join the Web4 Revolution</a>
</div>
</div>
</div>

10
templates/partials/home/cta.html
View File

@@ -1,13 +1,13 @@
<div class="bg-transparent pt-12 pb-12">
<div class="mx-auto rounded-2xl bg-white/5 max-w-7xl px-6 py-12 lg:flex lg:items-center lg:justify-between lg:px-20">
<h2 class="lg:text-balance text-left items-start font-normal tracking-tight text-white lg:text-5xl text-3xl fade-in">
Build the <br>Internet of Tomorrow, <br>Today.
<h2 class="lg:text-balance max-w-xl leading-tight text-left items-start font-normal tracking-tight text-white lg:text-5xl text-3xl fade-in">
Build the <br>Internet of Tomorrow,<br> Today.
</h2>
<div class="mt-10 flex items-center 0 gap-x-6 lg:mt-0 lg:shrink-0 flex-wrap justify-center lg:justify-start">
<a href="https://docs.threefold.io/" target="_blank" class="fade-in rounded-2xl bg-white px-4 py-2.5 text-sm font-semibold text-black shadow-sm hover:bg-green hover:text-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-offset-2 mb-4 lg:mb-0">
Dive Deeper
<a href="/signup" target="_blank" class="blinking-effect fade-in rounded-2xl bg-white px-4 py-2.5 text-sm font-semibold text-black shadow-sm hover:bg-gray-200 hover:text-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-offset-2 mb-4 lg:mb-0">
Pre-register Now
</a>
<a href="/action" class="fade-in text-sm/6 font-semibold text-white">Learn more <span aria-hidden="true">→</span></a>
</div>
</div>
</div>

2
templates/partials/home/farmers.html
View File

@@ -5,7 +5,7 @@
<p class="text-left my-6 max-w-3xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">
Regardless of technical expertise, anyone can now provide data, network, and cloud resources to where they’re needed most while earning rewards for their contributions. We call this process "farming”.
</p>
</div>
</div>
<section class="pb-32 bg-transparent">
<div class="max-w-6xl mx-4 md:mx-10 lg:mx-20 xl:mx-auto">
<div class="mx-auto max-w-2xl sm:mt-20 lg:mt-24 lg:max-w-none">

27
templates/partials/home/products.html Normal file
View File

@@ -0,0 +1,27 @@
<div class="overflow-hidden bg-transparent py-24 lg:py-16">
<div class="mx-auto max-w-7xl md:px-6 lg:px-8">
<div class="grid grid-cols-1 gap-x-16 gap-y-16 sm:gap-y-20 lg:grid-cols-2 lg:items-start">
<div class="sm:px-6 lg:px-0">
<div class="relative isolate overflow-hidden bg-transparent px-6 pt-8 sm:mx-auto sm:max-w-2xl sm:rounded-3xl sm:pl-16 sm:pr-0 sm:pt-16 lg:mx-0 lg:max-w-none">
<div class="mx-auto max-w-2xl sm:mx-0 sm:max-w-none">
<img src="images/web4.png" alt="Web4 Preview" class="w-full max-w-none fade-in blinking-effect">
</div>
</div>
</div>
<div class="px-6 lg:px-0 lg:pl-4 lg:pt-4">
<div class="mx-auto max-w-2xl lg:mx-0 lg:max-w-lg">
<p class="fade-in text-balance lg:text-5xl text-4xl leading-tight font-normal tracking-tight text-white">Unlock Web4 with ThreeFold</p>
<p class="mt-6 mx-automax-w-3xl text-pretty lg:text-2xl text-xl font-normal text-gray-200 fade-in">Revolutionary Tools for the Decentralized Internet.</p>
<div class="mt-6 max-w-xl space-y-8 text-base/7 text-gray-300 lg:max-w-none">
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">From secure phones and AI-driven virtual assistants to encrypted Web4 routers and decentralized nodes, our products redefine digital autonomy and connectivity.</p>
</div>
<div class="mt-10 flex items-center gap-x-6">
<a href="/signup" target="_blank" class="fade-in rounded-2xl bg-white px-4 py-2.5 text-sm font-semibold text-black shadow-sm hover:text-gray-800 hover:bg-green focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 blinking-effect">Pre-register Now</a>
<a href="/action" class="fade-in text-sm/6 font-semibold text-white">Learn more <span aria-hidden="true">→</span></a>
</div>
</div>
</div>
</div>
</div>
</div>

10
templates/partials/home/web4.html
View File

@@ -7,9 +7,8 @@
<h2 class="fade-in text-balance text-4xl font-normal tracking-tight text-white lg:text-5xl">The Next Evolution of the Internet</h2>
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">Web4 is the natural progression of the Internet, where humans and artificial intelligence work together to create a new paradigm designed to promote planetary well-being and ensure equal opportunities for all. Users are in 100% control of their data and no centralized services are needed.</p>
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">Blockchain was the first step to Web3.</p>
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-lg font-semibold text-gray-200 fade-in">ThreeFold is the next step to Web4.</p>
<br>
<br>
<p class="mx-auto mt-2 max-w-3xl text-pretty lg:text-xl text-lg font-medium text-gray-200 fade-in">ThreeFold is the next step to Web4.</p>
<!--
<div class=" border border-white px-6 py-2 rounded-xl inline-flex items-center gap-2 fade-in blinking-effect">
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="30" height="30" viewBox="0,0,256,256" style="cursor: pointer;">
<g fill="#ffffff" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal">
@@ -20,6 +19,11 @@
</svg>
<a href="/action" class="fade-in text-balance text-2xl font-semibold tracking-tight text-white lg:text-3xl blinking-effect">12.12.2024</a>
</div>
-->
<div class="mt-16 fade-in flex items-center justify-center gap-x-6">
<a href="/signup" target="_blank" class="fade-in rounded-2xl bg-white px-4 py-2.5 text-sm font-semibold text-black shadow-sm hover:text-gray-800 hover:bg-green focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 blinking-effect">Pre-register Now</a>
<a href="/action" class="text-sm/6 font-semibold text-white">Learn more <span aria-hidden="true">→</span></a>
</div>
</div>
</div>

4
templates/partials/what/what.html
View File

@@ -4,8 +4,8 @@
<h2 class="fade-in text-balance lg:text-5xl text-4xl leading-snug font-normal tracking-tight text-white sm:text-5xl">What You Can Do With It
</h2>
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">Today, ThreeFold is primarily focused on empowering developers to create innovative cloud solutions.</p>
<p class="mx-auto mt-4 mb-6 max-w-3xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">On 12-12-24, we will unveil exciting news about how Web4 will soon become accessible to everyone, opening up endless possibilities for all users.</p>
<a href="/action" class="mt-4 border border-white px-6 py-2 fade-in lg:text-3xl text-2xl rounded-2xl tracking-normal font-medium text-white hover:text-gray-400 blinking-effect"><span aria-hidden="true">→ </span>12.12.24</a>
<p class="mx-auto mt-4 mb-10 max-w-3xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">We are now unveiling an exciting news about how Web4 will soon become accessible to everyone, opening up endless possibilities for all users.</p>
<a href="/action" class="mt-4 border border-white px-6 py-2 fade-in lg:text-2xl text-xl rounded-2xl tracking-normal font-medium text-white hover:text-gray-400 blinking-effect"><span aria-hidden="true">→ </span>Take Actions</a>
</div>
<div class="lg:px-16 fade-in"> <!-- Added padding to the right side for more spacing -->
<dl class="fade-in grid grid-cols-1 mx-auto gap-x-8 sm:grid-cols-2 lg:gap-y-10 gap-y-6">

4
templates/partials/why/matters.html
View File

@@ -22,7 +22,7 @@
<p class="lg:text-2xl text-xl leading-normal text-white font-semibold">Over the past decade, we’ve tackled complex challenges in areas such as data storage, secure overlay networking, and autonomous cloud security to bring this vision to life.</p>
</blockquote>
<br>
<div class=" border border-white px-6 py-2 rounded-xl inline-flex items-center gap-2 fade-in blinking-effect">
<div class="mt-6 border border-white px-6 py-2 rounded-xl inline-flex items-center gap-2 fade-in blinking-effect">
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="30" height="30" viewBox="0,0,256,256" style="cursor: pointer;">
<g fill="#ffffff" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal">
<g transform="translate(210.55757,-34.78313) rotate(65) scale(5.12,5.12)">
@@ -30,7 +30,7 @@
</g>
</g>
</svg>
<a href="/action" class="fade-in text-balance text-2xl font-semibold tracking-tight text-white lg:text-3xl blinking-effect">12.12.2024</a>
<a href="/action" class="fade-in text-balance text-xl font-semibold tracking-tight text-white lg:text-2xl blinking-effect">Take Actions</a>
</div>
</figure>
</div>

2
templates/partials/why/team.html
View File

@@ -1,4 +1,4 @@
<div class="bg-transparent relative isolate overflow-hidden py-12">
<div class="bg-transparent relative isolate overflow-hidden pt-12 pb-24">
<div class="mx-auto max-w-7xl px-6 lg:px-8">
<div class="mx-auto max-w-2xl lg:max-w-none">
<div class="text-center">