Merge branch 'development_sasha' of https://github.com/threefoldfoundation/www_threefold_io into development_sasha
|
Before Width: | Height: | Size: 1.7 MiB |
BIN
static/images/adnan.png
Normal file
|
After Width: | Height: | Size: 103 KiB |
|
Before Width: | Height: | Size: 1.3 MiB |
BIN
static/images/flo.png
Normal file
|
After Width: | Height: | Size: 81 KiB |
|
Before Width: | Height: | Size: 1.0 MiB |
BIN
static/images/freezone.png
Normal file
|
After Width: | Height: | Size: 148 KiB |
|
Before Width: | Height: | Size: 1.6 MiB |
|
Before Width: | Height: | Size: 412 KiB |
BIN
static/images/jan.png
Normal file
|
After Width: | Height: | Size: 95 KiB |
|
Before Width: | Height: | Size: 1.5 MiB |
BIN
static/images/kds.png
Normal file
|
After Width: | Height: | Size: 96 KiB |
|
Before Width: | Height: | Size: 1.1 MiB |
BIN
static/images/tanzania.png
Normal file
|
After Width: | Height: | Size: 163 KiB |
@@ -16,8 +16,8 @@
|
||||
|
||||
<!-- Right Blockquote -->
|
||||
<div class="lg:col-span-5">
|
||||
<figure class=" mt-6 pl-8">
|
||||
<blockquote class=" text-2xl text-white fade-in font-semibold">
|
||||
<figure class=" mt-6 pl-8">
|
||||
<blockquote class=" text-2xl text-white fade-in font-semibold ">
|
||||
<p class="text-2xl text-white font-semibold">We believe actions are more important than words. <br><br>
|
||||
This page is in black & white, to let YOU be the color of the future of the internet.
|
||||
</p>
|
||||
@@ -70,6 +70,14 @@
|
||||
}
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left-width: 2px;
|
||||
margin: .5rem;
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(156 163 175 / var(--tw-border-opacity, 1));
|
||||
padding: .5rem;
|
||||
padding-left: 1rem;
|
||||
|
||||
.blockquote::before {
|
||||
content: open-quote;
|
||||
font-size: 4rem;
|
||||
|
||||
@@ -1,26 +1,26 @@
|
||||
<div class="bg-transparent fade-in pb-24 flex items-center justify-center min-h-screen">
|
||||
<div class="bg-transparent fade-in pb-24 flex items-center justify-center">
|
||||
<div class="mx-auto max-w-7xl px-6 lg:px-8">
|
||||
<div class="mx-auto max-w-2xl lg:max-w-7xl items-center text-center">
|
||||
<p class="fade-in mx-auto mb-12 text-pretty lg:text-4xl text-3xl font-medium text-gray-200">All Things Web 4</p>
|
||||
</div>
|
||||
<div class="-mx-6 grid grid-cols-2 gap-2 overflow-hidden sm:mx-0 sm:rounded-2xl md:grid-cols-3">
|
||||
<div class="grid-item bg-white/5 p-6 sm:p-10">
|
||||
<h2 class="text-white lg:text-3xl text-2xl text-center font-semibold">Web 4 Infrastructure</h2>
|
||||
<div class="grid-item bg-white/5 p-2 lg:p-12">
|
||||
<h2 class="text-white lg:text-3xl text-xl text-center font-semibold">Web 4 <br>Infrastructure</h2>
|
||||
</div>
|
||||
<div class="grid-item bg-white/5 p-6 sm:p-10">
|
||||
<h2 class="text-white lg:text-3xl text-2xl text-center font-semibold">Web 4 Phone & Routers</h2>
|
||||
<div class="grid-item bg-white/5 p-2 lg:p-12">
|
||||
<h2 class="text-white lg:text-3xl text-xl text-center font-semibold">Web 4 <br>Phone & Routers</h2>
|
||||
</div>
|
||||
<div class="grid-item bg-white/5 p-6 sm:p-10">
|
||||
<h2 class="text-white lg:text-3xl text-2xl text-center font-semibold">Human + Machine Agents</h2>
|
||||
<div class="grid-item bg-white/5 p-2 lg:p-12">
|
||||
<h2 class="text-white lg:text-3xl text-xl text-center font-semibold">Human + Machine <br>Agents</h2>
|
||||
</div>
|
||||
<div class="grid-item bg-white/5 p-6 sm:p-10">
|
||||
<h2 class="text-white lg:text-3xl text-2xl text-center font-semibold">Sovereign Digital Economic Zone</h2>
|
||||
<div class="grid-item bg-white/5 p-2 lg:p-12">
|
||||
<h2 class="text-white lg:text-3xl text-xl text-center font-semibold">Sovereign Digital <br>Economic Zone</h2>
|
||||
</div>
|
||||
<div class="grid-item bg-white/5 p-6 sm:p-10">
|
||||
<h2 class="text-white lg:text-3xl text-2xl text-center font-semibold">Web 4 Dev Tools</h2>
|
||||
<div class="grid-item bg-white/5 p-2 lg:p-12">
|
||||
<h2 class="text-white lg:text-3xl text-xl text-center font-semibold">Web 4 <br>Dev Tools</h2>
|
||||
</div>
|
||||
<div class="grid-item bg-white/5 p-6 sm:p-10">
|
||||
<h2 class="text-white lg:text-3xl text-2xl text-center font-semibold">Web 4 Digital Currency</h2>
|
||||
<div class="grid-item bg-white/5 p-2 lg:p-12">
|
||||
<h2 class="text-white lg:text-3xl text-xl text-center font-semibold">Web 4 <br>Digital Currency</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
<div class="pt-16 bg-transparent h-screen flex flex-col justify-start items-center">
|
||||
<div>
|
||||
<div class="h-screen flex flex-col justify-center items-center ">
|
||||
<div class="">
|
||||
<img
|
||||
class="object-contain w-[100%] max-w-[100%]"
|
||||
class="mx-auto"
|
||||
src="/images/mycel2.gif"
|
||||
alt="TF">
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-4xl fade-in">Save the Date</h2>
|
||||
<p class="fade-in mx-auto mt-4 max-w-3xl text-pretty lg:text-4xl text-3xl font-medium text-gray-200 fade-in">12.12.24</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -2,9 +2,9 @@
|
||||
{% set header_items = section.content | safe | split(pat="<li>") %}
|
||||
|
||||
<header id="header-container">
|
||||
<div class="z-20 bg-black2 absolute w-full">
|
||||
<div class="z-20 absolute w-full">
|
||||
<div class="relative z-50">
|
||||
<div class="mx-auto container flex z-50 justify-between items-center px-6 sm:px-4 md:px-6 py-2 lg:px-5 lg:justify-start space-x-10 sm:space-x-4 ">
|
||||
<div class="mx-auto container flex z-50 justify-between items-center px-6 sm:px-4 md:px-6 py-4 lg:px-5 lg:justify-start space-x-10 sm:space-x-4 ">
|
||||
<div>
|
||||
<a href="{{get_url(path='/')}}" class="flex">
|
||||
<img class="w-36 h-auto" style="max-width: none;" src="{{ get_url(path=section.extra.logoPath)}}" alt="ThreeFold Logo" />
|
||||
@@ -113,12 +113,12 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% for header_item in header_items %}
|
||||
{% if not loop.first %}
|
||||
{% set header_arr = header_item | split(pat="</li>") %}
|
||||
{% set header_label = header_arr[0] %}
|
||||
{% set header_menu = header_arr[1] %}
|
||||
{% set menu_id = header_label ~ "-menu" | slugify %}
|
||||
{% for header_item in header_items %}
|
||||
{% if not loop.first %}
|
||||
{% set header_arr = header_item | split(pat="</li>") %}
|
||||
{% set header_label = header_arr[0] %}
|
||||
{% set header_menu = header_arr[1] %}
|
||||
{% set menu_id = header_label ~ "-menu" | slugify %}
|
||||
|
||||
<nav>
|
||||
<div id="{{menu_id}}" class="nav_menu mt-0 sm:mt-0 md:mt-0 lg:mt-0 xl:mt-0 2xl:mt-0 z-50 absolute inset-x-0 transform shadow-lg lg:backdrop-blur xl:backdrop-blur transition duration-200 ease-in opacity-0 -translate-y-1 hidden">
|
||||
|
||||
@@ -2,15 +2,15 @@
|
||||
<div class="mx-auto max-w-7xl px-6 lg:max-w-7xl lg:px-8">
|
||||
<div class="mx-auto max-w-2xl px-6 lg:max-w-7xl lg:px-8">
|
||||
<h2 class="mx-auto fade-in text-left lg:text-5xl text-2xl leading-snug font-normal tracking-tight text-white">Powering the Grid Together</h2>
|
||||
<p class="text-left mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">
|
||||
<p class="text-left my-6 max-w-3xl text-pretty lg:text-xl text-base 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>
|
||||
<section class="pb-32 bg-transparent">
|
||||
<div class="max-w-6xl mx-8 md:mx-10 lg:mx-20 xl:mx-auto">
|
||||
<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">
|
||||
<dl class="grid max-w-xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-3">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded rounded-2xl bg-white/5">
|
||||
<dl class="grid max-w-xl grid-cols-1 gap-x-8 gap-y-8 lg:max-w-none lg:grid-cols-3">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-white/5">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
1. HOST A NODE
|
||||
</dt>
|
||||
@@ -20,7 +20,7 @@
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
<div class="fade-in-box flex flex-col p-8 rounded rounded-2xl bg-white/5">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-white/5">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
2. OFFER CAPACITY
|
||||
</dt>
|
||||
@@ -31,7 +31,7 @@
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
<div class="fade-in-box flex flex-col p-8 rounded rounded-2xl bg-white/5">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-white/5">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
3. EARN REWARDS
|
||||
</dt>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<div class="bg-transparent">
|
||||
<div class="mx-auto grid max-w-2xl grid-cols-1 items-center gap-x-16 gap-y-16 px-8 pt-12 mt-12 pb-24 lg:max-w-7xl lg:grid-cols-2 lg:px-8">
|
||||
<div class="max-w-3xl px-16 pb-12">
|
||||
<div class="max-w-3xl lg:px-16 px-0 pb-12">
|
||||
<h2 class="fade-in text-balance lg:text-4xl text-2xl leading-snug font-normal tracking-tight text-white sm:text-5xl">ThreeFold is the Infrastructure Layer of Web 4
|
||||
</h2>
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">ThreeFold is not a protocol. We’ve developed foundational technology that runs directly on bare metal (the hardware).</p>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<div class="bg-transparent relative isolate overflow-hidden py-12 mb-12">
|
||||
<img src="images/map_white.png" alt="" class="fade-in absolute inset-0 -z-10 size-full object-cover">
|
||||
<img src="images/map_white.png" alt="" class="fade-in absolute inset-0 -z-10 size-full object-cover md:block hidden">
|
||||
<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">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<div class="bg-transparent">
|
||||
<div class="mx-auto grid max-w-2xl grid-cols-1 items-center gap-x-16 gap-y-16 px-8 pt-12 mt-12 pb-24 lg:max-w-7xl lg:grid-cols-2 lg:px-8">
|
||||
<div class="max-w-3xl px-16 pb-12">
|
||||
<div class="max-w-3xl px-0 lg:px-16 pb-12">
|
||||
<h2 class="fade-in text-balance lg:text-4xl text-2xl 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-base font-light text-gray-200 fade-in">Today, ThreeFold is primarily focused on empowering developers to create innovative cloud solutions.</p>
|
||||
|
||||
@@ -8,9 +8,9 @@
|
||||
|
||||
<div class="mt-12 space-y-16">
|
||||
<div class="bg-transparent py-10">
|
||||
<div class="mx-auto max-w-7xl px-6 lg:grid lg:items-center lg:grid-cols-12 lg:gap-x-8">
|
||||
<div class="mx-auto max-w-7xl lg:grid lg:items-center lg:grid-cols-12 lg:gap-x-8">
|
||||
<!-- Text Section -->
|
||||
<div class="lg:col-span-5 align-middle pr-4">
|
||||
<div class="lg:col-span-5 align-middle pr-4 mb-4">
|
||||
<h3 class="text-2xl font-medium text-white">OurWorld FreeZone</h3>
|
||||
<p class="mt-2 text-base font-light text-gray-200 mx-auto pr-4">
|
||||
ThreeFold is working with the Zanzibar Communication Corporation (ZICTIA), on behalf of the Zanzibar government, to create the world’s first 100% Digital Free Zone – accessible and affordable for all. <br><br>The announcement was made August 2023, and progress has been ongoing behind the scenes since then.
|
||||
@@ -20,7 +20,7 @@
|
||||
<!-- Image Section -->
|
||||
<div class="lg:col-span-7">
|
||||
<img
|
||||
src="/images/freezone.gif"
|
||||
src="/images/freezone.png"
|
||||
alt=""
|
||||
class=" w-full rounded-lg bg-gray-100 object-fit">
|
||||
</div>
|
||||
@@ -35,7 +35,7 @@
|
||||
In January 2024, ThreeFold announced in collaboration with The ICT Commission of Tanzania and Holochain a collaboration to deploy sovereign Internet in Tanzania, along with the introduction of coding academies and innovation hubs. <br><br> The Dunia Yetu cooperative is being set up and efforts will ramp up in 2025.</p>
|
||||
</div>
|
||||
<div class="flex-auto lg:col-span-7 lg:col-start-1 lg:row-start-1">
|
||||
<img src="/images/tanzania.gif" alt="" class="w-full rounded-lg bg-gray-100 object-fill">
|
||||
<img src="/images/tanzania.png" alt="" class="w-full rounded-lg bg-gray-100 object-fill">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<!-- Left Content -->
|
||||
<div class="lg:col-span-7">
|
||||
<div class="mx-auto max-w-2xl lg:mx-0">
|
||||
<h1 class="fade-in text-balance text-4xl font-normal tracking-tight text-white sm:text-5xl">The Reason Behind It All</h1>
|
||||
<h1 class="fade-in text-balance text-3xl font-normal tracking-tight text-white lg:text-5xl">The Reason Behind It All</h1>
|
||||
<p class="fade-in mt-6 text-lg font-light text-white">
|
||||
The Internet started as a peer-to-peer network, but over time it has become fragile and overly centralized. This shift has led to serious issues: misinformation is rampant, privacy and security are compromised, and half the world remains poorly connected.
|
||||
<br><br>
|
||||
|
||||
@@ -10,9 +10,9 @@
|
||||
<div class="mt-12 grid grid-cols-1 gap-x-4 lg:gap-y-10 lg:gap-x-8 lg:grid-cols-4 gap-y-0">
|
||||
|
||||
<!-- Team Member -->
|
||||
<div class="group relative fade-in">
|
||||
<div class="group relative fade-in mb-8">
|
||||
<div class="h-56 w-full overflow-hidden rounded-md bg-gray-200 group-hover:opacity-75 lg:h-72 xl:h-80">
|
||||
<img src="/images/kds.gif" alt="kristof_de_spiegeleer" class="size-full object-cover">
|
||||
<img src="/images/kds.png" alt="kristof_de_spiegeleer" class="size-full object-cover">
|
||||
</div>
|
||||
<h3 class="mt-4 text-xl font-semibold text-white">
|
||||
Kristof de Spiegeleer
|
||||
@@ -23,9 +23,9 @@
|
||||
</div>
|
||||
|
||||
<!-- Team Member -->
|
||||
<div class="group relative fade-in">
|
||||
<div class="group relative fade-in mb-8">
|
||||
<div class="h-56 w-full overflow-hidden rounded-md bg-gray-200 group-hover:opacity-75 lg:h-72 xl:h-80">
|
||||
<img src="/images/adnan.gif" alt="adnan_fatayerji" class="size-full object-cover">
|
||||
<img src="/images/adnan.png" alt="adnan_fatayerji" class="size-full object-cover">
|
||||
</div>
|
||||
<h3 class="mt-4 text-xl font-semibold text-white">
|
||||
Adnan Fatayerji
|
||||
@@ -36,9 +36,9 @@
|
||||
</div>
|
||||
|
||||
<!-- Team Member -->
|
||||
<div class="group relative fade-in">
|
||||
<div class="group relative fade-in mb-8">
|
||||
<div class="h-56 w-full overflow-hidden rounded-md bg-gray-200 group-hover:opacity-75 lg:h-72 xl:h-80">
|
||||
<img src="/images/jan.gif" alt="jan_de_landtsheer" class="size-full object-cover">
|
||||
<img src="/images/jan.png" alt="jan_de_landtsheer" class="size-full object-cover">
|
||||
</div>
|
||||
<h3 class="mt-4 text-xl font-semibold text-white">
|
||||
Jan De Landtsheer
|
||||
@@ -49,9 +49,9 @@
|
||||
</div>
|
||||
|
||||
<!-- Team Member -->
|
||||
<div class="group relative fade-in">
|
||||
<div class="group relative fade-in mb-8">
|
||||
<div class="h-56 w-full overflow-hidden rounded-md bg-gray-200 group-hover:opacity-75 lg:h-72 xl:h-80">
|
||||
<img src="/images/flo.gif" alt="florian_fournier" class="size-full object-cover">
|
||||
<img src="/images/flo.png" alt="florian_fournier" class="size-full object-cover">
|
||||
</div>
|
||||
<h3 class="mt-4 text-xl font-semibold text-white">
|
||||
Florian Fournier
|
||||
|
||||