small mod for config file, so is a template
This commit is contained in:
65
templates/shortcodes/admonition.html
Normal file
65
templates/shortcodes/admonition.html
Normal file
@@ -0,0 +1,65 @@
|
||||
<!-- admonition shortcode for adding admonition in md-->
|
||||
|
||||
{% set classes = "" %}
|
||||
|
||||
{% set first_line = body | split(pat="\n") | first %}
|
||||
{% set parsed_first_line = first_line | split(pat=" ") %}
|
||||
{% set admonition = parsed_first_line | first %}
|
||||
{% set style = "" %}
|
||||
|
||||
{% set content = body | split(pat="\n") | slice(start=2) | join(sep="\n") %}
|
||||
|
||||
<!-- sets admonition type depending on qualifiers and modifiers
|
||||
hides content if doesn't adhere to admonition formatting -->
|
||||
{% if admonition == "!!!" %}
|
||||
{% set classes = "admonition" %}
|
||||
{% elif admonition == "???" %}
|
||||
{% set style = "collapsible closed" %}
|
||||
{% set classes = "admonition" %}
|
||||
{% elif admonition == "???+" %}
|
||||
{% set style = "collapsible open" %}
|
||||
{% set classes = "admonition" %}
|
||||
{% else %}
|
||||
{% set classes = "hidden" %}
|
||||
{% endif %}
|
||||
|
||||
{% if "inline end" in first_line %}
|
||||
{% set classes = classes ~ " inline end" %}
|
||||
{% set parsed_first_line = parsed_first_line | slice(end=-2)%}
|
||||
{% elif "inline" in first_line %}
|
||||
{% set classes = classes ~ " inline" %}
|
||||
{% set parsed_first_line = parsed_first_line | slice(end=-1)%}
|
||||
{% endif %}
|
||||
|
||||
{% if classes != "hidden"%}
|
||||
{% if parsed_first_line[1] %}
|
||||
{% set classes = classes ~ " " ~ parsed_first_line[1] %}
|
||||
{% endif %}
|
||||
{% if parsed_first_line[2] %}
|
||||
{% if not parsed_first_line[2] == '""' %}
|
||||
{% set title = parsed_first_line | slice(start=2) | join(sep=" ") %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
{% if parsed_first_line[1] %}
|
||||
{% set title = parsed_first_line[1] | title %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
|
||||
{% if "collapsible" in style %}
|
||||
<details class="{{classes}}"
|
||||
{% if "open" in style %} {{ "open='open'" }} {% endif %}>
|
||||
{% if title %}
|
||||
<summary class="admonition-title">{{ title | trim_start_matches(pat='"') | trim_end_matches(pat='"') }}</summary>
|
||||
<p>{{ content }}</p>
|
||||
{% endif %}
|
||||
</details>
|
||||
{% else %}
|
||||
<div class="{{classes}}">
|
||||
{% if title %}
|
||||
<div class="admonition-title">{{ title | trim_start_matches(pat='"') | trim_end_matches(pat='"') }}</div>
|
||||
{% endif %}
|
||||
<p>{{ content }}</p>
|
||||
</div>
|
||||
{% endif %}
|
5
templates/shortcodes/button.html
Normal file
5
templates/shortcodes/button.html
Normal file
@@ -0,0 +1,5 @@
|
||||
|
||||
{% set path = body | split(pat="href=") | slice(start=1) | first | split(pat=">") | first | trim_start_matches(pat='"') | trim_end_matches(pat='"') %}
|
||||
<button onclick="window.location='{{path}}'" class="border-transparent flex flex-col border-2 w-full items-start rounded h-16 md:h-24 transition hover:first:text-gray-500 hover:border-stone-200 hover:bg-stone-100 p-2 text-left">
|
||||
{{ body | trim_start_matches(pat="<p>") | safe}}
|
||||
</button>
|
56
templates/shortcodes/earn_sec.html
Normal file
56
templates/shortcodes/earn_sec.html
Normal file
@@ -0,0 +1,56 @@
|
||||
<style>
|
||||
.bg_earn {
|
||||
background-color: #F2EDE8;
|
||||
}
|
||||
|
||||
.bg-boxs {
|
||||
background-color: #f7f4f0;
|
||||
}
|
||||
</style>
|
||||
<div class="relative px-4 sm:px-6 lg:pb-28 lg:px-8 bg_earn">
|
||||
<div class="relative max-w-7xl mx-auto">
|
||||
<div class="grid gap-5 max-w-lg mx-auto lg:grid-cols-3 lg:max-w-none">
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-full w-full object-cover" src="/images/1_plug_in.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">All you need to get started is
|
||||
electricity, a network connection, and a FreeFlow Node</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-full w-full object-cover" src="/images/2_offer_capacity.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Provide decentralized storage and
|
||||
compute capacity to host your communities digital life while maintaining privacy.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-full w-full object-cover" src="/images/3_earn.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Earn in the most valuable and
|
||||
rapidly growing economy: the Internet and cloud</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<button class="flex mx-auto uppercase"
|
||||
onclick="window.open('https://threefoldfoundation.github.io/books/freeflow/network/farming/farming_reward.html', '_blank')">see
|
||||
rewards</button>
|
||||
</div>
|
||||
</div>
|
73
templates/shortcodes/featured_stories.html
Normal file
73
templates/shortcodes/featured_stories.html
Normal file
@@ -0,0 +1,73 @@
|
||||
<style>
|
||||
.bg_earning {
|
||||
background-color: #F2F2F2;
|
||||
}
|
||||
|
||||
.bg_fflow_twin {
|
||||
background-color: #EAF3F7;
|
||||
}
|
||||
|
||||
.bg_CHi_green {
|
||||
background-color: #EBFFED;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="relative px-4 sm:px-6 lg:pb-28 lg:px-8 bg-white">
|
||||
<div class="absolute inset-0">
|
||||
<div class="bg-white h-1/3 sm:h-2/3"></div>
|
||||
</div>
|
||||
<div class="relative max-w-7xl mx-auto">
|
||||
<div class="grid gap-5 max-w-lg mx-auto lg:grid-cols-3 lg:max-w-none">
|
||||
|
||||
<div class="flex flex-col p-6 rounded-lg shadow-lg overflow-hidden bg_earning">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-full w-full object-cover" src="/images/get_earn.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h3 class="mt-2 text-4xl leading-9 font-normal uppercase text-gray-900">
|
||||
get a node and <br /><b class="font-bold">start earning</b>
|
||||
</h3>
|
||||
<div class="mt-3 leading-6 text-gray-800 text-lg max-w-sm">Get a FreeFlow Node and add capacity to
|
||||
the FreeFlow Network.</div>
|
||||
<button class="uppercase font-bold" onclick="window.location='/node'">know more</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col p-6 rounded-lg shadow-lg overflow-hidden bg_fflow_twin">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-full w-full object-cover" src="/images/ff_twin.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h3 class="mt-2 text-4xl leading-9 font-normal uppercase text-gray-900">
|
||||
GET THE <br /><b class="font-bold">FREEFLOW TWIN</b>
|
||||
</h3>
|
||||
<div class="mt-3 leading-6 text-gray-800 text-lg max-w-sm">Reserve your sovereign digital twin. <br>Take control over your digital life.</div>
|
||||
<button class="uppercase font-bold" onclick="window.location='/twin'">know more</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex flex-col p-6 rounded-lg shadow-lg overflow-hidden bg_CHi_green">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-full w-full object-cover" src="/images/chi.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h3 class="mt-2 text-4xl leading-9 font-normal uppercase text-gray-900">
|
||||
ACQUIRE <br /><b class="font-bold">CHI</b>
|
||||
</h3>
|
||||
<div class="mt-3 leading-6 text-gray-800 text-lg max-w-sm">The digital energy currency
|
||||
of <br>the FreeFlow network `CHI token`</div>
|
||||
<button class="uppercase font-bold"
|
||||
onclick="window.open('https://threefoldfoundation.github.io/books/freeflow/network/buy/buy_my_chi.html', '_blank')">know
|
||||
more</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
52
templates/shortcodes/fflow_experiences.html
Normal file
52
templates/shortcodes/fflow_experiences.html
Normal file
@@ -0,0 +1,52 @@
|
||||
<style>
|
||||
.bg_earn3 {
|
||||
background-color: #F9F8F6;
|
||||
}
|
||||
|
||||
.bg-boxs3 {
|
||||
background-color: #EFEDEB;
|
||||
}
|
||||
</style>
|
||||
<div class="relative px-4 sm:px-6 lg:pb-28 lg:px-8 bg_earn3">
|
||||
<div class="relative max-w-7xl mx-auto">
|
||||
<div class="grid gap-5 max-w-lg mx-auto lg:grid-cols-3 lg:max-w-none">
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs3">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/education.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">FREEFLOWING<br> EDUCATION</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">All citizens can now acquire information and learn skills.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/empowerment.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">FREEFLOWING<br> EMPOWERMENT</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">All citizens can now attain the opportunity to participate in the digital economy.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/collaboration.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">FREEFLOWING<br> COLLABORATION</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">All citizens can now work together to achieve goals and growth.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
52
templates/shortcodes/fflow_grid.html
Normal file
52
templates/shortcodes/fflow_grid.html
Normal file
@@ -0,0 +1,52 @@
|
||||
<style>
|
||||
.bg_earn2 {
|
||||
background-color: #f0ece8;
|
||||
}
|
||||
|
||||
.bg-boxs {
|
||||
background-color: #F7F4F1;
|
||||
}
|
||||
</style>
|
||||
<div class="relative px-4 sm:px-6 lg:pb-28 lg:px-8 bg_earn2">
|
||||
<div class="relative max-w-7xl mx-auto">
|
||||
<div class="grid gap-5 max-w-lg mx-auto lg:grid-cols-3 lg:max-w-none">
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/own_data.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">fully own<br> your data</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">The entirety of your data belogs to you instead of company or service-provider.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/own_identy.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">unbeatable<br> privacy</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Only you have control of your data and decide who has access to it. Forever.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/endless.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">zero<br> manipulation</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Your data can never be used for financial or commercial gains by anyone.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
95
templates/shortcodes/fflow_skills.html
Normal file
95
templates/shortcodes/fflow_skills.html
Normal file
@@ -0,0 +1,95 @@
|
||||
<div class="container px-4 sm:px-6 lg:pb-28 lg:px-8 mx-auto">
|
||||
|
||||
<div class="grid gap-3 max-w-lg mx-auto lg:grid-cols-2 lg:max-w-none">
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/meet.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Meet & Communicate</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Chat with your friends, hold meetings and and have video conferencing.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/exchange.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Exchange & Store Money</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Transact or manage your assets using the wallet features available with the Twin.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/create.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Create</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Create videos, documents or anything else you require for your daily needs.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/organize.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Organize</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Archive and organize all your data in one place without worrying about security.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/share.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Share</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Send your data and files to anyone of your choice directly without central servers.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/publish.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Publish</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Build websites, librariies or whatever else you require with the FreeFlow Twin.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/discover.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Discover</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">FInd and browse any information without being tracked or logged.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/collaborate.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Collaborate</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Work with your friends, family or collegues or projects or tasks together.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/develop.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Develop & Expand</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Develop more tools or decentralized applications for the FreeFlow Grid.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
53
templates/shortcodes/fflow_twin.html
Normal file
53
templates/shortcodes/fflow_twin.html
Normal file
@@ -0,0 +1,53 @@
|
||||
<style>
|
||||
.bg_earn {
|
||||
background-color: #D9E7DF;
|
||||
}
|
||||
|
||||
.bg-boxs {
|
||||
background-color: #F7F4F1;
|
||||
}
|
||||
</style>
|
||||
<div class="relative px-4 sm:px-6 lg:pb-28 lg:px-8 bg_earn">
|
||||
<div class="relative max-w-7xl mx-auto">
|
||||
<div class="grid gap-5 max-w-lg mx-auto lg:grid-cols-3 lg:max-w-none">
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/key.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">EVERYONE<br> HAS ACCESS</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Every member of society has access and there are no barriers to entry,.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/partake.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">ANYONE<br> CAN PARTAKE</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Only you have control of your data and decide who has access to it.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/succeed.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">ANYONE<br> CAN SUCCEED</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Anyone can attain the opportunity to earn and to better their lives.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
78
templates/shortcodes/grid_stats.html
Normal file
78
templates/shortcodes/grid_stats.html
Normal file
@@ -0,0 +1,78 @@
|
||||
{% set styles = "background-image: url('/images/ston_bg.png');" %}
|
||||
{% set data = load_data(url="https://gridproxy.grid.tf/stats?status=up", required=false, format="json") %}
|
||||
{% if data %}
|
||||
{% set capacity = data.totalHru + data.totalSru / (1024 * 1024 * 1024 * 1024) %}
|
||||
{% set nodes = data.nodes %}
|
||||
{% set countries = data.countries %}
|
||||
{% endif %}
|
||||
<style>
|
||||
.bg-map {
|
||||
background-color: #EAE8E3;
|
||||
}
|
||||
</style>
|
||||
<div class="bg-map pb-24">
|
||||
<div class="relative max-w-7xl mx-auto">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 ">
|
||||
<div class=" overflow-hidden">
|
||||
<div class="px-2 py-16">
|
||||
<div class="flex items-start">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="/images/node_icon.png" width="65" alt="">
|
||||
</div>
|
||||
<div class="ml-5 w-0 flex-1 pt-3">
|
||||
<dl>
|
||||
<dd class="flex items-baseline mb-5 ">
|
||||
<div class="text-6xl advance leading-8 font-extrabold text-gray-900">
|
||||
{{ nodes }}
|
||||
</div>
|
||||
</dd>
|
||||
<dt class="text-2xl leading-8 uppercase font-medium text-gray-900 truncate">
|
||||
freeflow nodes <br />deployed
|
||||
</dt>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class=" overflow-hidden bg-no-repeat bg-center bg-contain text-center" style="{{styles}}">
|
||||
<div class="px-2 py-16">
|
||||
<div class="flex items-start">
|
||||
<div class="ml-5 w-0 flex-1 pt-3">
|
||||
<dl>
|
||||
<dd class="flex items-baseline mb-5 ">
|
||||
<div class="text-6xl advance leading-8 mx-auto font-extrabold text-gray-900">
|
||||
{{ countries }}
|
||||
</div>
|
||||
</dd>
|
||||
<dt class="text-2xl leading-8 uppercase font-medium text-gray-900 truncate">
|
||||
countries <br />involved
|
||||
</dt>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class=" overflow-hidden">
|
||||
<div class="px-2 py-16">
|
||||
<div class="flex items-start">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="/images/capacity_icon.png" width="65" alt="">
|
||||
</div>
|
||||
<div class="ml-5 w-0 flex-1 pt-3">
|
||||
<dl>
|
||||
<dd class="flex items-baseline mb-5 ">
|
||||
<div class="text-6xl advance leading-8 font-extrabold text-gray-900">
|
||||
{{ capacity | round() }}TB
|
||||
</div>
|
||||
</dd>
|
||||
<dt class="text-2xl leading-8 uppercase font-medium text-gray-900 truncate">
|
||||
capacity <br />generated
|
||||
</dt>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
44
templates/shortcodes/menu.html
Normal file
44
templates/shortcodes/menu.html
Normal file
@@ -0,0 +1,44 @@
|
||||
<!-- row shortcode
|
||||
Shortcode used in markdown for the creation of mobile compatible vertical rows
|
||||
Divides markdown into columns by splitting content using column identifier "|||"
|
||||
Creates equal width blocks in a flex row.
|
||||
|
||||
Parameters:
|
||||
- style:
|
||||
- lean: if style is lean, the row doesn't have outer margins
|
||||
- bgPath: if bgPath is passed, the row has a full width background
|
||||
-->
|
||||
|
||||
{% set columns = body | safe | markdown | split(pat="|||") %}
|
||||
|
||||
<!-- aligns columns depending on col number-->
|
||||
|
||||
{% set classes = "relative flex flex-col lg:flex-row items-baseline -mx-8 sm:-mx-12 lg:-mx-12 xl:-mx-8" %}
|
||||
{% set column_classes = "flex-1 m-2 lg:m-4" %}
|
||||
|
||||
<!-- makes row full screen width and adds background img -->
|
||||
|
||||
<div class="{{classes}}">
|
||||
{% for column in columns%}
|
||||
<!-- Hides empty columns if displayed vertically in small screen -->
|
||||
{% if column | as_str | length < 10 %}
|
||||
<div class="hidden md:block flex-1 md:mb-0 md:mx-8 sm:flex-1">
|
||||
{{column | split(pat="{% button() %}") | slice(end=1)}}
|
||||
{% for button in column | split(pat="{% button() %}") | slice(start=1) | join(sep="") | split(pat="{%% end %%}") | slice(end=-1) %}
|
||||
{% set body = button %}
|
||||
{% include "shortcodes/button.html" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="{{column_classes}}">
|
||||
{{column | split(pat="{% button() %}") | slice(end=1) | first | safe}}
|
||||
<hr class="border-t-2 mt-2">
|
||||
<br/>
|
||||
{% for button in column | split(pat="{% button() %}") | slice(start=1) | join(sep="") | split(pat="{%% end %%}") | slice(end=-1) %}
|
||||
{% set body = button %}
|
||||
{% include "shortcodes/button.html" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
3
templates/shortcodes/mermaid.html
Normal file
3
templates/shortcodes/mermaid.html
Normal file
@@ -0,0 +1,3 @@
|
||||
<div class="mermaid">
|
||||
{{ body }}
|
||||
</div>
|
225
templates/shortcodes/row.html
Normal file
225
templates/shortcodes/row.html
Normal file
@@ -0,0 +1,225 @@
|
||||
<!-- row shortcode
|
||||
Shortcode used in markdown for the creation of mobile compatible vertical rows
|
||||
Divides markdown into columns by splitting content using column identifier "|||"
|
||||
Creates equal width blocks in a flex row.
|
||||
|
||||
Parameters:
|
||||
- style:
|
||||
- lean: if style is lean, the row doesn't have outer margins
|
||||
- bgPath: if bgPath is passed, the row has a full width background
|
||||
-->
|
||||
|
||||
|
||||
<!-- This fixes link & img paths in local, prod, and wth prefix -->
|
||||
{% if page %}
|
||||
{% if "](" in body %}
|
||||
{% set body_arr = body | split(pat="](") %}
|
||||
{% set body = body_arr[0] %}
|
||||
{% for i in body_arr %}
|
||||
{% set prev_index = loop.index0 - 1 %}
|
||||
{% if not loop.first %}
|
||||
{% if "![" in body_arr[prev_index] %}
|
||||
{% set_global body = body ~ '](' ~ page.permalink ~ i %}
|
||||
{% else %}
|
||||
{% if i is not starting_with("http") %}
|
||||
{% set base_url = get_url(path="") %}
|
||||
{% set_global body = body ~ '](' ~ base_url ~ i %}
|
||||
{% else %}
|
||||
{% set_global body = body ~ '](' ~ i %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% set columns = body | safe | markdown | split(pat="<p>|||</p>") %}
|
||||
|
||||
{% set row_class = "relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden"%}
|
||||
|
||||
<!-- aligns columns depending on col number-->
|
||||
{% if 2 < columns | length %}
|
||||
{% set row_class = row_class ~ " lg:items-start" %}
|
||||
{% else %}
|
||||
{% set row_class = row_class ~ " lg:items-center" %}
|
||||
{% endif %}
|
||||
|
||||
{% set col_class = "flex-1 mb-4 md:mb-12 lg:mb-0 lg:mx-2 xl:mx-4" %}
|
||||
|
||||
|
||||
{% set row_id = '' %}
|
||||
|
||||
{% if id %}
|
||||
{% set row_id = id %}
|
||||
|
||||
{% endif %}
|
||||
|
||||
<!-- Padding -->
|
||||
|
||||
{% set padding_class = " py-8 md:py-8 lg:py-28" %}
|
||||
|
||||
{% if padding %}
|
||||
{% if "none" in padding %}
|
||||
{% set padding_class = " py-0" %}
|
||||
{% elif "top" in padding %}
|
||||
{% set padding_class = " py-2 md:py-4 lg:pt-28" %}
|
||||
{% elif "bottom" in padding %}
|
||||
{% set padding_class = " py-2 md:py-4 lg:pb-28" %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% if css %}
|
||||
{% set padding_class = padding_class ~ " " ~ css %}
|
||||
{% endif %}
|
||||
|
||||
{% set row_class = row_class ~ padding_class %}
|
||||
|
||||
|
||||
<!-- Margins -->
|
||||
|
||||
{% set margin_class = " mx-4 md:mx-16 lg:mx-24" %}
|
||||
|
||||
{% if margin %}
|
||||
{% if "none" in margin %}
|
||||
{% set margin_class = " mx-0" %}
|
||||
{% elif "wide" in margin %}
|
||||
{% set margin_class = " mx-4 sm:mx-8 md:mx-12 lg:mx-16 xl:mx-20" %}
|
||||
{% elif "moderate" in margin %}
|
||||
{% set margin_class = " mx-8 sm:mx-16 md:mx-20 lg:mx-28" %}
|
||||
{% elif "narrow" in margin %}
|
||||
{% set margin_class = " mx-12 sm:mx-20 md:mx-28 lg:mx-40" %}
|
||||
{% elif "tight" in margin %}
|
||||
{% set margin_class = " mx-20 sm:mx-32 md:mx-40 lg:mx-80 xl:mx-96" %}
|
||||
{% elif "header" in margin %}
|
||||
{% set margin_class = " mx-12 sm:mx-20 md:mx-28 lg:mx-40 my-10" %}
|
||||
{% endif %}
|
||||
{% if "lean-left" in margin %}
|
||||
{% set margin = margin_class | replace(from=" ", to=" first:")%}
|
||||
{% set margin_left = margin | replace(from="mx", to="-ml") %}
|
||||
{% set margin_right = margin | replace(from="mx", to="mr") %}
|
||||
{% set col_class = col_class ~ " md:last:px-8 lg:last:px-20 lg:max-w-[50%] lg:mx-0 " ~ margin_left ~ margin_right %}
|
||||
{% set row_class = row_class ~ " sm:gap-0 " %}
|
||||
{% elif "lean-right" in margin %}
|
||||
{% set margin = margin_class | replace(from=" ", to=" last:")%}
|
||||
{% set margin_left = margin | replace(from="mx", to="ml") %}
|
||||
{% set margin_right = margin | replace(from="mx", to="-mr") %}
|
||||
{% set col_class = col_class ~ " md:first:px-8 lg:first:px-20 lg:max-w-[50%] lg:mx-0 " ~ margin_left ~ margin_right %}
|
||||
{% set row_class = row_class ~ " sm:gap-0 " %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% if css %}
|
||||
{% set margin_class = margin_class ~ " " ~ css %}
|
||||
{% endif %}
|
||||
|
||||
{% set row_class = row_class ~ margin_class %}
|
||||
|
||||
{% if style %}
|
||||
|
||||
{% if "center" in style %}
|
||||
{% set row_class = row_class ~ " text-center items-center mx-auto " %}
|
||||
{% set col_class = col_class ~ " flex-1 " %}
|
||||
{% endif %}
|
||||
|
||||
{% if "items-end" in style %}
|
||||
{% set row_class = row_class ~ " lg:items-end" %}
|
||||
{% set col_class = col_class ~ " flex-1 " %}
|
||||
{% endif %}
|
||||
|
||||
<!-- makes row semi-full screen width, strips margins -->
|
||||
{% if "between" in style %}
|
||||
{% set row_class = row_class ~ " lg:max-w-6xl " %}
|
||||
{% elif "moderate" in style %}
|
||||
{% set row_class = row_class ~ " " %}
|
||||
{% endif %}
|
||||
|
||||
<!-- makes row full screen width, strips margins -->
|
||||
{% if "narrow" in style %}
|
||||
{% set row_class = row_class ~ " lg:max-w-3xl " %}
|
||||
{% elif "tight" in style %}
|
||||
{% set row_class = row_class ~ " lg:max-w-sm " %}
|
||||
{% elif "moderate" in style %}
|
||||
{% set row_class = row_class ~ " mx-20 " %}
|
||||
{% endif %}
|
||||
|
||||
{% if "invert-color" in style %}
|
||||
|
||||
{% set row_class = row_class ~ " text-white lg:text-white " %}
|
||||
|
||||
{% endif %}
|
||||
{% else %}
|
||||
{% set row_class = row_class ~ " " %}
|
||||
{% endif %}
|
||||
|
||||
{% set anchor_link = ""%}
|
||||
{% if anchor %}
|
||||
{% set anchor_link = anchor %}
|
||||
{% endif %}
|
||||
|
||||
|
||||
<!-- makes row full screen width and adds background img -->
|
||||
{% set styles = "" %}
|
||||
{% set div_class = " " %}
|
||||
{% if bgPath %}
|
||||
{% set background_url = page.permalink ~ bgPath %}
|
||||
{% set styles = "background: url('" ~ background_url ~ "'); background-size: cover; background-position: center;" %}
|
||||
{% if "#desktop" in bgPath %}
|
||||
{% set bgStyle = false %}
|
||||
{% set div_class = " !bg-[length:0px_0px] !bg-no-repeat lg:!bg-cover " %}
|
||||
{% set row_class = row_class | replace(from='text-white', to='text-black') %}
|
||||
{% if "invert-color" in style %}
|
||||
{% if "#desktop" in bgPath %}
|
||||
{% set row_class = row_class ~ " lg:text-white " %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% if bgStyle %}
|
||||
{% if "full" in bgStyle %}
|
||||
{% set styles = styles ~ "height: -webkit-fill-available; height: 100vh;" %}
|
||||
{% elif "hero" in bgStyle %}
|
||||
{% set div_class = div_class ~ " -mt-24 pt-12 " %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% if bgColor %}
|
||||
{% set styles = "background-color: " ~ bgColor ~ "; background-size: cover" %}
|
||||
{% set row_class = row_class %}
|
||||
{% endif %}
|
||||
|
||||
{% if class %}
|
||||
{% set styles = "background-color: " ~ bgColor ~ "; background-size: cover" %}
|
||||
{% set row_class = row_class %}
|
||||
{% endif %}
|
||||
|
||||
<!-- Cancels page margins so that rows can have separate margins -->
|
||||
{% set no_margins = " -mx-8 md:-mx-12 lg:-mx-16 xl:-mx-20" %}
|
||||
|
||||
|
||||
<div id="{{anchor_link}}" class="{{'relative justify-center flex overflow-hidden ' ~ div_class }}" style="{{styles}}">
|
||||
<div id="{{row_id}}" class="{{row_class}}" style="min-width: -webkit-fill-available; min-width: -moz-available">
|
||||
|
||||
{% for column in columns%}
|
||||
|
||||
<!-- Hides empty columns if displayed vertically in small screen -->
|
||||
{% if column | as_str | length < 10 %}
|
||||
<div class="hidden md:block flex-1 md:mb-0 md:mx-8 sm:flex-1 ">
|
||||
{{ column | safe }}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="{{col_class}}">
|
||||
<!-- handles mermaid markdown content display -->
|
||||
|
||||
{% if "{% mermaid() %}" in column %}
|
||||
{% set mermaid_section = column | safe | markdown | split(pat="{% mermaid() %}") %}
|
||||
{% set mermaid_content = mermaid_section[1] | striptags | replace(from="–", to="--")%}
|
||||
<div class="mermaid">
|
||||
{{mermaid_content | safe }}
|
||||
</div>
|
||||
{% else %}
|
||||
{{ column | safe }}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
8
templates/shortcodes/space.html
Normal file
8
templates/shortcodes/space.html
Normal file
@@ -0,0 +1,8 @@
|
||||
|
||||
{% set height = 52 %}
|
||||
{% if size %}
|
||||
{% if size == "small" %}
|
||||
{% set height = 28 %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
<div class="h-20 lg:h-{{height}}"></div>
|
79
templates/shortcodes/team_sec.html
Normal file
79
templates/shortcodes/team_sec.html
Normal file
@@ -0,0 +1,79 @@
|
||||
<div class="lg:my-32 flex flex-col mt-5 p-auto lg:px-40">
|
||||
<h2 class="flex py-2 mx-auto uppercase font-bold lg:text-6xl">
|
||||
THE TEAM
|
||||
</h2>
|
||||
<div class="lg:max-w-4xl text-xl text-center mb-8 mx-auto leading-relaxed">Spread across the world, our team has
|
||||
built some of the world’s best Internet storage and cloud automation technologies since the ‘90s. With a strong
|
||||
vision for the future, we’re now on a mission to create a peer-to-peer Internet that can host all of humanity’s
|
||||
digital workloads via smart contract, removing all forms of centralization from global IT systems.</div>
|
||||
<div class="flex overflow-x-scroll pb-10 scrollable">
|
||||
<div class="flex flex-nowrap ml-10 mt-10">
|
||||
<div class="inline-block px-3">
|
||||
<div class="
|
||||
box
|
||||
max-w-xs
|
||||
overflow-hidden
|
||||
rounded-full
|
||||
shadow-md
|
||||
hover:shadow-xl
|
||||
transition-shadow
|
||||
duration-300
|
||||
ease-in-out
|
||||
">
|
||||
<a href="https://threefold.io/people/adnan_fatayerji/" title="Adnan Fatayerji">
|
||||
<img src="https://threefold.io/assets/static/adnan_fatayerji.a68c322.7ba2b95e75c9fab15be532f16ac0d644.jpg"
|
||||
class="rounded-full mx-auto mt-3" alt="Adnan Fatayerji" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.scrollable::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
.scrollable::-webkit-scrollbar-track {
|
||||
background: #f1f1f1;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
.scrollable::-webkit-scrollbar-thumb {
|
||||
background: linear-gradient(45deg, #70dfc9, #ee7bf7);
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
/* #70dfc9, #ee7bf7 */
|
||||
.box {
|
||||
position: relative;
|
||||
height: 150px;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.box::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border-radius: 50%;
|
||||
padding: 10px;
|
||||
background: linear-gradient(45deg, #70dfc9, #ee7bf7);
|
||||
-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
|
||||
-webkit-mask-composite: destination-out;
|
||||
mask-composite: exclude;
|
||||
}
|
||||
|
||||
.box img {
|
||||
filter: grayscale(100%);
|
||||
height: 130px;
|
||||
width: 130px;
|
||||
}
|
||||
|
||||
.box img:hover {
|
||||
filter: grayscale(0);
|
||||
}
|
||||
</style>
|
Reference in New Issue
Block a user