updated Media Kit page
This commit is contained in:
@@ -56,6 +56,8 @@ extra:
|
|||||||
|
|
||||||
<h6><a target="_self" onclick="window.location.href='/community'">Community</a></h6>
|
<h6><a target="_self" onclick="window.location.href='/community'">Community</a></h6>
|
||||||
|
|
||||||
|
<h6><a target="_self" onclick="window.location.href='/media'">Media kit</a></h6>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{% end %}
|
{% end %}
|
||||||
BIN
content/media/about_hero.png
Normal file
BIN
content/media/about_hero.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 381 KiB |
59
content/media/index.md
Normal file
59
content/media/index.md
Normal file
@@ -0,0 +1,59 @@
|
|||||||
|
---
|
||||||
|
title: "ThreeFold's Vision and Mission"
|
||||||
|
description: "Our mission is to empower individuals and organizations with secure, private, and autonomous access to computing resources, ensuring fair cloud access for everyone." # quotation marks to allow colons where used
|
||||||
|
template: "layouts/media.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/media/tf.png
Normal file
BIN
content/media/tf.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 510 B |
@@ -11,6 +11,8 @@
|
|||||||
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
|
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
|
||||||
|
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
|
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:ital,wght@0,100..900;1,100..900&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
|
||||||
|
|
||||||
|
|
||||||
.dashboard:hover {
|
.dashboard:hover {
|
||||||
|
|
||||||
|
|||||||
BIN
static/images/discourse_dark.png
Normal file
BIN
static/images/discourse_dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.5 KiB |
BIN
static/images/download/black_tft_built.png
Normal file
BIN
static/images/download/black_tft_built.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
BIN
static/images/download/black_tft_horizonal.png
Normal file
BIN
static/images/download/black_tft_horizonal.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.1 KiB |
BIN
static/images/download/black_tft_icon.png
Normal file
BIN
static/images/download/black_tft_icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
BIN
static/images/download/black_tft_logo.png
Normal file
BIN
static/images/download/black_tft_logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
BIN
static/images/download/black_threefold.png
Normal file
BIN
static/images/download/black_threefold.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 239 KiB |
BIN
static/images/download/black_threefold_horizontal.png
Normal file
BIN
static/images/download/black_threefold_horizontal.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 577 KiB |
BIN
static/images/download/black_threefold_three.png
Normal file
BIN
static/images/download/black_threefold_three.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 210 KiB |
BIN
static/images/download/built_on_threefold_horizontal.png
Normal file
BIN
static/images/download/built_on_threefold_horizontal.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 61 KiB |
BIN
static/images/download/tft_icon.png
Normal file
BIN
static/images/download/tft_icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
BIN
static/images/download/white_tft_built_on.png
Normal file
BIN
static/images/download/white_tft_built_on.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.5 KiB |
BIN
static/images/download/white_tft_horizontal.png
Normal file
BIN
static/images/download/white_tft_horizontal.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
BIN
static/images/download/white_tft_logo.png
Normal file
BIN
static/images/download/white_tft_logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
BIN
static/images/download/white_threefold.png
Normal file
BIN
static/images/download/white_threefold.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 458 KiB |
BIN
static/images/download/white_threefold_horizontal.png
Normal file
BIN
static/images/download/white_threefold_horizontal.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 566 KiB |
BIN
static/images/download/white_threefold_three.png
Normal file
BIN
static/images/download/white_threefold_three.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 462 KiB |
BIN
static/images/github_dark.png
Normal file
BIN
static/images/github_dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
BIN
static/images/linkedin_dark.png
Normal file
BIN
static/images/linkedin_dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
BIN
static/images/mail_dark.png
Normal file
BIN
static/images/mail_dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
static/images/media_kit.png
Normal file
BIN
static/images/media_kit.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
BIN
static/images/reddit_dark.png
Normal file
BIN
static/images/reddit_dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
BIN
static/images/telegram.png
Normal file
BIN
static/images/telegram.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
BIN
static/images/twitter.png
Normal file
BIN
static/images/twitter.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 35 KiB |
BIN
static/images/youtube.png
Normal file
BIN
static/images/youtube.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
11
templates/layouts/media.html
Normal file
11
templates/layouts/media.html
Normal file
@@ -0,0 +1,11 @@
|
|||||||
|
{% extends "_default/base.html" %}
|
||||||
|
{% block content %}
|
||||||
|
|
||||||
|
{% include "partials/media/hero.html" %}
|
||||||
|
{% include "partials/media/milestones.html" %}
|
||||||
|
{% include "partials/media/branding.html" %}
|
||||||
|
{% include "partials/media/founders.html" %}
|
||||||
|
{% include "partials/media/social.html" %}
|
||||||
|
|
||||||
|
|
||||||
|
{% endblock content %}
|
||||||
259
templates/partials/media/branding.html
Normal file
259
templates/partials/media/branding.html
Normal file
@@ -0,0 +1,259 @@
|
|||||||
|
<div class="lg:py-24 py-12">
|
||||||
|
<div class=" mx-auto max-w-7xl px-4 lg:px-8">
|
||||||
|
<div class="mx-auto text-center max-w-2xl px-4 lg:max-w-7xl lg:px-8">
|
||||||
|
<h2 class="mx-auto fade-in lg:text-5xl text-3xl leading-snug font-normal tracking-tight text-white capitalize">Our Brand Assets</h2>
|
||||||
|
<p class="my-6 mx-auto max-w-3xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">
|
||||||
|
Download our official brand assets, and guidelines for proper usage
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<section class="container mx-auto px-6 py-8">
|
||||||
|
<!-- Title -->
|
||||||
|
<h2 class="mx-auto fade-in lg:text-5xl text-3xl leading-snug font-normal tracking-tight text-white capitalize">Logos</h2>
|
||||||
|
|
||||||
|
<!-- Black Versions -->
|
||||||
|
<div>
|
||||||
|
<h3 class="mt-6 mb-2 lg:mb-0 text-xl lg:text-2xl font-semibold text-white">White Versions</h3>
|
||||||
|
<dl class="items mt-4 grid grid-cols-1 gap-2 overflow-hidden rounded-2xl text-center sm:grid-cols-2 lg:grid-cols-4">
|
||||||
|
<!-- icon -->
|
||||||
|
<div class="fade-in flex flex-col justify-center items-center bg-white/5 p-4">
|
||||||
|
<div class="text-center flex flex-col my-4">
|
||||||
|
<img class="mx-auto"
|
||||||
|
src="{{ get_url(path='images/download/tft_icon.png') }}"
|
||||||
|
width="170" alt="TFT Icon">
|
||||||
|
|
||||||
|
<a href="{{ get_url(path='images/download/white_threefold_three.png') }}"
|
||||||
|
download
|
||||||
|
class="mt-6 text-gray-200 flex items-center justify-center gap-2 hover:text-gray-400 px-4 py-2 ">
|
||||||
|
|
||||||
|
Download
|
||||||
|
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12.5535 16.5061C12.4114 16.6615 12.2106 16.75 12 16.75C11.7894 16.75 11.5886 16.6615 11.4465 16.5061L7.44648 12.1311C7.16698 11.8254 7.18822 11.351 7.49392 11.0715C7.79963 10.792 8.27402 10.8132 8.55352 11.1189L11.25 14.0682V3C11.25 2.58579 11.5858 2.25 12 2.25C12.4142 2.25 12.75 2.58579 12.75 3V14.0682L15.4465 11.1189C15.726 10.8132 16.2004 10.792 16.5061 11.0715C16.8118 11.351 16.833 11.8254 16.5535 12.1311L12.5535 16.5061Z" fill="#fff"/>
|
||||||
|
<path d="M3.75 15C3.75 14.5858 3.41422 14.25 3 14.25C2.58579 14.25 2.25 14.5858 2.25 15V15.0549C2.24998 16.4225 2.24996 17.5248 2.36652 18.3918C2.48754 19.2919 2.74643 20.0497 3.34835 20.6516C3.95027 21.2536 4.70814 21.5125 5.60825 21.6335C6.47522 21.75 7.57754 21.75 8.94513 21.75H15.0549C16.4225 21.75 17.5248 21.75 18.3918 21.6335C19.2919 21.5125 20.0497 21.2536 20.6517 20.6516C21.2536 20.0497 21.5125 19.2919 21.6335 18.3918C21.75 17.5248 21.75 16.4225 21.75 15.0549V15C21.75 14.5858 21.4142 14.25 21 14.25C20.5858 14.25 20.25 14.5858 20.25 15C20.25 16.4354 20.2484 17.4365 20.1469 18.1919C20.0482 18.9257 19.8678 19.3142 19.591 19.591C19.3142 19.8678 18.9257 20.0482 18.1919 20.1469C17.4365 20.2484 16.4354 20.25 15 20.25H9C7.56459 20.25 6.56347 20.2484 5.80812 20.1469C5.07435 20.0482 4.68577 19.8678 4.40901 19.591C4.13225 19.3142 3.9518 18.9257 3.85315 18.1919C3.75159 17.4365 3.75 16.4354 3.75 15Z" fill="#fff"/>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- main Logo -->
|
||||||
|
<div class="fade-in flex flex-col bg-white/5 p-4">
|
||||||
|
<div class="text-center flex flex-col my-4">
|
||||||
|
<img class="mx-auto"
|
||||||
|
src="{{ get_url(path='images/download/white_tft_logo.png') }}"
|
||||||
|
width="170" alt="">
|
||||||
|
|
||||||
|
<a href="{{ get_url(path='images/download/white_threefold.png') }}" class="mt-6 text-gray-200 flex items-center justify-center gap-2 hover:text-gray-400 px-4 py-2 ">
|
||||||
|
Download
|
||||||
|
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12.5535 16.5061C12.4114 16.6615 12.2106 16.75 12 16.75C11.7894 16.75 11.5886 16.6615 11.4465 16.5061L7.44648 12.1311C7.16698 11.8254 7.18822 11.351 7.49392 11.0715C7.79963 10.792 8.27402 10.8132 8.55352 11.1189L11.25 14.0682V3C11.25 2.58579 11.5858 2.25 12 2.25C12.4142 2.25 12.75 2.58579 12.75 3V14.0682L15.4465 11.1189C15.726 10.8132 16.2004 10.792 16.5061 11.0715C16.8118 11.351 16.833 11.8254 16.5535 12.1311L12.5535 16.5061Z" fill="#fff"/>
|
||||||
|
<path d="M3.75 15C3.75 14.5858 3.41422 14.25 3 14.25C2.58579 14.25 2.25 14.5858 2.25 15V15.0549C2.24998 16.4225 2.24996 17.5248 2.36652 18.3918C2.48754 19.2919 2.74643 20.0497 3.34835 20.6516C3.95027 21.2536 4.70814 21.5125 5.60825 21.6335C6.47522 21.75 7.57754 21.75 8.94513 21.75H15.0549C16.4225 21.75 17.5248 21.75 18.3918 21.6335C19.2919 21.5125 20.0497 21.2536 20.6517 20.6516C21.2536 20.0497 21.5125 19.2919 21.6335 18.3918C21.75 17.5248 21.75 16.4225 21.75 15.0549V15C21.75 14.5858 21.4142 14.25 21 14.25C20.5858 14.25 20.25 14.5858 20.25 15C20.25 16.4354 20.2484 17.4365 20.1469 18.1919C20.0482 18.9257 19.8678 19.3142 19.591 19.591C19.3142 19.8678 18.9257 20.0482 18.1919 20.1469C17.4365 20.2484 16.4354 20.25 15 20.25H9C7.56459 20.25 6.56347 20.2484 5.80812 20.1469C5.07435 20.0482 4.68577 19.8678 4.40901 19.591C4.13225 19.3142 3.9518 18.9257 3.85315 18.1919C3.75159 17.4365 3.75 16.4354 3.75 15Z" fill="#fff"/>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- horizontal Logo -->
|
||||||
|
<div class="fade-in flex flex-col bg-white/5 p-4">
|
||||||
|
<div class="text-center flex flex-col my-4">
|
||||||
|
<img class="mx-auto"
|
||||||
|
src="{{ get_url(path='images/download/white_tft_horizontal.png') }}"
|
||||||
|
width="170" alt="">
|
||||||
|
<a href="{{ get_url(path='images/download/white_threefold_horizontal.png') }}" download class="mt-6 text-gray-200 flex items-center justify-center gap-2 hover:text-gray-400 px-4 py-2 ">
|
||||||
|
Download
|
||||||
|
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12.5535 16.5061C12.4114 16.6615 12.2106 16.75 12 16.75C11.7894 16.75 11.5886 16.6615 11.4465 16.5061L7.44648 12.1311C7.16698 11.8254 7.18822 11.351 7.49392 11.0715C7.79963 10.792 8.27402 10.8132 8.55352 11.1189L11.25 14.0682V3C11.25 2.58579 11.5858 2.25 12 2.25C12.4142 2.25 12.75 2.58579 12.75 3V14.0682L15.4465 11.1189C15.726 10.8132 16.2004 10.792 16.5061 11.0715C16.8118 11.351 16.833 11.8254 16.5535 12.1311L12.5535 16.5061Z" fill="#fff"/>
|
||||||
|
<path d="M3.75 15C3.75 14.5858 3.41422 14.25 3 14.25C2.58579 14.25 2.25 14.5858 2.25 15V15.0549C2.24998 16.4225 2.24996 17.5248 2.36652 18.3918C2.48754 19.2919 2.74643 20.0497 3.34835 20.6516C3.95027 21.2536 4.70814 21.5125 5.60825 21.6335C6.47522 21.75 7.57754 21.75 8.94513 21.75H15.0549C16.4225 21.75 17.5248 21.75 18.3918 21.6335C19.2919 21.5125 20.0497 21.2536 20.6517 20.6516C21.2536 20.0497 21.5125 19.2919 21.6335 18.3918C21.75 17.5248 21.75 16.4225 21.75 15.0549V15C21.75 14.5858 21.4142 14.25 21 14.25C20.5858 14.25 20.25 14.5858 20.25 15C20.25 16.4354 20.2484 17.4365 20.1469 18.1919C20.0482 18.9257 19.8678 19.3142 19.591 19.591C19.3142 19.8678 18.9257 20.0482 18.1919 20.1469C17.4365 20.2484 16.4354 20.25 15 20.25H9C7.56459 20.25 6.56347 20.2484 5.80812 20.1469C5.07435 20.0482 4.68577 19.8678 4.40901 19.591C4.13225 19.3142 3.9518 18.9257 3.85315 18.1919C3.75159 17.4365 3.75 16.4354 3.75 15Z" fill="#fff"/>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- built logo -->
|
||||||
|
<div class="fade-in flex flex-col bg-white/5 p-4">
|
||||||
|
<div class="text-center flex flex-col my-4">
|
||||||
|
<img class="mx-auto"
|
||||||
|
src="{{ get_url(path='images/download/white_tft_built_on.png') }}"
|
||||||
|
width="170" alt="">
|
||||||
|
<a href="{{ get_url(path='images/download/white_tft_built_on.png') }}" download class="mt-6 text-gray-200 flex items-center justify-center gap-2 hover:text-gray-400 px-4 py-2 ">
|
||||||
|
Download
|
||||||
|
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12.5535 16.5061C12.4114 16.6615 12.2106 16.75 12 16.75C11.7894 16.75 11.5886 16.6615 11.4465 16.5061L7.44648 12.1311C7.16698 11.8254 7.18822 11.351 7.49392 11.0715C7.79963 10.792 8.27402 10.8132 8.55352 11.1189L11.25 14.0682V3C11.25 2.58579 11.5858 2.25 12 2.25C12.4142 2.25 12.75 2.58579 12.75 3V14.0682L15.4465 11.1189C15.726 10.8132 16.2004 10.792 16.5061 11.0715C16.8118 11.351 16.833 11.8254 16.5535 12.1311L12.5535 16.5061Z" fill="#fff"/>
|
||||||
|
<path d="M3.75 15C3.75 14.5858 3.41422 14.25 3 14.25C2.58579 14.25 2.25 14.5858 2.25 15V15.0549C2.24998 16.4225 2.24996 17.5248 2.36652 18.3918C2.48754 19.2919 2.74643 20.0497 3.34835 20.6516C3.95027 21.2536 4.70814 21.5125 5.60825 21.6335C6.47522 21.75 7.57754 21.75 8.94513 21.75H15.0549C16.4225 21.75 17.5248 21.75 18.3918 21.6335C19.2919 21.5125 20.0497 21.2536 20.6517 20.6516C21.2536 20.0497 21.5125 19.2919 21.6335 18.3918C21.75 17.5248 21.75 16.4225 21.75 15.0549V15C21.75 14.5858 21.4142 14.25 21 14.25C20.5858 14.25 20.25 14.5858 20.25 15C20.25 16.4354 20.2484 17.4365 20.1469 18.1919C20.0482 18.9257 19.8678 19.3142 19.591 19.591C19.3142 19.8678 18.9257 20.0482 18.1919 20.1469C17.4365 20.2484 16.4354 20.25 15 20.25H9C7.56459 20.25 6.56347 20.2484 5.80812 20.1469C5.07435 20.0482 4.68577 19.8678 4.40901 19.591C4.13225 19.3142 3.9518 18.9257 3.85315 18.1919C3.75159 17.4365 3.75 16.4354 3.75 15Z" fill="#fff"/>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</dl>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Black Versions -->
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h3 class="mt-12 mb-2 lg:mb-0 text-xl lg:text-2xl font-semibold text-white">Black Versions</h3>
|
||||||
|
<dl class="items mt-4 grid grid-cols-1 gap-2 overflow-hidden rounded-2xl text-center sm:grid-cols-2 lg:grid-cols-4">
|
||||||
|
<!-- icon -->
|
||||||
|
<div class="fade-in flex flex-col justify-center items-center bg-white p-4">
|
||||||
|
<div class="text-center flex flex-col my-4">
|
||||||
|
<img class="mx-auto"
|
||||||
|
src="{{ get_url(path='images/download/black_tft_icon.png') }}"
|
||||||
|
width="170" alt="TFT Icon">
|
||||||
|
|
||||||
|
<a href="{{ get_url(path='images/download/black_threefold_three.png') }}"
|
||||||
|
download
|
||||||
|
class="mt-6 text-gray-800 flex items-center justify-center gap-2 hover:text-gray-400 px-4 py-2 ">
|
||||||
|
|
||||||
|
Download
|
||||||
|
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12.5535 16.5061C12.4114 16.6615 12.2106 16.75 12 16.75C11.7894 16.75 11.5886 16.6615 11.4465 16.5061L7.44648 12.1311C7.16698 11.8254 7.18822 11.351 7.49392 11.0715C7.79963 10.792 8.27402 10.8132 8.55352 11.1189L11.25 14.0682V3C11.25 2.58579 11.5858 2.25 12 2.25C12.4142 2.25 12.75 2.58579 12.75 3V14.0682L15.4465 11.1189C15.726 10.8132 16.2004 10.792 16.5061 11.0715C16.8118 11.351 16.833 11.8254 16.5535 12.1311L12.5535 16.5061Z" fill="#000"/>
|
||||||
|
<path d="M3.75 15C3.75 14.5858 3.41422 14.25 3 14.25C2.58579 14.25 2.25 14.5858 2.25 15V15.0549C2.24998 16.4225 2.24996 17.5248 2.36652 18.3918C2.48754 19.2919 2.74643 20.0497 3.34835 20.6516C3.95027 21.2536 4.70814 21.5125 5.60825 21.6335C6.47522 21.75 7.57754 21.75 8.94513 21.75H15.0549C16.4225 21.75 17.5248 21.75 18.3918 21.6335C19.2919 21.5125 20.0497 21.2536 20.6517 20.6516C21.2536 20.0497 21.5125 19.2919 21.6335 18.3918C21.75 17.5248 21.75 16.4225 21.75 15.0549V15C21.75 14.5858 21.4142 14.25 21 14.25C20.5858 14.25 20.25 14.5858 20.25 15C20.25 16.4354 20.2484 17.4365 20.1469 18.1919C20.0482 18.9257 19.8678 19.3142 19.591 19.591C19.3142 19.8678 18.9257 20.0482 18.1919 20.1469C17.4365 20.2484 16.4354 20.25 15 20.25H9C7.56459 20.25 6.56347 20.2484 5.80812 20.1469C5.07435 20.0482 4.68577 19.8678 4.40901 19.591C4.13225 19.3142 3.9518 18.9257 3.85315 18.1919C3.75159 17.4365 3.75 16.4354 3.75 15Z" fill="#000"/>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- main Logo -->
|
||||||
|
<div class="fade-in flex flex-col bg-white p-4">
|
||||||
|
<div class="text-center flex flex-col my-4">
|
||||||
|
<img class="mx-auto"
|
||||||
|
src="{{ get_url(path='images/download/black_tft_logo.png') }}"
|
||||||
|
width="170" alt="">
|
||||||
|
|
||||||
|
<a href="{{ get_url(path='images/download/black_threefold.png') }}" class="mt-6 text-gray-800 flex items-center justify-center gap-2 hover:text-gray-400 px-4 py-2 ">
|
||||||
|
Download
|
||||||
|
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12.5535 16.5061C12.4114 16.6615 12.2106 16.75 12 16.75C11.7894 16.75 11.5886 16.6615 11.4465 16.5061L7.44648 12.1311C7.16698 11.8254 7.18822 11.351 7.49392 11.0715C7.79963 10.792 8.27402 10.8132 8.55352 11.1189L11.25 14.0682V3C11.25 2.58579 11.5858 2.25 12 2.25C12.4142 2.25 12.75 2.58579 12.75 3V14.0682L15.4465 11.1189C15.726 10.8132 16.2004 10.792 16.5061 11.0715C16.8118 11.351 16.833 11.8254 16.5535 12.1311L12.5535 16.5061Z" fill="#000"/>
|
||||||
|
<path d="M3.75 15C3.75 14.5858 3.41422 14.25 3 14.25C2.58579 14.25 2.25 14.5858 2.25 15V15.0549C2.24998 16.4225 2.24996 17.5248 2.36652 18.3918C2.48754 19.2919 2.74643 20.0497 3.34835 20.6516C3.95027 21.2536 4.70814 21.5125 5.60825 21.6335C6.47522 21.75 7.57754 21.75 8.94513 21.75H15.0549C16.4225 21.75 17.5248 21.75 18.3918 21.6335C19.2919 21.5125 20.0497 21.2536 20.6517 20.6516C21.2536 20.0497 21.5125 19.2919 21.6335 18.3918C21.75 17.5248 21.75 16.4225 21.75 15.0549V15C21.75 14.5858 21.4142 14.25 21 14.25C20.5858 14.25 20.25 14.5858 20.25 15C20.25 16.4354 20.2484 17.4365 20.1469 18.1919C20.0482 18.9257 19.8678 19.3142 19.591 19.591C19.3142 19.8678 18.9257 20.0482 18.1919 20.1469C17.4365 20.2484 16.4354 20.25 15 20.25H9C7.56459 20.25 6.56347 20.2484 5.80812 20.1469C5.07435 20.0482 4.68577 19.8678 4.40901 19.591C4.13225 19.3142 3.9518 18.9257 3.85315 18.1919C3.75159 17.4365 3.75 16.4354 3.75 15Z" fill="#000"/>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- horizontal Logo -->
|
||||||
|
<div class="fade-in flex flex-col bg-white p-4">
|
||||||
|
<div class="text-center flex flex-col my-4">
|
||||||
|
<img class="mx-auto"
|
||||||
|
src="{{ get_url(path='images/download/black_tft_horizonal.png') }}"
|
||||||
|
width="170" alt="">
|
||||||
|
<a href="{{ get_url(path='images/download/black_threefold_horizontal.png') }}" download class="mt-6 text-gray-800 flex items-center justify-center gap-2 hover:text-gray-400 px-4 py-2 ">
|
||||||
|
Download
|
||||||
|
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12.5535 16.5061C12.4114 16.6615 12.2106 16.75 12 16.75C11.7894 16.75 11.5886 16.6615 11.4465 16.5061L7.44648 12.1311C7.16698 11.8254 7.18822 11.351 7.49392 11.0715C7.79963 10.792 8.27402 10.8132 8.55352 11.1189L11.25 14.0682V3C11.25 2.58579 11.5858 2.25 12 2.25C12.4142 2.25 12.75 2.58579 12.75 3V14.0682L15.4465 11.1189C15.726 10.8132 16.2004 10.792 16.5061 11.0715C16.8118 11.351 16.833 11.8254 16.5535 12.1311L12.5535 16.5061Z" fill="#000"/>
|
||||||
|
<path d="M3.75 15C3.75 14.5858 3.41422 14.25 3 14.25C2.58579 14.25 2.25 14.5858 2.25 15V15.0549C2.24998 16.4225 2.24996 17.5248 2.36652 18.3918C2.48754 19.2919 2.74643 20.0497 3.34835 20.6516C3.95027 21.2536 4.70814 21.5125 5.60825 21.6335C6.47522 21.75 7.57754 21.75 8.94513 21.75H15.0549C16.4225 21.75 17.5248 21.75 18.3918 21.6335C19.2919 21.5125 20.0497 21.2536 20.6517 20.6516C21.2536 20.0497 21.5125 19.2919 21.6335 18.3918C21.75 17.5248 21.75 16.4225 21.75 15.0549V15C21.75 14.5858 21.4142 14.25 21 14.25C20.5858 14.25 20.25 14.5858 20.25 15C20.25 16.4354 20.2484 17.4365 20.1469 18.1919C20.0482 18.9257 19.8678 19.3142 19.591 19.591C19.3142 19.8678 18.9257 20.0482 18.1919 20.1469C17.4365 20.2484 16.4354 20.25 15 20.25H9C7.56459 20.25 6.56347 20.2484 5.80812 20.1469C5.07435 20.0482 4.68577 19.8678 4.40901 19.591C4.13225 19.3142 3.9518 18.9257 3.85315 18.1919C3.75159 17.4365 3.75 16.4354 3.75 15Z" fill="#000"/>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- built logo -->
|
||||||
|
<div class="fade-in flex flex-col bg-white p-4">
|
||||||
|
<div class="text-center flex flex-col my-4">
|
||||||
|
<img class="mx-auto"
|
||||||
|
src="{{ get_url(path='images/download/black_tft_built.png') }}"
|
||||||
|
width="170" alt="">
|
||||||
|
<a href="{{ get_url(path='images/download/built_on_threefold_horizontal.png') }}" download class="mt-6 text-gray-800 flex items-center justify-center gap-2 hover:text-gray-400 px-4 py-2 ">
|
||||||
|
Download
|
||||||
|
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12.5535 16.5061C12.4114 16.6615 12.2106 16.75 12 16.75C11.7894 16.75 11.5886 16.6615 11.4465 16.5061L7.44648 12.1311C7.16698 11.8254 7.18822 11.351 7.49392 11.0715C7.79963 10.792 8.27402 10.8132 8.55352 11.1189L11.25 14.0682V3C11.25 2.58579 11.5858 2.25 12 2.25C12.4142 2.25 12.75 2.58579 12.75 3V14.0682L15.4465 11.1189C15.726 10.8132 16.2004 10.792 16.5061 11.0715C16.8118 11.351 16.833 11.8254 16.5535 12.1311L12.5535 16.5061Z" fill="#000"/>
|
||||||
|
<path d="M3.75 15C3.75 14.5858 3.41422 14.25 3 14.25C2.58579 14.25 2.25 14.5858 2.25 15V15.0549C2.24998 16.4225 2.24996 17.5248 2.36652 18.3918C2.48754 19.2919 2.74643 20.0497 3.34835 20.6516C3.95027 21.2536 4.70814 21.5125 5.60825 21.6335C6.47522 21.75 7.57754 21.75 8.94513 21.75H15.0549C16.4225 21.75 17.5248 21.75 18.3918 21.6335C19.2919 21.5125 20.0497 21.2536 20.6517 20.6516C21.2536 20.0497 21.5125 19.2919 21.6335 18.3918C21.75 17.5248 21.75 16.4225 21.75 15.0549V15C21.75 14.5858 21.4142 14.25 21 14.25C20.5858 14.25 20.25 14.5858 20.25 15C20.25 16.4354 20.2484 17.4365 20.1469 18.1919C20.0482 18.9257 19.8678 19.3142 19.591 19.591C19.3142 19.8678 18.9257 20.0482 18.1919 20.1469C17.4365 20.2484 16.4354 20.25 15 20.25H9C7.56459 20.25 6.56347 20.2484 5.80812 20.1469C5.07435 20.0482 4.68577 19.8678 4.40901 19.591C4.13225 19.3142 3.9518 18.9257 3.85315 18.1919C3.75159 17.4365 3.75 16.4354 3.75 15Z" fill="#000"/>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</dl>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<div class="lg:my-12 border-t border-gray-600"></div>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<!-- Color -->
|
||||||
|
<section class="container mx-auto px-6 py-8">
|
||||||
|
<!-- Title -->
|
||||||
|
<h2 class="mx-auto fade-in lg:text-5xl text-3xl leading-snug font-normal tracking-tight text-white capitalize">Colors</h2>
|
||||||
|
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<dl class="items mt-4 grid grid-cols-1 gap-2 overflow-hidden rounded-2xl text-center lg:grid-cols-3">
|
||||||
|
<div class="fade-in flex flex-col p-4" style="background-color: #333333;">
|
||||||
|
<h3 class="text-2xl items-center justify-center text-gray-200">#333333</h3>
|
||||||
|
<p class="text-base">Dark Charcoal (main color)</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="fade-in flex flex-col p-4" style="background-color: #fefefe;">
|
||||||
|
<h3 class="text-2xl items-center justify-center text-gray-600">#fefefe</h3>
|
||||||
|
<p class="text-base text-gray-600">Shade of White (main color)</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="fade-in flex flex-col p-4" style="background-color: #a1debd;">
|
||||||
|
<h3 class="text-2xl items-center justify-center text-gray-600">#a1debd</h3>
|
||||||
|
<p class="text-base text-gray-600">Ice Green (accent color)</p>
|
||||||
|
</div>
|
||||||
|
</dl>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<div class="lg:my-12 border-t border-gray-600"></div>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<!-- Typography -->
|
||||||
|
<section class="container mx-auto px-6 py-8">
|
||||||
|
<!-- Title -->
|
||||||
|
<h2 class="mx-auto fade-in lg:text-5xl text-3xl leading-snug font-normal tracking-tight text-white capitalize">Typography</h2>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Regular -->
|
||||||
|
<div class="my-8">
|
||||||
|
<p class="text-white text-lg font-normal">Inter Regular White</p>
|
||||||
|
<p class="text-gray-200">AaBbCc</p>
|
||||||
|
<div class="bg-white/5 p-4 rounded-lg mt-2">
|
||||||
|
<p class="mt-2 text gray-200 text-2xl font-normal">ThreeFold is the Infrastructure Layer of Web4</p></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Bold -->
|
||||||
|
<div class="my-8">
|
||||||
|
<p class="text-white text-lg font-bold">Inter Bold White</p>
|
||||||
|
<p class="text-gray-200">AaBbCc</p>
|
||||||
|
<div class="bg-white/5 p-4 rounded-lg mt-2">
|
||||||
|
<p class="mt-2 text gray-200 text-2xl font-bold">ThreeFold is the Infrastructure Layer of Web4</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Italic -->
|
||||||
|
<div class="my-8" style="font-style: italic">
|
||||||
|
<p class="text-white text-lg font-light italic">Inter Italic White</p>
|
||||||
|
<p class="text-gray-200">AaBbCc</p>
|
||||||
|
<div class="bg-white/5 p-4 rounded-lg mt-2">
|
||||||
|
<p class="mt-2 text gray-200 text-2xl font-light italic">ThreeFold is the Infrastructure Layer of Web4</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<div class="lg:my-12 border-t border-gray-600"></div>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<div class="px-4 lg:px-8">
|
||||||
|
<div class="mx-auto max-w-7xl">
|
||||||
|
<h2 class="mx-auto fade-in lg:text-5xl text-3xl leading-snug font-normal tracking-tight text-white capitalize">Guidelines</h2>
|
||||||
|
<div class="max-w-5xl">
|
||||||
|
<p class="fade-in mt-6 text-lg lg:text-xl font-light text-gray-200">When referring to ThreeFold in any written material, always use the correct capitalization: ThreeFold (with a capital "T" and "F").
|
||||||
|
<br>
|
||||||
|
Correct: ThreeFold
|
||||||
|
<br>
|
||||||
|
Incorrect: threefold, Threefold, THREEFOLD
|
||||||
|
<br>
|
||||||
|
This ensures brand consistency and recognition across all media and communications.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
98
templates/partials/media/founders.html
Normal file
98
templates/partials/media/founders.html
Normal file
@@ -0,0 +1,98 @@
|
|||||||
|
<div class="lg:py-24 py-12">
|
||||||
|
<div class=" mb-10 lg:max-w-7xl mx-auto px-4 lg:px-8 text-center">
|
||||||
|
<h2 class="fade-in text-balance text-3xl font-normal tracking-tight text-white lg:text-5xl visible">Founders & Key Voices</h2>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<section class="lg:max-w-7xl mx-auto py-12 flex items-center justify-center isolate overflow-hidden">
|
||||||
|
<div class="flex lg:flex-row items-center">
|
||||||
|
<!-- Left Content -->
|
||||||
|
<div class="w-full lg:w-1/2 flex justify-center">
|
||||||
|
<img src="/images/people/kristof_de_spiegeleer.jpeg" alt="AIBox Specifications"
|
||||||
|
class="blinking-effect w-2/3 rounded-lg grayscale">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Right Content -->
|
||||||
|
<div class="w-full lg:w-1/2 lg:text-left">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<h2 class="text-balance font-bold tracking-tight text-white text-4xl fade-in">
|
||||||
|
KRISTOF DE SPIEGELEER
|
||||||
|
</h2>
|
||||||
|
<a href="https://www.linkedin.com/in/despiegk/" target="_blank"
|
||||||
|
class="mx-2 bg-white hover:gray-500 text-white p-2 rounded-lg transition">
|
||||||
|
<svg class="w-5 h-5" fill="black" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M4.98 3.5C4.98 4.60457 4.08557 5.5 2.98 5.5C1.87443 5.5 0.98 4.60457 0.98 3.5C0.98 2.39543 1.87443 1.5 2.98 1.5C4.08557 1.5 4.98 2.39543 4.98 3.5ZM1 7H5V21H1V7ZM8 7H12V9.26C12.6325 8.2665 13.878 7 16 7C19.3125 7 21 9.006 21 12.94V21H17V13.71C17 11.587 16.5045 10.5 15.022 10.5C13.5395 10.5 13 11.79 13 13.71V21H9V7H8Z"/>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<p class="mx-auto text-pretty text-2xl font-medium text-gray-200 fade-in">Co-Founder & CEO</p>
|
||||||
|
<p class="mx-auto mt-6 text-pretty text-base font-normal text-gray-200 fade-in">
|
||||||
|
is a serial entrepreneur with 30+ years of experience in Internet infrastructure and cloud technology, holding multiple patents and world records in storage and automation solutions used by industry giants like Oracle, Verizon, and Western Digital. He has founded over ten companies, with seven successful exits totaling over $600M. A pioneer in building the Internet and data center business in Europe, Kristof is now focused on creating a decentralized, sovereign Internet through ThreeFold. Guided by a belief that doing good for the world and delivering investor returns can coexist, he champions respect, transparency, and innovation in every venture. Kristof has previously spoken at Davos.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section class="lg:max-w-7xl mx-auto py-12 flex items-center justify-center isolate overflow-hidden">
|
||||||
|
<div class="flex lg:flex-row items-center ">
|
||||||
|
|
||||||
|
<!-- Left Content -->
|
||||||
|
<div class="w-full lg:w-1/2 flex justify-center">
|
||||||
|
<img src="/images/people/florian_fournier.jpeg" alt="AIBox Specifications" class="blinking-effect w-2/3 rounded-lg grayscale">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Right Image -->
|
||||||
|
<div class="w-full lg:w-1/2 lg:text-left">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<h2 class="text-balance font-bold tracking-tight text-white text-4xl fade-in">
|
||||||
|
FLORIAN FOURNIER
|
||||||
|
</h2>
|
||||||
|
<a href="https://www.linkedin.com/in/florianfournier/" target="_blank"
|
||||||
|
class="mx-2 bg-white hover:gray-500 text-white p-2 rounded-lg transition">
|
||||||
|
<svg class="w-5 h-5" fill="black" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M4.98 3.5C4.98 4.60457 4.08557 5.5 2.98 5.5C1.87443 5.5 0.98 4.60457 0.98 3.5C0.98 2.39543 1.87443 1.5 2.98 1.5C4.08557 1.5 4.98 2.39543 4.98 3.5ZM1 7H5V21H1V7ZM8 7H12V9.26C12.6325 8.2665 13.878 7 16 7C19.3125 7 21 9.006 21 12.94V21H17V13.71C17 11.587 16.5045 10.5 15.022 10.5C13.5395 10.5 13 11.79 13 13.71V21H9V7H8Z"/>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<p class="mx-auto text-pretty text-2xl font-medium text-gray-200 fade-in">Co-Founder</p>
|
||||||
|
<p class="mx-auto mt-6 text-pretty text-base font-normal text-gray-200 fade-in">
|
||||||
|
Florian Fournier is a Serial Entrepreneur and Ex-Marketing Director at Apple. He's a co-founder at ThreeFold. (...)<br>
|
||||||
|
Florian has previously spoken at Davos and at Balaji Srinivasan’s event Network State, to great acclaim.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
/* Apply the blinking animation to the link */
|
||||||
|
.blinking-effect {
|
||||||
|
animation: blink 2s infinite; /* Adjust the speed here (1.5s for slow blinking) */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Define the fade-in 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 */
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
52
templates/partials/media/hero.html
Normal file
52
templates/partials/media/hero.html
Normal file
@@ -0,0 +1,52 @@
|
|||||||
|
<section class="flex items-center justify-center isolate overflow-hidden h-screen">
|
||||||
|
<div class="max-w-7xl mx-auto px-6 lg:px-16 flex flex-col-reverse lg:flex-row items-center ">
|
||||||
|
|
||||||
|
<!-- Left Content -->
|
||||||
|
<div class="w-full lg:w-1/2 lg:text-left">
|
||||||
|
<h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-4xl fade-in">Company Profile</h2>
|
||||||
|
<p class="mx-auto mt-6 text-pretty text-lg font-medium text-gray-200 fade-in">ThreeFold is a pioneering decentralized internet project designed to create a more open, secure, and sustainable digital infrastructure. By leveraging a global peer-to-peer network of independent nodes, ThreeFold eliminates reliance on centralized cloud providers, ensuring greater privacy, resilience, and accessibility. This innovative model empowers individuals and organizations to contribute computing, storage, and networking resources to the ThreeFold Grid, forming the foundation for a truly autonomous and resilient
|
||||||
|
<br><br>We are currently running V3.15, a large-scale proof of concept network and are now preparing for Version 4, our production-ready release. The ThreeFold Grid is in more than 50 countries with +2100 nodes online providing data, network and cloud resources to users.</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Right Image -->
|
||||||
|
<div class="w-full lg:w-1/2 flex justify-center">
|
||||||
|
<img src="/images/media_kit.png" alt="AIBox Specifications" class="blinking-effect w-full max-w-md lg:max-w-lg h-auto">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
/* Apply the blinking animation to the link */
|
||||||
|
.blinking-effect {
|
||||||
|
animation: blink 2s infinite; /* Adjust the speed here (1.5s for slow blinking) */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Define the fade-in 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 */
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
121
templates/partials/media/milestones.html
Normal file
121
templates/partials/media/milestones.html
Normal file
@@ -0,0 +1,121 @@
|
|||||||
|
<section class="text-white pb-12 lg:pb-20">
|
||||||
|
<div class="mx-auto max-w-7xl px-4 sm:px-6">
|
||||||
|
<div class="">
|
||||||
|
{# <p class="text-sm font-bold uppercase tracking-widest text-gray-200">How It Works</p> #}
|
||||||
|
<h2 class="fade-in text-balance text-3xl font-normal tracking-tight text-white lg:text-5xl capitalize visible">Key Milestones & Stats</h2>
|
||||||
|
{# <p class="mx-auto mt-4 max-w-2xl text-lg font-normal text-gray-200 lg:text-xl lg:leading-8">
|
||||||
|
Create your own blog with us and launch it with just 4 easy steps
|
||||||
|
</p> #}
|
||||||
|
</div>
|
||||||
|
<ul class="mx-auto px-0 mt-8 grid grid-cols-1 gap-8 lg:mt-16 lg:grid-cols-3">
|
||||||
|
<li class="flex-start group relative flex lg:flex-col">
|
||||||
|
<span
|
||||||
|
class="absolute left-[18px] top-14 h-[calc(100%_-_32px)] w-px bg-gray-300 lg:right-0 lg:left-auto lg:top-[18px] lg:h-px lg:w-[calc(100%_-_72px)]"
|
||||||
|
aria-hidden="true"></span>
|
||||||
|
<div
|
||||||
|
class="inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-xl border border-gray-300 bg-gray-50">
|
||||||
|
<svg class="fill-current" xmlns="http://www.w3.org/2000/svg" width="12" height="10">
|
||||||
|
<path fill-rule="nonzero" d="M10.422 1.257 4.655 7.025 2.553 4.923A.916.916 0 0 0 1.257 6.22l2.75 2.75a.916.916 0 0 0 1.296 0l6.415-6.416a.916.916 0 0 0-1.296-1.296Z" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div class="ml-6 lg:ml-0 lg:mt-4">
|
||||||
|
<h3
|
||||||
|
class="text-xl font-bold text-gray-200 before:mb-2 before:block before:font-mono before:text-sm before:text-gray-500">
|
||||||
|
Phase I
|
||||||
|
</h3>
|
||||||
|
<div class="p-6 rounded-2xl bg-white/5">
|
||||||
|
<ul class="pl-3 text-base text-gray-200">
|
||||||
|
<li>Creation of Core Technology</li>
|
||||||
|
<li>10+ years of Development</li>
|
||||||
|
<li>Built decentralized, autonomous, edge internet technology</li>
|
||||||
|
<li>50m dollars invested by founders, community, and TF Tech investors</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="flex-start group relative flex lg:flex-col">
|
||||||
|
<span
|
||||||
|
class="absolute left-[18px] top-14 h-[calc(100%_-_32px)] w-px bg-gray-300 lg:right-0 lg:left-auto lg:top-[18px] lg:h-px lg:w-[calc(100%_-_72px)]"
|
||||||
|
aria-hidden="true"></span>
|
||||||
|
<div
|
||||||
|
class="inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-xl border border-gray-300 bg-gray-50">
|
||||||
|
<svg class="fill-current" xmlns="http://www.w3.org/2000/svg" width="12" height="10">
|
||||||
|
<path fill-rule="nonzero" d="M10.422 1.257 4.655 7.025 2.553 4.923A.916.916 0 0 0 1.257 6.22l2.75 2.75a.916.916 0 0 0 1.296 0l6.415-6.416a.916.916 0 0 0-1.296-1.296Z" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div class="ml-6 lg:ml-0 lg:mt-4">
|
||||||
|
<h3
|
||||||
|
class="text-xl font-bold text-gray-200 before:mb-2 before:block before:font-mono before:text-sm before:text-gray-500">
|
||||||
|
Phase II
|
||||||
|
</h3>
|
||||||
|
<div class="p-6 rounded-2xl bg-white/5">
|
||||||
|
<ul class="pl-3 text-base text-gray-200">
|
||||||
|
<li>Global Proof Of Concept</li>
|
||||||
|
<li>Open Source Development</li>
|
||||||
|
<li>50+ Countries</li>
|
||||||
|
<li>50,000+ Cores</li>
|
||||||
|
<li>25,000,000 GB of Storage</li>
|
||||||
|
<li>Thousands of enthusiasts actively engage with and contribute to the evolution of the ThreeFold Network.</li>
|
||||||
|
<li>Decentralized reliable compute, network and storage layer for Web 2-3</li>
|
||||||
|
<li>Commitments from wonderful projects to build on top of us.</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="p-6 mt-6 rounded-2xl bg-white/5">
|
||||||
|
<h3 class="text-lg font-medium my-2 text-gray-200 before:block before:font-mono before:text-sm ">Status System Component</h3>
|
||||||
|
|
||||||
|
<ul class="list-none pl-3 text-base text-gray-200">
|
||||||
|
<li><i class="fa-solid fa-check mr-2"></i>Completed ThreeFold Infrastructure Layer for Web 2, 3 and 4</li>
|
||||||
|
<li><i class="fa-solid fa-check mr-2"></i>Completed ThreeFold Dashboard</li>
|
||||||
|
<li><i class="fa-solid fa-check mr-2"></i>Completed ThreeFold Dashboard</li>
|
||||||
|
<li><i class="fa-solid fa-check mr-2"></i>Completed ThreeFold Nodes</li>
|
||||||
|
<li><i class="fa-solid fa-check mr-2"></i>Completed ThreeFold Kubernetes, Virtual Machines, Containers, ...</li>
|
||||||
|
<li><i class="fa-solid fa-check mr-2"></i>Completed Quantum Safe Storage and File System</li>
|
||||||
|
<li><i class="fa-solid fa-check mr-2"></i>Completed Mycelium Quantum Safe Network</li>
|
||||||
|
<li><i class="fa-solid fa-check mr-2"></i>Completed Mycelium Web2 Gateway</li>
|
||||||
|
<li><i class="fa-solid fa-check mr-2"></i>Completed Mycelium Message Bus</li>
|
||||||
|
<li><i class="fa-solid fa-arrows-rotate mr-2"></i>Pre-Order Now V4 3Node</li>
|
||||||
|
<li><i class="fa-solid fa-arrows-rotate mr-2"></i>Pre-Order Now 3Phone</li>
|
||||||
|
<li><i class="fa-solid fa-arrows-rotate mr-2"></i>Pre-Register Now 3Router</li>
|
||||||
|
<li><i class="fa-solid fa-arrows-rotate mr-2"></i>Upcoming BTC Payment Integration</li>
|
||||||
|
<li><i class="fa-solid fa-arrows-rotate mr-2"></i>Upcoming Credit Card Payment Integration</li>
|
||||||
|
<li><i class="fa-solid fa-arrows-rotate mr-2"></i>Upcoming TFT Bridge to Solana</li>
|
||||||
|
<li><i class="fa-solid fa-arrows-rotate mr-2"></i>Upcoming Mycelium New Features</li>
|
||||||
|
<li><i class="fa-solid fa-arrows-rotate mr-2"></i>Upcoming AIBox Decentralized AI</li>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="flex-start group relative flex lg:flex-col">
|
||||||
|
<div
|
||||||
|
class="inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-xl border border-gray-300 bg-gray-50">
|
||||||
|
<svg class="fill-current" xmlns="http://www.w3.org/2000/svg" width="12" height="12">
|
||||||
|
<path d="M12 10v2H7V8.496a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5V12H0V4.496a.5.5 0 0 1 .206-.4l5.5-4a.5.5 0 0 1 .588 0l5.5 4a.5.5 0 0 1 .206.4V10Z" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div class="ml-6 lg:ml-0 lg:mt-4">
|
||||||
|
<h3
|
||||||
|
class="text-xl font-bold text-white before:mb-2 before:block before:font-mono before:text-sm ">
|
||||||
|
Current Phase - 2025
|
||||||
|
</h3>
|
||||||
|
<div class="p-4 rounded-2xl bg-white/5">
|
||||||
|
<h3 class="text-lg font-medium mb-1 text-gray-200 before:block before:font-mono before:text-sm ">Q1 & Q2:</h3>
|
||||||
|
<ul class="pl-3 text-base text-gray-200">
|
||||||
|
<li>Introduce 3Phone & 3Router.</li>
|
||||||
|
<li>Introduce decentralized AI infrastructure and capabilities.</li>
|
||||||
|
<li>Expand the network considerably.</li>
|
||||||
|
<li>Build a network of commercial farmers for optimal performance and uptime.</li>
|
||||||
|
<li>Continue Web4 expansion through delivery of 3Phone and 3Router.</li>
|
||||||
|
</ul>
|
||||||
|
<h3 class="text-lg font-medium mb-1 text-gray-200 before:block before:font-mono before:text-sm ">Next:</h3>
|
||||||
|
<ul class="pl-2 text-base text-gray-200">
|
||||||
|
<li>Expand the network considerably.</li>
|
||||||
|
<li>Build a network of commercial farmers for optimal performance and uptime.</li>
|
||||||
|
<li>Continue Web4 expansion through delivery of 3Phone and 3Router.</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
99
templates/partials/media/social.html
Normal file
99
templates/partials/media/social.html
Normal file
@@ -0,0 +1,99 @@
|
|||||||
|
<section class="text-white py-12 sm:py-16 lg:pb-20">
|
||||||
|
<div class="mx-auto max-w-7xl px-4 sm:px-6">
|
||||||
|
<div class="text-center">
|
||||||
|
<h2 class="mb-10 fade-in text-balance text-3xl font-normal tracking-tight text-white lg:text-5xl capitalize visible">Social Media & Community</h2>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="pt-6 lg:pt-10 relative flex flex-col xl:flex xl:flex-row text-center mx-auto justify-center mx-auto">
|
||||||
|
<div class="flex-1 mb-6 md:mb-0 px-2 md:px-4 w-full m-2 lg:m-0">
|
||||||
|
<div class="myscale text-white">
|
||||||
|
<a target="_blank" href="https://forum.threefold.io/"><img src="images/discourse_dark.png" class="mx-auto" width="60px" alt="Image"></p>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-white mt-4 font-semibold">Forum</h6>
|
||||||
|
<p class="text-base text-white leading-snug">Ask Questions</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 mb-6 md:mb-0 px-2 md:px-4 w-full m-2 lg:m-0">
|
||||||
|
<div class="myscale">
|
||||||
|
<a target="_blank" href="https://github.com/threefoldfoundation"><img src="images/github_dark.png" class="mx-auto" width="60px" alt="Image"></a>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-white mt-4 font-semibold">GitHub | Tech</h6>
|
||||||
|
<p class="text-base text-white leading-snug">Open-Source Collaboration for Tech Development</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 mb-6 md:mb-0 px-2 md:px-4 w-full m-2 lg:m-0">
|
||||||
|
<div class="myscale">
|
||||||
|
<a target="_blank" href="https://github.com/threefoldtech"><img src="images/github_dark.png" class="mx-auto" width="60px" alt="Image"></a>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-white mt-4 font-semibold">GitHub | Foundation</h6>
|
||||||
|
<p class="text-base text-white leading-snug">Open-source Collaboration for Websites and Online Info</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 mb-6 md:mb-0 px-2 md:px-4 w-full m-2 lg:m-0">
|
||||||
|
<div class="myscale">
|
||||||
|
<a target="_blank" href="https://x.com/threefold_io"><img src="images/twitter.png" class="mx-auto" width="60px" alt="Image"></a>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-white mt-4 font-semibold">X | Twitter</h6>
|
||||||
|
<p class="text-base text-white leading-snug">"Tweet" With Us</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="pt-6 lg:pt-10 relative flex flex-col xl:flex xl:flex-row text-center mx-auto justify-center mx-auto">
|
||||||
|
<div class="flex-1 mb-6 md:mb-0 px-2 md:px-4 w-full m-2 lg:m-0">
|
||||||
|
<div class="myscale text-white">
|
||||||
|
<a target="_blank" href="https://t.me/threefoldnews"><img src="images/telegram.png" class="mx-auto" width="60px" alt="Image"></p>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-white mt-4 font-semibold">Telegram News</h6>
|
||||||
|
<p class="text-base text-white leading-snug">Stay Updated</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 mb-6 md:mb-0 px-2 md:px-4 w-full m-2 lg:m-0">
|
||||||
|
<div class="myscale">
|
||||||
|
<a target="_blank" href="https://t.me/threefold"><img src="images/telegram.png" class="mx-auto" width="60px" alt="Image"></a>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-white mt-4 font-semibold">Telegram Main Chat</h6>
|
||||||
|
<p class="text-base text-white leading-snug">Community Conversation</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 mb-6 md:mb-0 px-2 md:px-4 w-full m-2 lg:m-0">
|
||||||
|
<div class="myscale">
|
||||||
|
<a target="_blank" href="https://t.me/threefoldfarmers"><img src="images/telegram.png" class="mx-auto" width="60px" alt="Image"></a>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-white mt-4 font-semibold">Telegram Farmers Chat</h6>
|
||||||
|
<p class="text-base text-white leading-snug">Farming Community</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 mb-6 md:mb-0 px-2 md:px-4 w-full m-2 lg:m-0">
|
||||||
|
<div class="myscale">
|
||||||
|
<a target="_blank" href="https://t.me/threefoldtesting"><img src="images/telegram.png" class="mx-auto" width="60px" alt="Image"></a>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-white mt-4 font-semibold">Telegram Grid User Chat</h6>
|
||||||
|
<p class="text-base text-white leading-snug">Grid User Community</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="pt-6 lg:pt-10 relative flex flex-col xl:flex xl:flex-row text-center mx-auto justify-center mx-auto">
|
||||||
|
<div class="flex-1 mb-6 md:mb-0 px-2 md:px-4 w-full m-2 lg:m-0">
|
||||||
|
<div class="myscale text-white">
|
||||||
|
<a target="_blank" href="https://www.reddit.com/r/threefold/"><img src="images/reddit_dark.png" class="mx-auto" width="60px" alt="Image"></p>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-white mt-4 font-semibold">Reddit</h6>
|
||||||
|
<p class="text-base text-white leading-snug">Join In</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 mb-6 md:mb-0 px-2 md:px-4 w-full m-2 lg:m-0">
|
||||||
|
<div class="myscale">
|
||||||
|
<a target="_blank" href="https://www.youtube.com/@ThreeFoldFoundation"><img src="images/youtube.png" class="mx-auto" width="60px" alt="Image"></a>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-white mt-4 font-semibold">YouTube</h6>
|
||||||
|
<p class="text-base text-white leading-snug">Watch Things Unfold</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 mb-6 md:mb-0 px-2 md:px-4 w-full m-2 lg:m-0">
|
||||||
|
<div class="myscale">
|
||||||
|
<a target="_self" href="javascript:;" onclick="ml_account('webforms', '3562741', 'n7q9l7', 'show')"><img src="images/mail_dark.png" class="mx-auto" width="60px" alt="Image"></a>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-white mt-4 font-semibold">E-mail Newsletter</h6>
|
||||||
|
<p class="text-base text-white leading-snug">Updates in Your Inbox</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 mb-6 md:mb-0 px-2 md:px-4 w-full m-2 lg:m-0">
|
||||||
|
<div class="myscale">
|
||||||
|
<a target="_blank" href="https://www.linkedin.com/company/threefold-io/"><img src="images/linkedin_dark.png" class="mx-auto" width="60px" alt="Image"></a>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-white mt-4 font-semibold">LinkedIn</h6>
|
||||||
|
<p class="text-base text-white leading-snug">Lets Network</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</section>
|
||||||
Reference in New Issue
Block a user