Merge branch 'development_sasha' of https://github.com/threefoldfoundation/www_threefold_io into development_sasha
This commit is contained in:
Amanda
@@ -5,7 +5,7 @@ insert_anchor_links: "left"
|
||||
template: "partials/footer.html"
|
||||
extra:
|
||||
logoPath: "images/new_logo_tft.png"
|
||||
socialLinks: { Github: "https://github.com/threefoldfoundation", Github2: "https://github.com/threefoldtech", Twitter: "https://twitter.com/threefold_io", Telegram: "https://t.me/threefoldnews" }
|
||||
socialLinks: { Twitter: "https://twitter.com/threefold_io", Telegram: "https://t.me/threefoldnews", Github: "https://github.com/threefoldfoundation", Github2: "https://github.com/threefoldtech"}
|
||||
---
|
||||
|
||||
{% row(style="lean") %}
|
||||
@@ -16,7 +16,7 @@ extra:
|
||||
|
||||
###### [Learn](https://manual.grid.tf/)
|
||||
|
||||
###### [Host (Farm)](/host)
|
||||
###### [Host (Farm)](https://docs.threefold.io/docs/nodes/guides/create_farm)
|
||||
|
||||
###### [Dashboard](https://dashboard.grid.tf/)
|
||||
|
||||
@@ -26,7 +26,7 @@ extra:
|
||||
|
||||
|||
|
||||
|
||||
##### <span class="text-gray-100">TALK TO HUMANS</span>
|
||||
##### <span class="text-gray-100">COMMUNITY</span>
|
||||
|
||||
<br>
|
||||
|
||||
@@ -46,7 +46,7 @@ extra:
|
||||
|
||||
<br>
|
||||
|
||||
<h6><a target="_self" onclick="window.location.href='/about'">About</a></h6>
|
||||
<h6><a target="_self" onclick="window.location.href='/about'">Why</a></h6>
|
||||
|
||||
<h6><a target="_self" onclick="window.location.href='/blog'">Blog</a></h6>
|
||||
|
||||
|
||||
@@ -9,7 +9,7 @@ extra:
|
||||
|
||||
- [Why]("/about")
|
||||
- [What]("/solutions")
|
||||
- [12.12.24]("")
|
||||
- [12.12.24]("/action")
|
||||
- Info
|
||||
|
||||
|
||||
@@ -45,9 +45,9 @@ extra:
|
||||
|
||||
|||
|
||||
|
||||
<button class="dropdown" onclick="openInNewTab('https://manual.grid.tf/')">
|
||||
<button class="dropdown" onclick="openInNewTab('https://https://docs.threefold.io/')">
|
||||
|
||||
[Documentation](https://manual.grid.tf)
|
||||
[Documentation](https://docs.threefold.io/)
|
||||
<br>
|
||||
<p class="text-sm">Explore the Documentation</p>
|
||||
|
||||
|
||||
BIN
static/images/adnan.gif
Normal file
BIN
static/images/adnan.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 MiB |
BIN
static/images/adnan.jpg
Normal file
BIN
static/images/adnan.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 462 KiB |
BIN
static/images/flo.gif
Normal file
BIN
static/images/flo.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 MiB |
BIN
static/images/flo.jpg
Normal file
BIN
static/images/flo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 319 KiB |
BIN
static/images/freezone.gif
Normal file
BIN
static/images/freezone.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.0 MiB |
BIN
static/images/freezone_anouncement.png
Normal file
BIN
static/images/freezone_anouncement.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.0 MiB |
BIN
static/images/jan.gif
Normal file
BIN
static/images/jan.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 MiB |
BIN
static/images/jan.jpg
Normal file
BIN
static/images/jan.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 412 KiB |
BIN
static/images/kds.gif
Normal file
BIN
static/images/kds.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 MiB |
BIN
static/images/kds.jpg
Normal file
BIN
static/images/kds.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 412 KiB |
BIN
static/images/mycel2.gif
Normal file
BIN
static/images/mycel2.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 70 KiB |
BIN
static/images/mycelium.gif
Normal file
BIN
static/images/mycelium.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 134 KiB |
BIN
static/images/sovereigndy.png
Normal file
BIN
static/images/sovereigndy.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 MiB |
BIN
static/images/tanzania.gif
Normal file
BIN
static/images/tanzania.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
@@ -4,6 +4,7 @@
|
||||
{% 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" %}
|
||||
{% include "partials/home/web4.html" %}
|
||||
{% include "partials/home/faq.html" %}
|
||||
|
||||
@@ -2,6 +2,8 @@
|
||||
{% block content %}
|
||||
|
||||
{% include "partials/action/banner.html" %}
|
||||
{% include "partials/action/hero.html" %}
|
||||
{% include "partials/action/announcements.html" %}
|
||||
{% include "partials/action/action.html" %}
|
||||
{% include "partials/action/cta.html" %}
|
||||
|
||||
{% endblock content %}
|
||||
@@ -2,7 +2,7 @@
|
||||
{% block content %}
|
||||
|
||||
{% include "partials/solutions/hero.html" %}
|
||||
{% include "partials/solutions/whatyoucando.html" %}
|
||||
{% include "partials/solutions/what.html" %}
|
||||
{% include "partials/solutions/portfolio.html" %}
|
||||
{% include "partials/home/cta.html" %}
|
||||
{% endblock content %}
|
||||
@@ -4,9 +4,10 @@
|
||||
{% include "partials/why/hero.html" %}
|
||||
{% include "partials/why/reason.html" %}
|
||||
{% include "partials/why/timeline.html" %}
|
||||
{% include "partials/why/matters.html" %}
|
||||
{% include "partials/why/values.html" %}
|
||||
{% include "partials/why/team.html" %}
|
||||
{% include "partials/why/matters.html" %}
|
||||
{% include "partials/why/impact.html" %}
|
||||
{% include "partials/home/cta.html" %}
|
||||
|
||||
{% endblock content %}
|
||||
95
templates/partials/action/action.html
Normal file
95
templates/partials/action/action.html
Normal file
@@ -0,0 +1,95 @@
|
||||
<div class="relative isolate overflow-hidden bg-transparent text-white pt-12 pb-32">
|
||||
<div class="mx-auto max-w-7xl px-6 lg:px-8">
|
||||
<div class="relative grid lg:grid-cols-12 lg:gap-8">
|
||||
<!-- 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">When 3 Becomes 4</h1>
|
||||
<p class="fade-in mt-6 text-lg font-light text-white">
|
||||
The Internet is a Trillion USD business and we want to make sure this Internet is built and owned by all of us—An Internet created by Everyone for Everyone. <br><br>
|
||||
Web4 is the logical evolution of the Internet and opens the door for Machines & Humans to create together a new form of Intelligence with respect for the Planet & People.<br><br>
|
||||
ThreeFold has been working on this vision for more than 10 years <br><br>
|
||||
and is now ready to announce our next steps on December 12, 2024.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Blockquote -->
|
||||
<div class="lg:col-span-5">
|
||||
<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>
|
||||
</blockquote>
|
||||
<br>
|
||||
<div class="inline-flex blinking-effect items-center gap-2 fade-in ">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="50" height="50" 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)">
|
||||
<path d="M14.78125,5c-0.03125,0.00781 -0.0625,0.01953 -0.09375,0.03125c-0.04297,0.01953 -0.08594,0.03906 -0.125,0.0625c-0.01172,0 -0.01953,0 -0.03125,0c-0.01953,0.00781 -0.04297,0.01953 -0.0625,0.03125c-0.01172,0.01172 -0.01953,0.01953 -0.03125,0.03125c-0.01172,0.01172 -0.01953,0.01953 -0.03125,0.03125c-0.03125,0.01953 -0.0625,0.03906 -0.09375,0.0625c-0.02344,0.01953 -0.04297,0.03906 -0.0625,0.0625c-0.01172,0.01953 -0.02344,0.04297 -0.03125,0.0625c-0.03516,0.03906 -0.06641,0.08203 -0.09375,0.125c-0.01172,0.01172 -0.01953,0.01953 -0.03125,0.03125c0,0.01172 0,0.01953 0,0.03125c-0.01172,0.01953 -0.02344,0.04297 -0.03125,0.0625c-0.01172,0.01172 -0.01953,0.01953 -0.03125,0.03125c0,0.01953 0,0.04297 0,0.0625c-0.01172,0.03906 -0.02344,0.08203 -0.03125,0.125c0,0.03125 0,0.0625 0,0.09375c0,0.01172 0,0.01953 0,0.03125c0,0.01172 0,0.01953 0,0.03125c-0.00391,0.05078 -0.00391,0.10547 0,0.15625v32.84375c0.00391,0.39844 0.24219,0.75781 0.60938,0.91406c0.36328,0.15625 0.78906,0.07813 1.07813,-0.19531l7.25,-6.8125l5.84375,13.5c0.10938,0.24609 0.3125,0.44141 0.56641,0.53516c0.25391,0.09375 0.53516,0.08203 0.77734,-0.03516l4.375,-2c0.49609,-0.22656 0.71875,-0.8125 0.5,-1.3125l-6.09375,-13.3125l10.1875,-0.875c0.40234,-0.02734 0.75,-0.29297 0.88281,-0.67578c0.12891,-0.38281 0.01563,-0.80859 -0.28906,-1.07422l-23.84375,-22.21875c-0.04687,-0.05859 -0.09766,-0.10937 -0.15625,-0.15625c-0.03906,-0.04687 -0.07812,-0.08594 -0.125,-0.125c-0.01172,0 -0.01953,0 -0.03125,0c-0.01953,-0.02344 -0.03906,-0.04297 -0.0625,-0.0625c-0.01172,0 -0.01953,0 -0.03125,0c-0.05078,-0.02344 -0.10156,-0.04687 -0.15625,-0.0625c-0.01172,0 -0.01953,0 -0.03125,0c-0.01953,-0.01172 -0.04297,-0.02344 -0.0625,-0.03125c-0.01172,0 -0.01953,0 -0.03125,0c-0.01953,0 -0.04297,0 -0.0625,0c-0.01172,0 -0.01953,0 -0.03125,0c-0.01953,0 -0.04297,0 -0.0625,0c-0.01172,0 -0.01953,0 -0.03125,0c-0.03125,0 -0.0625,0 -0.09375,0c-0.03125,0 -0.0625,0 -0.09375,0zM16,8.28125l20.6875,19.3125l-9.375,0.8125c-0.32031,0.03125 -0.60547,0.21484 -0.76562,0.49609c-0.16406,0.27734 -0.17969,0.61719 -0.04687,0.91016l6.28125,13.6875l-2.5625,1.15625l-6,-13.84375c-0.12891,-0.29687 -0.39062,-0.51562 -0.70703,-0.58203c-0.31641,-0.07031 -0.64844,0.01953 -0.88672,0.23828l-6.625,6.21875z"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
<a href="action.html" class="text-balance text-3xl font-semibold tracking-tight text-white sm:text-4xl">12.12.2024</a>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<style>
|
||||
/* Apply the blinking animation to the link */
|
||||
.blinking-effect {
|
||||
animation: blink 2s infinite; /* Adjust the speed here (1.5s for slow blinking) */
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes blink {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.4;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.blockquote::before {
|
||||
content: open-quote;
|
||||
font-size: 4rem;
|
||||
position: absolute;
|
||||
top: -1rem;
|
||||
left: -1rem;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.inline-flex {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.items-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.gap-2 {
|
||||
gap: 0.5rem; /* Adjust the gap size as needed */
|
||||
}
|
||||
|
||||
</style>
|
||||
59
templates/partials/action/announcements.html
Normal file
59
templates/partials/action/announcements.html
Normal file
@@ -0,0 +1,59 @@
|
||||
<div class="bg-transparent fade-in pb-24 flex items-center justify-center min-h-screen">
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// JavaScript to control the blinking effect
|
||||
const items = document.querySelectorAll('.grid-item');
|
||||
let currentIndex = 0;
|
||||
|
||||
function blinkItem() {
|
||||
// Remove the 'blink' class from all items
|
||||
items.forEach(item => item.classList.remove('blink'));
|
||||
|
||||
// Add the 'blink' class to the current item
|
||||
items[currentIndex].classList.add('blink');
|
||||
|
||||
// Move to the next item in a clockwise manner
|
||||
currentIndex = (currentIndex + 1) % items.length;
|
||||
}
|
||||
|
||||
// Start the blinking effect
|
||||
setInterval(blinkItem, 1000); // Change every second
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* CSS for the blinking effect */
|
||||
.blink {
|
||||
animation: blink-animation 1s infinite;
|
||||
}
|
||||
|
||||
@keyframes blink-animation {
|
||||
0%, 100% { background-color: rgba(255, 255, 255, 0.1); }
|
||||
50% { background-color: rgba(255, 255, 255, 0.5); }
|
||||
}
|
||||
</style>
|
||||
@@ -1,9 +1,12 @@
|
||||
<div class="bg-transparent pt-32 flex justify-center items-center">
|
||||
<div class="mx-auto max-w-7xl px-4 lg:px-6">
|
||||
<div class="pt-16 bg-transparent h-screen flex flex-col justify-start items-center">
|
||||
<div>
|
||||
<img
|
||||
class="object-contain w-full lg:w-[100%] max-w-[100%]"
|
||||
src="images/gif2.gif"
|
||||
class="object-contain w-[100%] max-w-[100%]"
|
||||
src="/images/mycel2.gif"
|
||||
alt="TF">
|
||||
</div>
|
||||
</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>
|
||||
|
||||
54
templates/partials/action/cta.html
Normal file
54
templates/partials/action/cta.html
Normal file
@@ -0,0 +1,54 @@
|
||||
<div class="bg-transparent">
|
||||
<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 leading-tight text-left items-start font-normal tracking-tight text-white lg:text-5xl text-3xl fade-in">
|
||||
Become the Color<br/>
|
||||
of the Future of Internet <br/>on 12.12.2024.
|
||||
</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://t.me/threefoldnews" 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">
|
||||
Telegram
|
||||
</a>
|
||||
<a href="javascript:;" onclick="ml_account('webforms', '3562741', 'n7q9l7', 'show')" class="fade-in rounded-2xl bg-black px-4 py-2.5 text-sm font-semibold text-white 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">
|
||||
Newsletter
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.bg-black {
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.fade-in {
|
||||
animation: fadeIn 4s ease-in-out forwards;
|
||||
}
|
||||
|
||||
h2 {
|
||||
animation-delay: 0.5s;
|
||||
}
|
||||
|
||||
p {
|
||||
animation-delay: 1s;
|
||||
}
|
||||
|
||||
.blockquote::before {
|
||||
content: open-quote;
|
||||
font-size: 4rem;
|
||||
position: absolute;
|
||||
top: -1rem;
|
||||
left: -1rem;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
14
templates/partials/cta.html
Normal file
14
templates/partials/cta.html
Normal file
@@ -0,0 +1,14 @@
|
||||
<div class="bg-transparent">
|
||||
<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>
|
||||
<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-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>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -107,7 +107,7 @@
|
||||
</a>
|
||||
</li>
|
||||
</ul> #}
|
||||
<a href="https://marketplace.3node.global/index.php?dispatch=companies.catalog" target="_blank" class=" rounded-2xl bg-white px-4 py-1 text-sm font-semibold text-black shadow-sm hover:bg-gray-300 hover:text-gray-800">Get 3Nodes</a>
|
||||
<a href="https://docs.threefold.io/docs/nodes/get_nodes" target="_blank" class=" rounded-2xl bg-white px-4 py-1 text-sm font-semibold text-black shadow-sm hover:bg-gray-300 hover:text-gray-800">Get 3Nodes</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -31,7 +31,7 @@
|
||||
:aria-expanded="expanded"
|
||||
aria-controls="faqs-text-01"
|
||||
>
|
||||
<span class="text-xl">Is this a separate new Internet?</span>
|
||||
<span>Is this a separate new Internet?</span>
|
||||
<svg class="fill-white shrink-0 ml-8" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect y="7" width="16" height="2" rx="1" class="transform origin-center transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
|
||||
<rect y="7" width="16" height="2" rx="1" class="transform origin-center rotate-90 transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
|
||||
@@ -46,7 +46,7 @@
|
||||
:class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
|
||||
>
|
||||
<div class="overflow-hidden">
|
||||
<p class="pb-3 text-gray-300 text-lg">
|
||||
<p class="pb-3 text-gray-300 text-base font-light">
|
||||
No, ThreeFold is a complementary Internet and works alongside the current Internet. It allows you to continue accessing and interacting with the current Internet while offering additional capabilities.
|
||||
</p>
|
||||
</div>
|
||||
@@ -78,7 +78,7 @@
|
||||
:class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
|
||||
>
|
||||
<div class="overflow-hidden">
|
||||
<p class="pb-3 text-gray-300 text-lg">
|
||||
<p class="pb-3 text-gray-300 text-base font-light">
|
||||
The Internet has become fragile and overly centralized. Issues like authenticity, privacy, security, and sustainability necessitate a fundamental new approach to rebuild its foundation.
|
||||
</p>
|
||||
</div>
|
||||
@@ -110,8 +110,8 @@
|
||||
:class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
|
||||
>
|
||||
<div class="overflow-hidden">
|
||||
<p class="pb-3 text-gray-300 text-lg">
|
||||
For over 30 years, we’ve worked toward this vision. ThreeFold is the culmination of our journey, offering a fully operational product and a growing community of users, farmers, and partners. This is real and here to stay.
|
||||
<p class="pb-3 text-gray-300 text-base font-light">
|
||||
For over 30 years, we’ve worked toward this vision. ThreeFold is the culmination of our journey, offering a fully operational product and a growing community of users, farmers, and partners. This is real and we are here to stay.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -142,7 +142,7 @@
|
||||
:class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
|
||||
>
|
||||
<div class="overflow-hidden">
|
||||
<p class="pb-3 text-gray-300 text-lg">
|
||||
<p class="pb-3 text-gray-300 text-base font-light">
|
||||
TFT is our token which was used to build generation 1, 2 and 3 of the ThreeFold Grid of capacity. TFT is the reward for our loyal community. There can never be more than 1 billion TFT. We are now building generation 4 of the ThreeFold Grid of capacity and we need a new token to build this new generation. There will never be more than 3 billion INCA. Our partners will start selling new ThreeFold Nodes end Nov 2024 with a new reward scheme and ready to grow to millions of nodes.
|
||||
</p>
|
||||
</div>
|
||||
@@ -174,7 +174,7 @@
|
||||
:class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
|
||||
>
|
||||
<div class="overflow-hidden">
|
||||
<p class="pb-3 text-gray-300 text-lg">
|
||||
<p class="pb-3 text-gray-300 text-base font-light">
|
||||
You can participate by becoming a farmer, a user, a partner or by developing a web4 app. Provide capacity to the ThreeFold Grid, Use capacity, build solutions, develop applications for Web4, and many more.
|
||||
</p>
|
||||
</div>
|
||||
@@ -206,7 +206,7 @@
|
||||
:class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
|
||||
>
|
||||
<div class="overflow-hidden">
|
||||
<p class="pb-3 text-gray-300 text-lg">
|
||||
<p class="pb-3 text-gray-300 text-base font-light">
|
||||
Web4 is our evolution towards a decentralized, user-controlled, and secure Internet that respects privacy and minimizes environmental impact.
|
||||
</p>
|
||||
</div>
|
||||
@@ -238,7 +238,7 @@
|
||||
:class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
|
||||
>
|
||||
<div class="overflow-hidden">
|
||||
<p class="pb-3 text-gray-300 text-lg">
|
||||
<p class="pb-3 text-gray-300 text-base font-light">
|
||||
No, we are NOT blockchain. We are using our own technology: Zero State technology combined with Quantum Safe Internetworking.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
82
templates/partials/home/farmers.html
Normal file
82
templates/partials/home/farmers.html
Normal file
@@ -0,0 +1,82 @@
|
||||
<div class="bg-transparent pt-12 pb-6">
|
||||
<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">
|
||||
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="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">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
1. HOST A NODE
|
||||
</dt>
|
||||
<dd class="mt-4 flex flex-auto flex-col">
|
||||
<p class="flex-auto leading-normal font-light text-gray-200 text-md">All you need to get started is a modern computer, electricity and network. Once booted with Zero OS, a computer becomes a ThreeFold Node.</p>
|
||||
<p class="mt-6">
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
<div class="fade-in-box flex flex-col p-8 rounded 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>
|
||||
<dd class="mt-4 flex flex-auto flex-col">
|
||||
<p class="flex-auto leading-normal font-light text-gray-200 text-md">The capacity of the node gets verified and registered in the ThreeFold Blockchain, securing access to a decentralized autonomous cloud for users and communities.</p>
|
||||
<p class="mt-6">
|
||||
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
<div class="fade-in-box flex flex-col p-8 rounded 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>
|
||||
<dd class="mt-4 flex flex-auto flex-col">
|
||||
<p class="flex-auto leading-normal font-light text-gray-200 text-md">After your node is set up and verified, you’ll be rewarded for the capacity that you provide to the ThreeFold Grid.
|
||||
</p>
|
||||
<p class="mt-6">
|
||||
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-12 flex items-center justify-center gap-x-6">
|
||||
<a href="https://docs.threefold.io/docs/category/nodes" 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 mt-8">Become a Farmer</a>
|
||||
</div>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<style>
|
||||
/* Fade-in animation for the grid items */
|
||||
.fade-in-box {
|
||||
opacity: 0;
|
||||
animation: fadeIn 0.6s ease-in-out forwards;
|
||||
}
|
||||
|
||||
/* Fading in each grid item with a slight delay */
|
||||
.fade-in-box:nth-child(1) { animation-delay: 0s; }
|
||||
.fade-in-box:nth-child(2) { animation-delay: 0.2s; }
|
||||
.fade-in-box:nth-child(3) { animation-delay: 0.4s; }
|
||||
.fade-in-box:nth-child(4) { animation-delay: 0.6s; }
|
||||
.fade-in-box:nth-child(5) { animation-delay: 0.8s; }
|
||||
.fade-in-box:nth-child(6) { animation-delay: 1s; }
|
||||
.fade-in-box:nth-child(7) { animation-delay: 1.2s; }
|
||||
.fade-in-box:nth-child(8) { animation-delay: 1.4s; }
|
||||
.fade-in-box:nth-child(9) { animation-delay: 1.6s; }
|
||||
.fade-in-box:nth-child(10) { animation-delay: 1.8s; }
|
||||
.fade-in-box:nth-child(11) { animation-delay: 2s; }
|
||||
.fade-in-box:nth-child(12) { animation-delay: 2.2s; }
|
||||
|
||||
@keyframes fadeIn {
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -5,7 +5,7 @@
|
||||
</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>
|
||||
<p class="mx-auto mt-4 mb-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">ThreeFold is likely the only active project with a truly scalable solution addressing the Internet and Cloud’s core components: <b>Data, Cloud, and Network</b>.</p>
|
||||
<a href="#" class="fade-in lg:text-xl text-base tracking-normal font-medium pt-6 text-white hover:text-gray-400 blinking-effect">Discover Products <span aria-hidden="true">→</span></a>
|
||||
<a href="#" class="fade-in lg:text-xl text-base tracking-normal font-medium pt-6 text-white hover:text-gray-400 blinking-effect">Discover How It Works <span aria-hidden="true">→</span></a>
|
||||
</div>
|
||||
<div class="lg:px-16 fade-in"> <!-- Added padding to the right side for more spacing -->
|
||||
<dl class="grid grid-cols-1 mx-auto gap-x-8 sm:grid-cols-2 gap-y-10">
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
<h2 class="fade-in text-balance text-4xl font-normal tracking-tight text-white sm:text-5xl">The Next Evolution of the Internet</h2>
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">Web 4 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-base 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-base font-light text-gray-200 fade-in">ThreeFold is the next step to Web4.</p>
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-bold text-gray-200 fade-in">ThreeFold is the next step to Web4.</p>
|
||||
<br>
|
||||
<br>
|
||||
<div class="inline-flex items-center gap-2 fade-in blinking-effect">
|
||||
|
||||
3
templates/partials/icons/twitterx.html
Normal file
3
templates/partials/icons/twitterx.html
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" class="mt-2 h-8 w-8 bi bi-twitter-x" viewBox="0 0 24 24">
|
||||
<path d="M12.6.75h2.454l-5.36 6.142L16 15.25h-4.937l-3.867-5.07-4.425 5.07H.316l5.733-6.57L0 .75h5.063l3.495 4.633L12.601.75Zm-.86 13.028h1.36L4.323 2.145H2.865z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 310 B |
@@ -18,7 +18,7 @@
|
||||
{% elif key == "LinkedIn" %}
|
||||
{% include "partials/icons/svgLinkedInIcon.html" %}
|
||||
{% elif key == "Twitter" %}
|
||||
{% include "partials/icons/svgTwitterIcon.html" %}
|
||||
{% include "partials/icons/twitterx.html" %}
|
||||
{% elif key == "Dribbble" %}
|
||||
{% include "partials/icons/svgDribbbleIcon.html" %}
|
||||
{% elif key == "Telegram" %}
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-medium text-gray-200 fade-in">ThreeFold can be used by any Web2, Web3, AI, or Edge IT workload.
|
||||
</p>
|
||||
<div class="mt-12 flex items-center justify-center gap-x-6">
|
||||
<a href="https://docs.threefold.io" 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">Dive Deeper</a>
|
||||
<a href="https://docs.threefold.io" 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">Dive Deeper - Read our docs</a>
|
||||
f
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<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">What We’ve Built</h2>
|
||||
<p class="text-left mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">
|
||||
At ThreeFold, we've created products that embody innovation, authenticity, and simplicity. Each solution is crafted to empower individuals and communities, blending cutting-edge technology with practical usability. Explore how our creations are shaping a more open and connected future.
|
||||
At ThreeFold, we've created products that embody innovation, authenticity, and simplicity. Each solution is crafted to empower individuals and communities, blending cutting-edge technology with practical usability.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
82
templates/partials/solutions/what.html
Normal file
82
templates/partials/solutions/what.html
Normal file
@@ -0,0 +1,82 @@
|
||||
<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">
|
||||
<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>
|
||||
<p class="mx-auto mt-4 mb-6 max-w-3xl text-pretty lg:text-xl text-base 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="fade-in lg:text-4xl text-base tracking-normal font-medium pt-6 text-white hover:text-gray-400 blinking-effect"><span aria-hidden="true">→ </span>12.12.24</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 gap-y-10">
|
||||
<div class="">
|
||||
<dt class="font-medium text-gray-200">Communicate securely</dt>
|
||||
<dd class="mt-1 font-light text-gray-400 text-sm mb-4">Experience end-to-end encrypted communication in the shortest possible path, ensuring messages remain private and unalterable—even during disasters.</dd>
|
||||
</div>
|
||||
<div class="">
|
||||
<dt class="font-medium text-gray-200">Store effortlessly</dt>
|
||||
<dd class="mt-1 ont-light text-gray-400 text-sm mb-4">Securely share and store information with ease, scaling seamlessly from personal use to billions of users. </dd>
|
||||
</div>
|
||||
<div class="">
|
||||
<dt class="font-medium text-gray-200">Restore authenticity</dt>
|
||||
<dd class="font-light text-gray-400 text-sm mb-4">Determine which information can be trusted, bringing clarity and confidence back to the digital space. </dd>
|
||||
</div>
|
||||
<div class="">
|
||||
<dt class="font-medium text-gray-200">Unlock limitless insights</dt>
|
||||
<dd class="font-light text-gray-400 text-sm mb-4">Discover, analyze, and find information with no boundaries, aided by a powerful personal AI assistant. </dd>
|
||||
</div>
|
||||
<div class="">
|
||||
<dt class="font-medium text-gray-200">Streamline your interactions</dt>
|
||||
<dd class="font-light text-gray-400 text-sm mb-4">Keep track of all your connections and simplify your life with an AI that optimizes your daily tasks and interactions. </dd>
|
||||
</div>
|
||||
<div class="">
|
||||
<dt class="font-medium text-gray-200">Take control of your digital presence</dt>
|
||||
<dd class="font-light text-gray-400 text-sm mb-4">Own and manage your data, identity, and interactions across platforms, ensuring transparency and sovereignty in the digital world.</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
/* Define the slow blinking animation */
|
||||
@keyframes fadeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* Apply the fade-in animation to elements with the 'fade-in' class */
|
||||
.fade-in {
|
||||
animation: fadeIn 4s ease-in-out forwards; /* Adjust the duration (2s) to make it slower or faster */
|
||||
}
|
||||
|
||||
/* Optional: Delay the animation for a more staggered effect */
|
||||
h2 {
|
||||
animation-delay: 0.5s; /* Delay for header */
|
||||
}
|
||||
|
||||
p {
|
||||
animation-delay: 1s; /* Delay for paragraphs */
|
||||
}
|
||||
|
||||
@keyframes blink {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.4;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* Apply the blinking animation to the link */
|
||||
.blinking-effect {
|
||||
animation: blink 3s infinite; /* Adjust the speed here (1.5s for slow blinking) */
|
||||
}
|
||||
</style>
|
||||
@@ -1,7 +1,7 @@
|
||||
<div class="relative isolate overflow-hidden bg-transparent">
|
||||
<div class="px-6 lg:pt-32 mt-12 pt-24 lg:pb-24 pb-12 sm:px-6 lg:px-8">
|
||||
<div class="mx-auto max-w-4xl text-center">
|
||||
<h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-3xl fade-in">We are building a New Internet</h2>
|
||||
<h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-3xl fade-in">Internet needs an Upgrade</h2>
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">The Internet brings the world together, yet much of it is now concentrated in the hands of a few powerful corporations. This wasn't its original purpose. The Internet was envisioned as a decentralized, open space—a tool for freedom, collaboration, and equal access for all.</p>
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-medium text-gray-200 fade-in">ThreeFold has invented a new Data, Network and Cloud system<br>
|
||||
as an Engine for an Upgraded Internet.</p>
|
||||
|
||||
44
templates/partials/why/impact.html
Normal file
44
templates/partials/why/impact.html
Normal file
@@ -0,0 +1,44 @@
|
||||
<div class="bg-transparent fade-in">
|
||||
<div class="mx-auto max-w-2xl px-4 py-24 sm:px-6 sm:py-32 lg:max-w-7xl lg:px-8">
|
||||
<div class="mx-auto max-w-3xl text-center">
|
||||
<h2 class="fade-in text-balance text-4xl font-normal tracking-tight text-white sm:text-5xl">Real-World Impact</h2>
|
||||
<p class="mx-auto mb-10 mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">ThreeFold’s technological infrastructure will empower many projects and initiatives across sectors. Here are two key projects:
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<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">
|
||||
<!-- Text Section -->
|
||||
<div class="lg:col-span-5 align-middle pr-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.
|
||||
Updates expected Q4 2024.
|
||||
</p>
|
||||
</div>
|
||||
<!-- Image Section -->
|
||||
<div class="lg:col-span-7">
|
||||
<img
|
||||
src="/images/freezone.gif"
|
||||
alt=""
|
||||
class=" w-full rounded-lg bg-gray-100 object-fit">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:items-center lg:gap-x-8">
|
||||
<div class="mt-6 lg:col-span-5 lg:col-start-8 lg:row-start-1 lg:mt-0 pr-4">
|
||||
<h3 class="text-2xl font-medium text-white">Tanzanian Sovereign Internet</h3>
|
||||
<p class="mt-2 text-base font-light text-gray-200 pr-4">
|
||||
|
||||
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">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,18 +3,18 @@
|
||||
<div class="mx-auto max-w-2xl lg:max-w-none">
|
||||
<div class="text-center">
|
||||
<h2 class="fade-in text-balance text-4xl font-normal tracking-tight text-white sm:text-5xl">The Team Behind ThreeFold</h2>
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-3xl text-2xl font-medium text-gray-200 fade-in">Founded by Internet Pioneers 1.0</p>
|
||||
<p class="mx-auto mb-10 mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">We are a dedicated group committed to advancing a new digital era. Some of us have been working on Internet technology since the early days, when it was a decentralized network. We aim to help bring that vision to life once more. Beyond those below, we have more than 50 engineers, developers, and other team members supporting the project.</p>
|
||||
<p class="mx-auto mt-4 max-w-3xl text-pretty lg:text-2xl text-xl font-medium text-gray-200 fade-in">Founded by Internet Pioneers 1.0</p>
|
||||
<p class="mx-auto mb-10 mt-6 max-w-4xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">We are a dedicated group committed to advancing a new digital era. Some of us have been working on Internet technology since the early days, when it was a decentralized network. We aim to help bring that vision to life once more. Beyond those below, we have more than 50 engineers, developers, and other team members supporting the project.</p>
|
||||
</div>
|
||||
|
||||
<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">
|
||||
<div class="group relative fade-in">
|
||||
<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/kristof_de_spiegeleer.jpeg" alt="kristof_de_spiegeleer" class="size-full object-cover">
|
||||
<img src="/images/kds.gif" alt="kristof_de_spiegeleer" class="size-full object-cover">
|
||||
</div>
|
||||
<h3 class="mt-4 text-2xl text-white">
|
||||
<h3 class="mt-4 text-xl font-semibold text-white">
|
||||
Kristof de Spiegeleer
|
||||
</h3>
|
||||
<p class="text-sm text-gray-300">Co-founder & CEO</p>
|
||||
@@ -23,11 +23,11 @@
|
||||
</div>
|
||||
|
||||
<!-- Team Member -->
|
||||
<div class="group relative">
|
||||
<div class="group relative fade-in">
|
||||
<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/people/adnan_fatayerji.jpg" alt="adnan_fatayerji" class="size-full object-cover">
|
||||
<img src="/images/adnan.gif" alt="adnan_fatayerji" class="size-full object-cover">
|
||||
</div>
|
||||
<h3 class="mt-4 text-2xl text-white">
|
||||
<h3 class="mt-4 text-xl font-semibold text-white">
|
||||
Adnan Fatayerji
|
||||
</h3>
|
||||
<p class="text-sm text-gray-300">Co-founder</p>
|
||||
@@ -36,11 +36,11 @@
|
||||
</div>
|
||||
|
||||
<!-- Team Member -->
|
||||
<div class="group relative">
|
||||
<div class="group relative fade-in">
|
||||
<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/people/jan_de_landtsheer.jpeg" alt="jan_de_landtsheer" class="size-full object-cover">
|
||||
<img src="/images/jan.gif" alt="jan_de_landtsheer" class="size-full object-cover">
|
||||
</div>
|
||||
<h3 class="mt-4 text-2xl text-white">
|
||||
<h3 class="mt-4 text-xl font-semibold text-white">
|
||||
Jan De Landtsheer
|
||||
</h3>
|
||||
<p class="text-sm text-gray-300">Co-founder & CTO</p>
|
||||
@@ -49,11 +49,11 @@
|
||||
</div>
|
||||
|
||||
<!-- Team Member -->
|
||||
<div class="group relative">
|
||||
<div class="group relative fade-in">
|
||||
<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/people/florian_fournier.jpeg" alt="florian_fournier" class="size-full object-cover">
|
||||
<img src="/images/flo.gif" alt="florian_fournier" class="size-full object-cover">
|
||||
</div>
|
||||
<h3 class="mt-4 text-2xl text-white">
|
||||
<h3 class="mt-4 text-xl font-semibold text-white">
|
||||
Florian Fournier
|
||||
</h3>
|
||||
<p class="text-sm text-gray-300">Co-founder & CMO</p>
|
||||
@@ -62,7 +62,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-12 flex items-center justify-center gap-x-6">
|
||||
<div class="mt-8 flex items-center justify-center gap-x-6 fade-in">
|
||||
<a href="/people" 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">Meet the Team</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user