Merge branch 'development'

content/build/index.md

@@ -4,47 +4,24 @@ template: "page.html"
 insert_anchor_links: "left"
 ---
 
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
+<!-- section 1  -->
 
-{% row(style="center narrow") %}
+{% row(style="center margin narrow") %}
 
 ## The Next Generation of <br> **Cloud Computing**
 
 Deploy any workload with unprecedented security, scalability, and efficiency, on a fully comprehensive peer-to-peer digital infrastructure. Discover a cloud like no other.
 
-{% end %}
-
-{% row(style="center narrow") %}
+<br>
 
 <button>[Dashboard](https://dashboard.grid.tf)</button>
-
-|||
-
 <button>[Weblets](https://play.grid.tf)</button>
-
-|||
-
-<button>[Manual](https://library.threefold.me/info/manual/#/manual__manual3_home_new)</button>
-
-|||
-
-<button>[Chat](https://t.me/threefoldtesting)
+<button>[Manual](https://library.threefold.me/info/manual/#/manual__manual3_home_new)
+<button>[Chat](https://t.me/threefoldtesting)</button>
 
 {% end %}
 
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
+<!-- section 2  -->
 
 {% row(style="center margin") %}
 
@@ -79,10 +56,9 @@ Private overlay networks and global end-to-end encryption minimize attack surfac
 
 {% end %}
 
-<br />
-<br />
+<!-- section 3  -->
 
-{% row(style="center between") %}
+{% row(style="center mtop between") %}
 
 [![quantum safe storage](qss.png#mx-auto)](https://library.threefold.me/info/manual/#/technology/qsss/threefold__qsss_home)
 
@@ -96,7 +72,7 @@ Private overlay networks and global end-to-end encryption minimize attack surfac
 
 {% end %}
 
-{% row(style="center between") %}
+{% row(style="center mbottom between") %}
 
 [![kubernetes](kubernetes.png#mx-auto)](https://library.threefold.me/info/manual/#/manual__weblets_k8s)
 
@@ -110,12 +86,10 @@ Private overlay networks and global end-to-end encryption minimize attack surfac
 
 {% end %}
 
-<br />
-<br />
-<br />
-<br />
+<!-- section 4 -->
 
-{% row(style="center narrow") %}
+
+{% row(style="center mtop narrow") %}
 
 ## Designed for <br> **Demanding Workloads**
 
@@ -125,13 +99,11 @@ Private overlay networks and global end-to-end encryption minimize attack surfac
 
 ![Image](capacity.png#medium)
 
-<br/>
-<br/>
-
-#### **Edge Capacity**
 
 <br/>
-<br/>
+
+### **Edge Capacity**
+
 
 Achieve low latencies and bandwidth efficiency by reserving capacity locally.
 
@@ -139,13 +111,11 @@ Achieve low latencies and bandwidth efficiency by reserving capacity locally.
 
 ![Image](secure.png#medium)
 
-<br/>
-<br/>
-
-#### **Secure**
 
 <br/>
-<br/>
+
+### **Secure**
+
 
 Open-source system built from the ground-up for a fully transparent and auditable stack.
 
@@ -153,13 +123,11 @@ Open-source system built from the ground-up for a fully transparent and auditabl
 
 ![Image](scalable.png#medium)
 
-<br/>
-<br/>
-
-#### **Scalable**
 
 <br/>
-<br/>
+
+### **Scalable**
+
 
 An autonomous infrastructure that grows naturally with demand, where and when it is needed.
 
@@ -167,24 +135,26 @@ An autonomous infrastructure that grows naturally with demand, where and when it
 
 ![Image](effecient.png#medium)
 
-<br/>
-<br/>
-
-#### **Efficient**
 
 <br/>
-<br/>
+
+### **Efficient**
+
 
 A carefully designed collection of lightweight components that minimize overheads.
 
 {% end %}
 
-{% row(style="center narrow") %}
+
+
+{% row(style="center mbottom narrow") %}
 
 <button>[Learn More](https://library.threefold.me/info/threefold#/cloud/threefold__cloud_home)</button>
 
 {% end %}
 
+<!-- section 4 -->
+
 {% cloud_stats() %}
 
 ## A Global **Edge Infrastructure**

content/community/index.md

@@ -4,11 +4,9 @@ template: "page.html"
 insert_anchor_links: "left"
 ---
 
-<br>
-
 <!-- section 1 (THE FOLD) -->
 
-{% row(style="center narrow") %}
+{% row(style="center mtop narrow") %}
 
 ## Welcome Into <br> **The Fold**
 
@@ -23,11 +21,11 @@ We're a 100% open-source and community-driven project that builds the critical i
 {% end %}
 
 <br>
-<br>
+
 
 <!-- section 8 (IN THE NEWS) -->
 
-{% row(style="center between") %}
+{% row(style="center mtop between") %}
 
 [![forbes](forum.png)](https://forum.threefold.io/)
 
@@ -69,7 +67,7 @@ We're a 100% open-source and community-driven project that builds the critical i
 
 {% end %}
 
-{% row(style="center between") %}
+{% row(style="center mbottom between") %}
 
 [![cointelegraph](youtube.png)](https://www.youtube.com/threefoldfoundation)
 
@@ -85,11 +83,14 @@ We're a 100% open-source and community-driven project that builds the critical i
 
 <br>
 
-<br>
 
 <!-- section 4 (DEVELOPER COMMUNITY) -->
 
-{% row(bgColor="#f2f2f2" style="narrow margin") %}
+{% row(style="margin" bgColor="#f2f2f2") %}
+
+![Image](community_developers.png#medium)
+
+|||
 
 ## Join the ThreeFold <br> **Developer Community**
 
@@ -97,10 +98,6 @@ From testing our latest releases to joining our development teams or applying fo
 
 <button>[Developer Resources](/developer)</button>
 
-|||
-
-![Image](community_developers.png#medium)
-
 {% end %}
 
 <!-- section 6 (QUESTIONS) -->
@@ -116,8 +113,6 @@ Check out the FAQs or ask a question on the ThreeFold Forum.
 
 {% end %}
 
-<br>
-<br>
 
 {% community_banner() %}
 

content/developer/index.md

@@ -3,17 +3,15 @@ title: "Developers"
 template: "page.html"
 ---
 
-
-
 <!-- section 1 (header) -->
 
-{% row(style="center margin") %}
+{% row(style="margin semiNarrow reverse") %}
 
-## ThreeFold <br> **Developer** <br> **Resources**
+## ThreeFold <br> **Developer Resources**
 
 A builder’s manual for ThreeFold. Built <br> by visionaries, for visionaries.
 
-<button>[Join The Developer Community](https://t.me/threefoldtesting)</button>
+<button class="long-text">[Join The Developer Community](https://t.me/threefoldtesting)</button>
 
 |||
 
@@ -21,7 +19,7 @@ A builder’s manual for ThreeFold. Built <br> by visionaries, for visionaries.
 
 {% end %}
 
-<!-- section 4 (DEVELOPER RESOURCES) -->
+<!-- section 2 (DEVELOPER RESOURCES) -->
 
 {% dev_resourses() %}
 
@@ -31,27 +29,35 @@ A builder’s manual for ThreeFold. Built <br> by visionaries, for visionaries.
 
 {% end %}
 
+<!-- section 3 (TESTING GRANTS) -->
 
-{% row(bgColor="#f2f2f2" style="center between margin") %}
+{% row(bgColor="#f2f2f2" style="center margin") %}
 
 ## Our <br> **Developer Resources**
 
+<br>
+
 ThreeFold is here to build the open-source Internet and Cloud infrastructure. The documentation helps you <br> build on ThreeFold by introducing you to some foundational concepts as well as our development stacks.<br>
 Inspired by the open-source movement, everything at ThreeFold is open to be audited, extended and improved.<br> If you have any feedback, please reach out with a GitHub issue or on our telegram.
 
 <br>
 
-<button>[Explore Documentation](#table_link)</button>
-<button>[Offer Feedback](https://github.com/threefoldfoundation/info_threefold_pub/tree/main/wiki)</button>
+<button onclick="window.location.href='/developer#table_link'">
+
+[Explore Documentation](/developer#table_link)
+
+</button>
+<button>
+
+[Offer Feedback](https://github.com/threefoldfoundation/info_threefold_pub/tree/main/wiki)
+</button>
 
 {% end %}
 
-<br>
-<br>
 
-<!-- section 5 (TESTING GRANTS) -->
+<!-- section 4 (TESTING GRANTS) -->
 
-{% row() %}
+{% row(style="margin") %}
 
 ![Image](developet_tft.jpg)
 
@@ -67,8 +73,6 @@ All our docs are the results of community efforts. Create a pull request if you
 
 {% end %}
 
-<br>
-<br>
 
 <!-- section 6 (DOCUMENTATION) -->
 

content/farm/index.md

@@ -4,56 +4,29 @@ template: "page.html"
 insert_anchor_links: "left"
 ---
 
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
-
 <!-- section 1 (be the Internet) -->
 
-{% row(style="center narrow") %}
+{% row(style="center margin narrow") %}
 
 ## Be the **Internet**
 
 Become an Internet Farmer. Expand the ThreeFold Grid and earn for it.
 
-{% end %}
-
-{% row(style="center narrow") %}
+<br>
 
 <button>[Buy](https://marketplace.3node.global/)</button>
-
-|||
-
 <button>[D.I.Y.](https://library.threefold.me/info/threefold#/tfgrid/farming/threefold__diy_guide)</button>
-
-|||
-
 <button>[Learn](https://library.threefold.me/info/threefold#/tfgrid/farming/threefold__farming_intro)</button>
-
-|||
-
-<button>[Chat](https://t.me/threefoldfarmers)
+<button>[Chat](https://t.me/threefoldfarmers)</button>
 
 {% end %}
 
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
+
 
 <!-- section 2 (Farm) -->
 
-{% row(style="center narrow ") %}
+{% row(style="center mtop narrow ") %}
 
-<br>
-<br>
 
 ## Farm
 
@@ -65,7 +38,7 @@ Become an Internet Farmer. Expand the ThreeFold Grid and earn for it.
 
 <br>
 
-{% row(style="center") %}
+{% row(style="center mbottom") %}
 
 ![Image](plug_1.png#mx-auto)
 <br>
@@ -107,14 +80,14 @@ Every month, you earn TFT for keeping the 3Node connected to the network.
 
 <br>
 
-<button>[Explore ThreeFold Grid Capacity](https://dashboard.grid.tf/explorer/statistics)</button>
+<button class="text-sm lg:text-xl">[Explore ThreeFold Grid Capacity](https://dashboard.grid.tf/explorer/statistics)</button>
 
 
 {% end %}
 
-<!-- section 6 (How To Earn TFT) -->
+<!-- section 4 (How To Earn TFT) -->
 
-{% row(style="center narrow") %}
+{% row(style="center mtop narrow") %}
 
 
 ## How to earn **TFT**
@@ -129,7 +102,7 @@ Farmers earn TFT according to the amount of Internet capacity their 3Nodes conne
 
 {% end %}
 
-{% row(style="center") %}
+{% row(style="center mbottom") %}
 
 ![Image](farm_capacity.png#mx-auto)
 

content/footer/_index.md

@@ -18,7 +18,7 @@ extra:
 
 ###### [Buy the Token](https://library.threefold.me/info/threefold#/tokens/threefold__how_to_buy)
 
-###### [Start Farming](/farm)
+<h6><a href="" onclick="window.location.href='/farm'">Start Farming</a></h6>
 
 ###### [Farming Community](https://t.me/threefoldfarmers)
 
@@ -54,17 +54,18 @@ extra:
 
 <br>
 
-###### [ThreeFold](/mission)
+<h6><a href="" onclick="window.location.href='/mission'">ThreeFold</a></h6>
 
-###### [Partners](/partners)
 
-###### [Blog](/blog)
+<h6><a href="" onclick="window.location.href='/partners'">Partners</a></h6>
 
-###### [NewsRoom](/newsroom)
+<h6><a href="" onclick="window.location.href='/blog'">Blog</a></h6>
+
+<h6><a href="" onclick="window.location.href='/newsroom'">NewsRoom</a></h6>
 
 ###### [Forum](https://forum.threefold.io/)
 
-###### [Support](/support)
+<h6><a href="" onclick="window.location.href='/support'">Support</a></h6>
 
 
 {% end %}

content/grid/index.md

@@ -3,16 +3,9 @@ title: "Grid"
 template: "page.html"
 insert_anchor_links: "left"
 ---
+<!-- section 1  -->
 
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
-
-{% row(style="center narrow") %}
+{% row(style="center margin narrow") %}
 
 ## Internet **Evolution.**
 
@@ -20,27 +13,16 @@ insert_anchor_links: "left"
 
 The Internet was meant to be a peer-to-peer infrastructure with us in the center of our data and digital lives. Inspired by the past, we're building an Internet how "the" Internet was originally intended.
 
-{% end %}
-
-{% row(style="center narrow") %}
+<br>
 
 <button>[Discover the Grid](https://library.threefold.me/info/threefold#/tfgrid/threefold__grid_intro)</button>
-
-|||
-
 <button>[The Magic of the Tech](https://library.threefold.me/info/threefold#/technology/threefold__technology)</button>
 
 {% end %}
 
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
+<!-- section 2  -->
 
-{% row() %}
+{% row(style="margin") %}
 
 ![Image](grid_people.jpg)
 
@@ -55,10 +37,9 @@ Any current or future technology, including blockchain, metaverses and web 3.0,
 
 {% end %}
 
-<br>
-<br>
+<!-- section 3  -->
 
-{% row() %}
+{% row(style="margin reverse") %}
 
 ## Scaled by the People <br> **to the Edge**
 
@@ -72,11 +53,9 @@ The ThreeFold Grid is formed by Farmers, independent people who connect 3Nodes (
 
 {% end %}
 
+<!-- section 4  -->
 
-<br>
-<br>
-
-{% row() %}
+{% row(style="margin") %}
 
 ![Image](grid_new_internet.jpg)
 
@@ -89,11 +68,10 @@ All our code is made open source to energize open collaboration and promote univ
 {% end %}
 
 
-<br>
-<br>
+<!-- section 5 -->
 
 
-{% row(style="center narrow") %}
+{% row(style="center margin narrow") %}
 
 ![Image](zero_os.png#medium)
 
@@ -106,10 +84,9 @@ A decentralized autonomous operating system designed to dedicate hardware capaci
 
 {% end %}
 
-<br>
-<br>
+<!-- section 6  -->
 
-{% row() %}
+{% row(style="margin reverse") %}
 
 ## A Decentralized **Internet Economy**
 

content/header/index.md

@@ -10,7 +10,7 @@ extra:
 
 - [Mission]("/mission")
 - [Grid]("/grid")
-- [Build]("/cloud")
+- [Build]("/build")
 - [Farm]("/farm")
 - [TFT]("/tft")
 - Ecosystem

content/home/index.md

@@ -12,10 +12,8 @@ extra:
 
 <!-- section 1 (header) -->
 
-{% row(style="center narrow") %}
+{% row(style="center margin narrow") %}
 
-<br/>
-<br/>
 
 ![Image](black_threefold_header.png#mx-auto#medium)
 
@@ -25,22 +23,15 @@ extra:
 
 We are a global movement together building an open-source, community-driven, decentralized Internet – from the ground up.
 
-{% end %}
-
-{% row(style="center narrow") %}
+<br>
 
 <button>[Build](/cloud)</button>
-
-|||
-
 <button>[Get TFT](https://library.threefold.me/info/threefold#/tokens/threefold__how_to_buy)</button>
-
-|||
-
 <button>[TF Chat](https://t.me/threefold)</button>
 
 {% end %}
 
+
 <!-- section 2 (Map) -->
 
 
@@ -113,13 +104,11 @@ We are truly proud to be trusted by some of the biggest names in the industry.
 
 {% end %}
 
-<br>
 
-<br>
 
 <!-- section 7 (IN THE NEWS) -->
 
-{% row(style="center") %}
+{% row(style="center mtop") %}
 
 ## **In the News**
 

content/mission/index.md

@@ -6,45 +6,23 @@ insert_anchor_links: "left"
 
 <!-- section 1 (header) -->
 
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
 
-{% row(style="center narrow") %}
+{% row(style="center margin narrow") %}
 
 ## Our **Mission**
 
-<br>
 
 To build an open-source peer-to-peer Internet infrastructure that removes all forms of centralization from the global IT systems. Anything we do needs to improve the planet's situation and benefit the people around us.
 
-{% end %}
-
-{% row(style="center narrow") %}
+<br>
 
 <button>[Collective Dream](/blog/tf-grid-peoples-internet/)</button>
-
-|||
-
 <button>[Planet & People First](/blog/planet-first-people-first/)</button>
-
-|||
-
 <button>[Mission & Goals](https://mission.threefold.me)</button>
 
+
 {% end %}
 
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
 
 <!-- section 2 (INTERCONNECTED) -->
 
@@ -63,9 +41,9 @@ Internet access is a human right and it can change everything for the lives of p
 
 <!-- section 3 (SOVEREIGN) -->
 
-{% row(style="margin") %}
+{% row(style="margin reverse semiNarrow") %}
 
-## Empowering People **To Be Sovereign**
+## Empowering People <br> **To Be Sovereign**
 
 Create, store and share in full control of where your data resides and who can access it. By combining peer-to-peer, blockchain and autonomous technologies, the People’s Internet provides 100% data ownership and privacy.
 
@@ -79,15 +57,16 @@ Create, store and share in full control of where your data resides and who can a
 
 <!-- section 4 (OUR ACTIONS) -->
 
-{% row(gradient="linear-gradient(90deg,#70dfc9,#ea1ff7)" style="margin") %}
+{% row(style="margin semiNarrow" gradient="linear-gradient(90deg,#70dfc9,#ea1ff7)" ) %}
 
 ![Image](node_mission.png#medium)
 
 |||
 
-## Our Values Define **Our Actions**
+## Our Values Define <br>**Our Actions**
 
 The ThreeFold Law states that any good you do will return to you threefold in this lifetime. By making our technology actionable, we energize a collective approach towards a single mission – empowering humanity while regenerating our planet.
+
 {% end %}
 
 
@@ -102,7 +81,9 @@ Together, we build a better Internet for the planet, and for all of us.
 
 <br>
 
-![Image](100_mission.png#meduim)
+![Image](100_mission.png#meduim#mx-auto)
+
+<br>
 
 <button>[Join Us](/community)</button>
 
@@ -112,7 +93,7 @@ Together, we build a better Internet for the planet, and for all of us.
 
 <!-- section 6 (GETTING STARTED) -->
 
-{% row(style="center between") %}
+{% row(style="center margin between") %}
 
 ## We've Come A Long Way <br> **And We're Just Getting Started**
 
@@ -133,7 +114,7 @@ And we’re aiming for new heights. ThreeFold is turning into a DAO in 2022, inv
 
 <!-- section 7 (REVOLUTION) -->
 
-{% row(bgColor="#70dfc9" style="center narrow margin") %}
+{% row(bgColor="#70dfc9" style="center margin") %}
 
 ## Join the Internet <br> **(R)evolution**
 

content/tft/index.md

@@ -5,25 +5,15 @@ page_template: "tft_header.html"
 insert_anchor_links: "left"
 ---
 
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
-<br>
-
 <!-- section 1 (be the Internet) -->
 
-{% row(style="center narrow") %}
+{% row(style="center mtop narrow") %}
 
 ## Decentralizing <br>**the Internet Economy**
 
 ThreeFold creates an entirely new decentralized Internet economy that allows anyone to join the world’s fastest growing market – the Internet.
 
-{% end %}
-
-{% row(style="center narrow") %}
+<br>
 
 <button>[Learn About TFT](https://library.threefold.me/info/threefold#/tokens/threefold__tokens_home)</button>
 <button>[Get TFT](https://library.threefold.me/info/threefold#/tokens/threefold__how_to_buy)</button>
@@ -32,6 +22,7 @@ ThreeFold creates an entirely new decentralized Internet economy that allows any
 {% end %}
 
 
+
 {% tft_header() %}
 
 ## **DECENTRALIZING <br>THE INTERNET ECONOMY**
@@ -42,10 +33,7 @@ ThreeFold creates an entirely new decentralized Internet economy that allows any
 
 <!-- section 2 (Meeting Emerging Demand) -->
 
-{% row(style="center ") %}
-
-<br>
-<br>
+{% row(style="center mtop ") %}
 
 ## Meeting **Emerging Demand**
 
@@ -54,7 +42,7 @@ Data has become the most valuable commodity on earth, the Internet infrastructur
 
 {% end %}
 
-{% row(style="center") %}
+{% row(style="center mbottom") %}
 
 ![Image](tft_125zb.png#medium)
 
@@ -77,12 +65,6 @@ That is a number with 21 zeroes!
 {% end %}
 
 
-<br>
-
-<br>
-
-
-
 <!-- section 3 (world of farmers) -->
 
 {% row(style="center between margin") %}
@@ -98,7 +80,7 @@ While many projects have created bits and pieces of what a decentralized Interne
 
 ![Image](tft_table.png#mx-auto)
 
-<button>[How ThreeFold Compares With The Industry ](/blog/2021/10/post-7)</button>
+<button class="long-text text-xs lg:text-xl">[How ThreeFold Compares With The Industry ](/blog/2021/10/post-7)</button>
 
 
 {% end %}
@@ -106,7 +88,7 @@ While many projects have created bits and pieces of what a decentralized Interne
 
 <!-- section 4 (THE CURRENCY) -->
 
-{% row(gradient="linear-gradient(180deg,#ea1ff7,#70dfc9)" style="margin") %}
+{% row(gradient="linear-gradient(180deg,#ea1ff7,#70dfc9)" style="margin semiNarrow") %}
 
 ![Image](tft_currency.png#medium#absolute#sm_none)
 
@@ -120,16 +102,11 @@ TFT is a utility token that allows people to hold current and future Internet ca
 
 {% end %}
 
-<br>
-
-<br>
-
-<br>
 
 
 <!-- section 5 (OPEN NETWORK) -->
 
-{% row(style="center narrow") %}
+{% row(style="center narrow mtop") %}
 
 
 ## Open **Network**
@@ -138,7 +115,9 @@ TFT is a utility token that allows people to hold current and future Internet ca
 
 {% end %}
 
-{% row(style="center") %}
+<br>
+
+{% row(style="center mbottom") %}
 
 <!-- | Proof-Of-Capacity     |  |Proof-Of-Utilization  |
 | ----------- | ----------- | ----------- |
@@ -166,7 +145,7 @@ People buy TFT to store data and run applications privately on a peer-to-peer In
 <!-- section 6 (OPEN NETWORK) -->
 
 
-{% row(style="margin") %}
+{% row(style="margin reverse semiNarrow") %}
 
 ## Loyalty **Rewards**
 
@@ -185,7 +164,7 @@ The ThreeFold blockchain automatically scans wallets and provides up-to 60% disc
 <!-- section 7 (OPEN NETWORK) -->
 
 
-{% row(style="margin") %}
+{% row(style="margin semiNarrow") %}
 
 ![Image](tft_utility.jpg)
 
@@ -202,9 +181,9 @@ TFT is minted only when new Internet capacity is added to the ThreeFold Grid. A
 <!-- section 8 (BURN AND FARM) -->
 
 
-{% row(style="margin") %}
+{% row(style="margin reverse semiNarrow") %}
 
-## Burn and Farm **Equilibrium**
+## Burn and Farm <br>**Equilibrium**
 
 Burning permanently removes TFT from the circulating supply when the ThreeFold Grid gets used. It ensures a positive impact on pricing while ensuring rewards for all current and future nodes.
 
@@ -220,7 +199,7 @@ Burning permanently removes TFT from the circulating supply when the ThreeFold G
 
 <!-- section 9 (partners) -->
 
-{% row(style="center") %}
+{% row(style="center mtop") %}
 
 ## Join the **Movement**
 
@@ -234,25 +213,15 @@ Get TFT today and participate in the realization of a truly decentralized world.
 
 {% end %}
 
-{% row(style="lean") %}
+{% row(style="lean mbottom") %}
 
 ![Image](tft_join_internet.png#mx-auto)
 
-
-
 {% end %}
 
-
-<br>
-
-<br>
-
-<br>
-
-
 <!-- section 10 (partners) -->
 
-{% row(style="center") %}
+{% row(style="center margin") %}
 
 ## **Believers in TFT**
 

css/index.css

@@ -217,6 +217,13 @@ button a {
   px-12
 }
 
+.long-text a{
+  padding-left: 2rem;
+  padding-right: 2rem;
+  --tw-text-opacity: 1;
+  color: rgb(0 0 0 / var(--tw-text-opacity));
+}
+
 a {
   border-width: 0px;
 }

static/js/custom.js

@@ -4,6 +4,19 @@ var hamburgerShown = false;
 let width = screen.width;
 var isMobile = width < 1024;
 
+function readingTime() {
+    let articles = document.querySelectorAll(".article");
+    let times = document.querySelectorAll(".time");
+    const wpm = 225;
+    let words;
+    for (var i = 0; i < articles.length; i++) {
+        words = articles[i].innerText.trim().split(/\s+/).length;
+        let time = Math.ceil(words / wpm);
+        times[i].innerText = `${time} minute read`
+    }
+}
+readingTime()
+
 function toggleMenu(button) {
     if (displayedMenu === button.id.split("-")[0]) {
         button.className = button.className.replace(" text-gray-800 bg-stone-200 sm:bg-transparent", " text-gray-900");

templates/_default/base.html

@@ -36,7 +36,6 @@
     for (var i = 0, linksLength = links.length; i < linksLength; i++) {
         if (!internal_hosts.includes(links[i].hostname)) {
             links[i].target = '_blank';
-            console.log(links[i])
         }
     }
   </script>

templates/blogPage.html

@@ -2,48 +2,32 @@
 {% block content %}
 
 {% if page.taxonomies.people %}
-    {% set people = get_section(path="people/_index.md") %}           
-    {% set pages_str = people.pages | json_encode() | as_str %}
-    {% if pages_str is containing(page.taxonomies.people[0]) %}
-        {% set author_path = 'people/' ~ page.taxonomies.people[0] ~ '/index.md' %}
-        {% set author = get_page(path=author_path) %}
-    {% endif %}
+{% set people = get_section(path="people/_index.md") %}
+{% set pages_str = people.pages | json_encode() | as_str %}
+{% if pages_str is containing(page.taxonomies.people[0]) %}
+{% set author_path = 'people/' ~ page.taxonomies.people[0] ~ '/index.md' %}
+{% set author = get_page(path=author_path) %}
+{% endif %}
 {% endif %}
 
 <!-- Default page template for blog posts and basic informative markdown files -->
 
 {% set split = page.content | split(pat="threefold.io") %}
-{% if split | length < 2 %}
-    {% set content = page.content %}
-{% else %}
-    {% set content = "" %}
-    {% for part in split %}
-        {% if part is starting_with("/blog") %}
-            {% set split_part = part | split(pat='/">') %}
-            {% set link = split_part[0] %}
-            {% set link = link | replace(from="/blog/post", to="/blog") %}
-            {% set link = link | replace(from="_", to="-") %}
-            {% set rest_part = split_part | slice(start=1) | join(sep='/">') %}
-            {% set part = link ~ '/">' ~ rest_part %}
-        {% endif %}
-        {% if loop.first %}
-            {% set_global content = part%}
-        {% else %}
-            {% set_global content = content ~ "threefold.io" ~ part%}
-        {% endif %}
-    {% endfor %}
-{% endif %}
-
-
-<main>
+{% if split | length < 2 %} {% set content=page.content %} {% else %} {% set content="" %} {% for part in split %} {% if
+  part is starting_with("/blog") %} {% set split_part=part | split(pat='/">' ) %} {% set link=split_part[0] %} {% set
+  link=link | replace(from="/blog/post" , to="/blog" ) %} {% set link=link | replace(from="_" , to="-" ) %} {% set
+  rest_part=split_part | slice(start=1) | join(sep='/">' ) %} {% set part=link ~ '/">' ~ rest_part %} {% endif %} {% if
+  loop.first %} {% set_global content=part%} {% else %} {% set_global content=content ~ "threefold.io" ~ part%} {% endif
+  %} {% endfor %} {% endif %} <main>
 
   <div class="container mx-auto mt-10">
 
     <div>
-      <article id="article" class="article lg:w-4/6 mx-auto">
+      <article class="article lg:w-4/6 mx-auto">
         <h1 class="lg:text-5xl font-medium leading-none mt-0  text-gray-700">
           {{ page.title }}
         </h1>
+
         <h4 class="text-2xl text-gray-600 leading-8">
           {{ page.description }}
         </h4>
@@ -52,9 +36,10 @@
             <div class="flex justify-between items-center">
               <ul class="list-none flex author-list m-0">
                 <li class="author-list-item">
-                {% if author %}
-                {% set author_img = get_url(path='/' ~ author.relative_path | replace(from='_', to='-') | replace(from='index.md', to=author.extra.imgPath)) %}
-                <img src="{{author_img}}" alt="{{author.title}}" class="
+                  {% if author %}
+                  {% set author_img = get_url(path='/' ~ author.relative_path | replace(from='_', to='-') |
+                  replace(from='index.md', to=author.extra.imgPath)) %}
+                  <img src="{{author_img}}" alt="{{author.title}}" class="
                         h-8
                         w-8
                         sm:h-10
@@ -69,22 +54,22 @@
             </div>
 
             <div class="pl-3 flex flex-col text-xs leading-none uppercase">
-                {% if author %}
+              {% if author %}
               <a href="{{author.permalink}}" class="text-gray-700 text-xs">{{ author.title }}</a>
-            {% endif %}
+              {% endif %}
               <p class="text-gray-700 text-xs">
-                <time datetime="{{ page.date }}"> {{ page.date | date(format="%B %e, %Y", timezone="America/Chicago") }}</time>
+                <time datetime="{{ page.date }}"> {{ page.date | date(format="%B %e, %Y", timezone="America/Chicago")
+                  }}</time>
               </p>
             </div>
 
           </div>
           <div class="my-2 sharethis-inline-share-buttons"></div>
         </section>
-        {% set img_url = get_url(path='/' ~ page.relative_path | replace(from='_', to='-') | replace(from='index.md', to=page.extra.imgPath)) %}
+        {% set img_url = get_url(path='/' ~ page.relative_path | replace(from='_', to='-') | replace(from='index.md',
+        to=page.extra.imgPath)) %}
         <img class="mb-8 mx-auto" src={{img_url}} alt="{{page.title ~ 'Picture'}}">
-        <div id="article">{{ content | safe }}</div>
-
-
+        <div>{{ content | safe }}</div>
         <section class="post-tags container relative py-10">
           {% for tag in page.taxonomies.tags %}
           {% set fullpath = "/tags/" ~ tag | replace(from='_', to='-' ) %}
@@ -109,6 +94,6 @@
 
 
   </div>
-</main>
+  </main>
 
-{% endblock content %}
+  {% endblock content %}

templates/partials/postCard.html

@@ -1,17 +1,19 @@
 {% if post.date %}
 {% if post.taxonomies.people %}
-    {% set people = get_section(path="people/_index.md") %}           
-    {% set pages_str = people.pages | json_encode() | as_str %}
-    {% if pages_str is containing(post.taxonomies.people[0]) %}
-        {% set author_path = 'people/' ~ post.taxonomies.people[0] ~ '/index.md' %}
-        {% set author = get_page(path=author_path) %}
-    {% endif %}
+{% set people = get_section(path="people/_index.md") %}
+{% set pages_str = people.pages | json_encode() | as_str %}
+{% if pages_str is containing(post.taxonomies.people[0]) %}
+{% set author_path = 'people/' ~ post.taxonomies.people[0] ~ '/index.md' %}
+{% set author = get_page(path=author_path) %}
+{% set content = get_page(path=author_path) %}
+{% endif %}
 {% endif %}
 
 <div class="flex flex-col rounded-lg shadow-lg overflow-hidden">
   <div class="flex-1 border-b">
     <a href="{{ post.permalink }}" class="block">
-    {% set img_url = get_url(path='/' ~ post.relative_path | replace(from='_', to='-') | replace(from='index.md', to=post.extra.imgPath)) %}
+      {% set img_url = get_url(path='/' ~ post.relative_path | replace(from='_', to='-') | replace(from='index.md',
+      to=post.extra.imgPath)) %}
       <div class="flex-shrink-0">
         <img class="h-48 w-full mx-auto object-cover" src={{img_url}} alt="{{post.title ~ ' Picture'}}" />
       </div>
@@ -25,39 +27,47 @@
           {{ post.description }}
         </p>
         {% endif %}
+        <div class="article hidden">{{ post.content | safe }}</div>
+
+        <div class="w-full post-card-meta py-3">
+          <div class="avatars">
+            <div class="flex">
+              <div class="flex">
+                <ul class="list-none flex author-list mr-2 pl-0">
+                  {% if author %}
+                  {% set author_img = get_url(path='/' ~ author.relative_path | replace(from='_', to='-') |
+                  replace(from='index.md', to=author.extra.imgPath)) %}
+                  <li class="author-list-item"><img alt="{{author.title}}" src="{{author_img}}"
+                      class="w-8 h-8 rounded-full bg-gray-200 border-2 border-white"></li>
+                  {% endif %}
+                </ul>
+              </div>
+              <div class="flex flex-col text-left leading-none uppercase">
+                {% if author %}
+                <p class="text-gray-700 text-xs">{{ author.title }}</p>
+                {% endif %}
+                <p class="text-gray-700 text-xs">
+                  <time datetime="{{post.date}}">
+                    {{ post.date | date(format="%B %e, %Y", timezone="America/Chicago") }}
+                  </time>
+                </p>
+                <p class="flex justify-between lowercase my-2 items-center text-gray-700 text-xs"><span id="time"
+                    class="time"></span>
+                </p>
+              </div>
+              <br />
+            </div>
+          </div>
+        </div>
     </a>
   </div>
-  <div class="w-full post-card-meta py-3">
-    <div class="avatars">
-      <div class="flex items-center">
-        <div class="flex justify-between items-center">
-          <ul class="list-none flex author-list mr-2">
-            {% if author %}
-                {% set author_img = get_url(path='/' ~ author.relative_path | replace(from='_', to='-') | replace(from='index.md', to=author.extra.imgPath)) %}
-                <li class="author-list-item"><img alt="{{author.title}}" src="{{author_img}}"
-                    class="w-8 h-8 rounded-full bg-gray-200 border-2 border-white"></li>
-            {% endif %}
-          </ul>
-        </div>
-        <div class="flex flex-col text-left leading-none uppercase">
-            {% if author %}
-          <p class="text-gray-700 text-xs">{{ author.title }}</p>
-          {% endif %}
-          <p class="text-gray-700 text-xs">
-          <time datetime="{{post.date}}">
-            {{ post.date | date(format="%B %e, %Y", timezone="America/Chicago") }}
-            </time>
-        </p>
-    </div>
-</div>
-</div>
-</div>
+
 </div>
 </div>
 
 <style>
-    .border-b {
-        border-bottom-width: 1px !important;
-    }
+  .border-b {
+    border-bottom-width: 1px !important;
+  }
 </style>
 {% endif %}

templates/shortcodes/cloud_stats.html

@@ -7,20 +7,20 @@
 {% endif %}
 
 {% if data %}
-<div class="lg:py-20 py-10 sm:pt-16">
+<div class="lg:py-24 py-10 sm:pt-10">
   <div class="mx-auto px-4 sm:px-6 lg:px-8">
     <div class="lg:max-w-xl mx-auto text-center">
       <h2 class="
             
           lg:text-6xl
           text-center
-          uppercase
+          capitalize
           my-2
           leading-none
-          font-normal font-heading
+          font-light 
         
           ">
-        A GLOBAL EDGE INFRASTRUCTURE
+        A Global Edge <br><span class="font-medium"> Infrastructure</span>
       </h2>
     </div>
   </div>
@@ -158,7 +158,8 @@
             bg-white
             text-lg
             learn-button
-            hover:bg-gray-400
+            text-gray-700
+            hover:text-gray-500
             bo
             px-12
             py-1

templates/shortcodes/community_banner.html

@@ -1,9 +1,9 @@
 {% block content %}
 
 <div class="relative flex flex-col lg:flex-row items-baseline -mx-8 sm:-mx-12 md:-mx-16 lg:-mx-20">
-    {% set url = page.permalink ~ "careers" %}
+    {# {% set url = page.permalink ~ "careers" %} #}
 
-    <a href="{{url}}" class="section banner">
+    <a href="careers" class="section banner">
         <div class="center">
             <h2 class="h1">
                 <strong>Join our Team</strong>

templates/shortcodes/dev_resourses.html

@@ -10,10 +10,10 @@
 {% set url = '' %}
 {% endif %}
 
-<div class="my-5 lg:my-40 lg:mx-40 mx-4">
+<div class="my-5 lg:py-24 py-10 lg:mx-28 mx-4">
     <div class="w-full text-center">
-        <h2 class="lg:text-6xl uppercase font-normal leading-tight">
-            WHERE WOULD YOU LIKE TO START?
+        <h2 class="lg:text-6xl capitalize font-normal leading-tight">
+            where would you like to start?
         </h2>
         <div class="max-w-4xl mb-10 py-2 text-xl mx-auto leading-tight tracking-wide">ThreeFold's open-source
             infrastructure has been built from the ground up on the Linux Kernel to create a fully decentralized

templates/shortcodes/featured_stories.html

@@ -1,4 +1,4 @@
-<div class="relative pt-16 px-4 sm:px-6 lg:py-28 lg:pb-28 lg:px-8">
+<div class="relative px-4 sm:px-6 py-12 lg:py-28 lg:px-8">
     <div class="absolute inset-0">
         <div class="bg-white h-1/3 sm:h-2/3"></div>
     </div>

templates/shortcodes/grid_stats.html

@@ -8,8 +8,8 @@
 {% endif %}
 
 {% if data %}
-<section class="px-2 h-auto bg-center bg-cover bg-no-repeat" style="{{styles}}">
-    <div class="flex flex-wrap lg:p-12 text-center -mx-auto">
+<section class="px-2 h-auto bg-center lg:py-28 p-12 bg-cover bg-no-repeat" style="{{styles}}">
+    <div class="flex flex-wrap text-center -mx-auto">
         <div class="text-center rounded lg:px-6 mt-10 lg:mt-0 mx-auto">
             {{body | markdown | safe }}
 

templates/shortcodes/jobs.html

@@ -39,7 +39,8 @@
                 text-lg
                 learn-button
                 hover:bg-gray-400
-                px-12
+                lg:px-12
+                px-6
                 py-1
                 mr-5
                 my-4
@@ -77,7 +78,8 @@
                 text-lg
                 learn-button
                 hover:bg-gray-400
-                px-12
+                lg:px-12
+                px-6
                 py-1
                 mr-5
                 my-4
@@ -115,7 +117,8 @@
                 text-lg
                 learn-button
                 hover:bg-gray-400
-                px-12
+                lg:px-12
+                px-6
                 py-1
                 mr-5
                 my-4
@@ -153,7 +156,8 @@
                 text-lg
                 learn-button
                 hover:bg-gray-400
-                px-12
+                lg:px-12
+                px-6
                 py-1
                 mr-5
                 my-4
@@ -191,7 +195,8 @@
                 text-lg
                 learn-button
                 hover:bg-gray-400
-                px-12
+                lg:px-12
+                px-6
                 py-1
                 mr-5
                 my-4

templates/shortcodes/row.html

@@ -42,7 +42,7 @@ Parameters:
 
 <!-- Splits body to columns -->
 {% set columns = body | safe | markdown | split(pat="|||") %}
-{% set row_class =  "relative pt-6 p-4 flex flex-col sm:grid sm:grid-cols-2 sm:gap-10 xl:flex xl:flex-row"%}
+{% set row_class =  "relative lg:p-4 p-1 flex flex-col sm:grid sm:grid-cols-2 sm:gap-10 xl:flex xl:flex-row"%}
 
 <!-- aligns columns depending on col number-->
 {% if 2 < columns | length %}
@@ -51,7 +51,7 @@ Parameters:
     {% set row_class = row_class ~ " lg:items-center" %}
 {% endif %}
 
-{% set col_class = "flex-1 mb-8 md:mb-0 md:mx-8" %}
+{% set col_class = "flex-1 mb-6 md:mb-0 md:mx-8" %}
 {% set row_id = '' %}
 
 {% if id %}
@@ -59,6 +59,7 @@ Parameters:
 
 {% endif %}
 
+
 {% if style %}
 
     {% if "center" in style %}
@@ -70,9 +71,25 @@ Parameters:
     {% set row_class = row_class ~ " text-white" %}
     {% endif %}
 
+    <!-- reverse col at mobile -->
+
+    {% if "reverse" in style %}
+    {% set row_class = "flex flex-col-reverse md:flex-row items-center" %}
+    {% endif %}
+
     <!-- makes row with margins -->
     {% if "margin" in style %}
-        {% set row_class = row_class ~ " lg:py-28 sm:p-12 md:p-16 lg:p-20" %}
+        {% set row_class = row_class ~ " lg:py-28 py-10" %}
+        {% set col_class = col_class ~ " flex-1 m-4 lg:m-0" %}
+    {% endif %}
+
+    {% if "mtop" in style %}
+        {% set row_class = row_class ~ " lg:pt-28 pt-10" %}
+        {% set col_class = col_class ~ " flex-1 m-4 lg:m-0" %}
+    {% endif %}
+
+    {% if "mbottom" in style %}
+        {% set row_class = row_class ~ " lg:pb-28" %}
         {% set col_class = col_class ~ " flex-1 m-4 lg:m-0" %}
     {% endif %}
 
@@ -84,7 +101,7 @@ Parameters:
 
      <!-- makes row semi-full screen width, strips margins -->
      {% if "between" in style %}
-     {% set row_class = row_class ~ " lg:max-w-6xl" %}
+     {% set row_class = row_class ~ " lg:max-w-6xl mx-auto" %}
  {% elif "moderate" in style %}
      {% set row_class = row_class ~ " lg:m-20" %}
  {% endif %}
@@ -96,6 +113,12 @@ Parameters:
         {% set row_class = row_class ~ " lg:m-20" %}
     {% endif %}
 
+    {% if "semiNarrow" in style %}
+     {% set row_class = row_class ~ " lg:px-20 mx-auto" %}
+ {% elif "moderate" in style %}
+     {% set row_class = row_class ~ " lg:m-20" %}
+ {% endif %}
+
 {% endif %}
 
 <!-- makes row full screen width and adds background img -->
@@ -106,11 +129,11 @@ Parameters:
 {% endif %}
 {% if bgColor %}
     {% set styles = "background-color: " ~ bgColor ~ "; background-size: cover"  %}
-    {% set row_class = row_class ~ "w-screen -mx-8 sm:-mx-12 md:-mx-16 lg:-mx-20" %}
+    {% set row_class = row_class ~ " w-auto -mx-4 sm:-mx-12 md:-mx-16 lg:-mx-20" %}
 {% endif %}
 {% if gradient %}
     {% set styles = "background: " ~ gradient ~ "; background-size: cover"  %}
-    {% set row_class = row_class ~ "w-screen -mx-8 sm:-mx-12 md:-mx-16 lg:-mx-20" %}
+    {% set row_class = row_class ~ " w-auto -mx-4 sm:-mx-12 md:-mx-16 lg:-mx-20" %}
 {% endif %}
 
 {% set url = body | split(pat="href=") | slice(start=1) | first | split(pat=">") | first | trim_start_matches(pat='"') %}

templates/shortcodes/team_sec.html

@@ -1,8 +1,8 @@
-<div class="lg:my-32 flex flex-col mt-5 p-auto lg:px-20">
+<div class="lg:py-24 flex flex-col my-6 p-auto lg:px-20">
     <h2 class="flex py-2 mx-auto font-normal 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
+    <div class="lg:max-w-4xl lg:text-xl text-lg 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>

templates/shortcodes/tft_header.html

@@ -1,8 +1,8 @@
 {% block content %}
 
 <div
-    class="relative pt-12 flex flex-col sm:grid sm:grid-cols-2 sm:gap-10 xl:flex xl:flex-row md:py-2 lg:py-2 lg:items-center text-center mx-auto justify-center">
-    <a class="center" href="https://coinmarketcap.com/currencies/threefold/" target="_blank">
+    class="relative lg:pb-24 pb-10 flex flex-col sm:grid sm:grid-cols-2 sm:gap-10 xl:flex xl:flex-row md:py-2 lg:py-2 lg:items-center text-center mx-auto justify-center">
+    <a class="center pb-4 lg:pb-0" href="https://coinmarketcap.com/currencies/threefold/" target="_blank">
         {% set link = page.permalink ~ "cointelegraph_logo.png"%}
         <img class="logo_size mx-auto" src="{{link}}" alt="cointelegraph">
     </a>

templates/shortcodes/tft_links.html

@@ -9,13 +9,13 @@
     href="https://library.threefold.me/info/threefold#/tokens/threefold__tft_stellar_dex"
     target="_blank">
     {% set link = page.permalink ~ "stellar_logo.png"%}
-    <img class="py-2 mr-2 px-5 border-2 border-black" src="{{link}}" alt="stellar">
+    <img class="py-2 mr-2 my-2 px-5 border-2 border-black" src="{{link}}" alt="stellar">
 </a>
     <a class="center"
         href="https://pancakeswap.finance/swap?exactField=output&exactAmount=100&outputCurrency=0x8f0FB159380176D324542b3a7933F0C2Fd0c2bbf&inputCurrency=0xe9e7cea3dedca5984780bafc599bd69add087d56?use=v2"
         target="_blank">
         {% set link = page.permalink ~ "pancack_button.png"%}
-        <img class="py-2 mr-2 px-5 border-2 border-black" src="{{link}}" alt="pancakeswap">
+        <img class="py-2 mr-2 my-2 px-5 border-2 border-black" src="{{link}}" alt="pancakeswap">
     </a>
     <a class="center" href="https://app.1inch.io/#/56/swap/BNB/TFT" target="_blank">
         {% set link = page.permalink ~ "iinch_button.png"%}