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

This commit is contained in:
2024-11-21 13:19:31 +01:00
24 changed files with 57 additions and 49 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.7 MiB

BIN
static/images/adnan.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 103 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 MiB

BIN
static/images/flo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.0 MiB

BIN
static/images/freezone.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 148 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 412 KiB

BIN
static/images/jan.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 95 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.5 MiB

BIN
static/images/kds.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 96 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 MiB

BIN
static/images/tanzania.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 163 KiB

View File

@@ -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;

View File

@@ -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>

View File

@@ -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>

View File

@@ -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">

View File

@@ -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 theyre 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>

View File

@@ -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. Weve developed foundational technology that runs directly on bare metal (the hardware).</p>

View File

@@ -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">

View File

@@ -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>

View File

@@ -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 worlds 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>

View File

@@ -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>

View File

@@ -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