Merge pull request #381 from threefoldfoundation/development

Recent changes: blog updates, people, grid stats, etc.

content/blog/solar_comparison/index.md

@@ -30,6 +30,8 @@ By installing solar panels on rooftops or creating local solar farms, individual
 
 This localized energy production model enhances sustainability by tapping into an inexhaustible natural resource and encourages a more environmentally conscious and self-sufficient society. It signifies a move away from the centralized, traditional systems of energy production, returning power to the people and prioritizing the planet's well-being.
 
+![Image](solar.png#mx-auto)
+
 ### **ThreeFold: Pioneering a Decentralized Digital Future**
 
 Parallel to the energy sector's evolution, the digital world is also undergoing a transformation, led by innovative platforms like ThreeFold. Just as decentralized solar energy provides an alternative to the centralized power generation model, ThreeFold is reshaping the cloud computing landscape with its autonomous edge cloud.
@@ -38,9 +40,6 @@ Parallel to the energy sector's evolution, the digital world is also undergoing
 
 ThreeFold's model deviates from the norm, where cloud services are dominated by a few massive data centers. Instead, we depend on our global network of independent nodes set up by individuals and businesses to contribute their own computing and storage resources to the cloud. This approach democratizes access to cloud resources, bolstering data privacy, security, and resilience against potential outages or cyberattacks.
 
-<br>
-
-![Image](solar.png#mx-auto)
 
 <br>
 
@@ -48,4 +47,8 @@ Beyond merely disrupting the existing model, ThreeFold aims to foster a more sus
 
 <br>
 
+![Image](data_center.png#mx-auto)
+
+<br>
+
 Both the shift towards decentralized solar energy and ThreeFold's revolutionary approach to cloud computing reflect a broader movement towards decentralization. This movement is not just about bringing alternatives to existing systems but about creating a more inclusive, resilient, and sustainable future for all.

content/blog/three_layers/index.md

@@ -13,40 +13,63 @@ extra:
     isFeatured: true
 ---
 
-The Internet is complex and multi-layered, touching virtually every aspect of our modern lives. At its core, it comprises three essential layers: compute & storage, network, and application. Understanding these components is key to grasping how digital information is processed, stored, and accessed across the globe.
+Just as the Earth is made up of layers—from the crust to the core—so too is the Internet, with three key layers: compute & storage, network and applications. Distinguishing these layers is necessary in order to understand how digital information is currently processed, stored, and accessed across the globe and how this system will change with ThreeFold’s disruptive technology. ThreeFold is like tectonic forces, reshaping the landscape by introducing new ways for these layers to interact. Let’s break down these three components and how ThreeFold is altering them. 
+
+### **Compute & Storage**
+
+**What is Compute:**
+<br>
+The compute layer is responsible for processing data. It involves the execution of programs and applications by leveraging computational resources like CPUs (Central Processing Units) and GPUs (Graphics Processing Units). This layer handles the calculations, logic, and running of software that users and businesses depend on. Compute resources are provided by servers located in centralized data centers and cloud platforms.
 
 <br>
 
-This blog post will explore these foundational aspects of the Internet and share insights into ThreeFold's journey in reshaping the global Cloud & Internet infrastructure.
-
-### **The Three Layers of the Internet**
-
-Understanding the three fundamental layers of the Internet’s architecture is crucial to grasping how digital services are delivered to end-users around the globe. Let's break down these components:
-
-#### **Compute & Storage**
-
-Compute is the powerhouse of the Internet, providing the necessary processing power to run the various software applications and services that populate the Internet. This involves everything from simple web hosting to complex computational tasks like data analysis and artificial intelligence. In essence, it's the brain behind the operations, turning code into action. Compute resources are provided by servers located in data centers, cloud platforms, and increasingly, decentralized networks.
+**What is Storage:**
+<br>
+The storage layer is concerned with saving and retrieving data. It provides a persistent way to store data so that it can be accessed in the future. This layer encompasses various types of storage media, such as hard drives (HDDs), solid-state drives (SSDs), and even distributed storage systems that span across multiple locations. The storage layer ensures that data is kept safe and available for when it's needed, either for immediate use by applications in the compute layer or for long-term retention.
 
 <br>
 
-Storage acts as the Internet's memory, a space where data is securely kept for future access. This includes everything from your personal photos and documents to the databases that store website content and user information. Efficient and reliable storage solutions are vital for keeping the Internet's vast amount of information organized and accessible.
+**The ThreeFold model:**
+<br>
+ThreeFold decentralizes computing power and storage by distributing it across a global network of independent nodes rather than concentrating it in large data centers. This approach allows anyone to contribute compute and storage to the network or utilize it for their own applications. In essence, anyone can become a cloud provider. ThreeFold’s autonomous technology ensures efficient allocation of compute resources, increasing performance and reliability while reducing energy consumption. The distributed storage system ensures data is fragmented and securely stored across multiple locations. Data privacy and security is enhanced as there is no single point of failure or central repository for attackers to target. Moreover, data is stored closer to the end-user, which can reduce latency and improve access speeds. The storage system is designed to be highly scalable, ensuring users can store and access vast amounts of data efficiently.
 
-#### **Network**
+<br>
 
-The network is the Internet's circulatory system, consisting of the physical and virtual connections that enable data to flow from one point to another. This includes the cables, satellites, routers, and protocols that transport information across the globe, ensuring that an email or a video call can reach its destination in milliseconds.
+ThreeFold’s operating system, Zero-OS, underpins the compute & storage layer. It abstracts the complexities of managing distributed resources, offering a simplified and efficient way to leverage the underlying hardware for computing and storage needs.
 
-#### **Applications**
+![Image](compute.png#mx-auto)
+
+### **Network**
+**What is Network:**
+The network layer of the Internet is responsible for routing data packets from their source to their destination across multiple networks. It operates on protocols like IP (Internet Protocol), which assigns unique addresses to devices on the Internet to ensure data reaches the correct location. The network layer handles the path selection and directs packets through various routers and networks to reach its destination. This layer is crucial for enabling communication between devices in different networks, ensuring data integrity and efficient delivery across the vast expanse of the Internet.
+
+<br>
+
+**The ThreeFold model:**
+<br>
+ThreeFold is revolutionizing the network layer through its creation of Mycelium, a true peer-to-peer mesh network. It is the only overlay network in the world which is capable of taking locality into consideration, routing decisions based on proximity between peers, and taking the quickest route possible. All traffic is end-to-end encrypted and each logical network interface is linked to a private key. Mycelium represents a fundamentally new approach to dealing with network security and provides an ‘always on’ network. 
+
+![Image](network.png#mx-auto)
+
+### **Applications**
+**What are Applications:**
+
+<br>
 
 At the top of the Internet stack are applications — the user-facing software that provides the services and experiences we interact with daily. Applications range from web browsers and social media to more complex systems like blockchain platforms and decentralized apps (dApps). They are the interface through which users interact with the digital world.
 
-### **Blockchain's Place in the Application Layer**
+<br>
 
 Blockchain technology, known for its decentralized and secure nature, resides within the application layer of the Internet. It offers a revolutionary approach to conducting transactions, managing data, and establishing trust online, offering a level of security, transparency, and efficiency previously unattainable with traditional centralized systems. As a part of the application layer, blockchain applications leverage the underlying compute, storage, and network infrastructure to operate efficiently and securely. The full blockchain landscape can run on top of ThreeFold’s Internet stack.
 
-### **ThreeFold Today: Focusing on Compute and Storage**
+<br>
 
-At ThreeFold, we're committed to enhancing the foundational layers of the Internet, with a particular focus to date on compute and storage. Our journey has been driven by the belief that decentralizing these components can lead to a more secure, efficient, and equitable digital world. By distributing compute power and storage capacity across a global network, we aim to reduce reliance on centralized data centers, mitigate privacy and security risks, and lower the environmental impact of digital infrastructure.
+**The ThreeFold model:**
 
-### **The Road Ahead: Expanding to Connectivity**
+<br>
 
-Looking to the future, ThreeFold plans to integrate advanced connectivity solutions into our ecosystem. Recognizing the importance of robust network infrastructure, we're dedicated to improving bandwidth and reducing latency to ensure seamless access to digital services for everyone, everywhere. This expansion is not only about enhancing Internet performance but also about empowering blockchain applications and other innovations that depend on strong connectivity to thrive.
+On the applications front, ThreeFold facilitates the development and deployment of decentralized applications (dApps) through its ecosystem. This is made possible by providing developers with access to decentralized compute, storage, and networking resources. The platform's focus on autonomy and decentralization encourages the creation of applications that are inherently more secure, private, and resilient to failures.
+
+![Image](applications.png#mx-auto)
+
+In summary, ThreeFold is reshaping the digital ecosystem by decentralizing and democratizing access to essential IT resources. Its approach not only promises to enhance privacy, security, and efficiency but also aims to foster a more sustainable and equitable digital world.

content/footer/_index.md

@@ -18,7 +18,7 @@ extra:
 
 ###### [Host (Farm)](/host)
 
-###### [Dashboard](https://next.dashboard.grid.tf/)
+###### [Dashboard](https://dashboard.grid.tf/)
 
 ###### [Download TF Connect: iOS](https://apps.apple.com/us/app/3bot-login/id1459845885)
 

content/host/index.md

@@ -150,7 +150,7 @@ The ThreeFold Dashboard is today's go-to-interface for hosters (farmers) and gri
 
 <br>
 
-<button>[Visit the Dashboard](https://next.dashboard.grid.tf/)</button>
+<button>[Visit the Dashboard](https://dashboard.grid.tf/)</button>
 
 {% end %}
 

content/people/abdulrahman_elawady/index.md

@@ -0,0 +1,22 @@
+---
+title: Abdulrahman Elawady
+weight: 2
+description: An enthusiastic software engineer who loves working on open source projects. 
+taxonomies:
+    people: [abdulrahman_elawady]
+    memberships: [team]
+    categories: [foundation]
+extra:
+    imgPath: abdulrahman_elawady.jpg
+    organizations: [threefold_tech]
+    countries: [Egypt]
+    cities: [Cairo]
+    private: 0
+    socialLinks: {
+        LinkedIn: https://www.linkedin.com/in/abdulrahmanelawady/,
+        websites: https://threefold.io/,
+    }
+---
+
+
+Abdulrahman Elawady is a passionate software engineer devoted to open-source projects. With a strong enthusiasm for technology, he enjoys collaborating with others to innovate and create impactful solutions. His dedication to the open-source community motivates him to keep learning and stay updated on software development advancements. 

content/people/ahmed_hanafy/index.md

@@ -1,13 +1,13 @@
 ---
 title: Ahmed Hanafy
-weight: 4
-description: Ahmed is an Automation Software Testing Engineer, started his career at Codescalers.
+weight: 3
+description: Ahmed is an Software Engineer, started his career at Codescalers.
 taxonomies:
     people: [ahmed_hanafy]
     memberships: [team]
     categories: [foundation]
 extra:
-    imgPath: ahmed_hanafy.png
+    imgPath: ahmed_hanafy.jpg
     organizations: [threefold_tech]
     countries: [Egypt]
     cities: [Cairo]
@@ -19,4 +19,4 @@ extra:
     }
 ---
 
-Ahmed is an Automation Software Testing Engineer, started his career at Codescalers, and now has about a year experience in Cloud computing software. Engineer fell in love with Threefold I believe that Threefold is changing the world by building the new neutral internet, it's a great experience to be part of this. 
+Ahmed is an Software Engineer, started his career at Codescalers, and now has about a 5 year experience in Cloud computing software. Engineer fell in love with Threefold I believe that Threefold is changing the world by building the new neutral internet, it's a great experience to be part of this. 

content/people/ahmed_thabet/index.md

@@ -19,4 +19,4 @@ extra:
     }
 ---
  
-I believe that life is a chance for a soul to grow and for me programming is one of my means towards this growth. I want to build beautiful applications that don't productize the user or invade their privacy. Giving users their freedom back and assure them complete control over their data. What I've seen at ThreeFold being part on the team for 4+ years is a lot of great values I'd like to see evolving in this world. I'm mainly involved in the development user-facing technologies e.g SDK, wikis, websites, and infrastructure setup at Threefold.
+ I lead the development of the Threefold Grid.I want to build beautiful applications that don't productize the users or invade their privacy.

content/people/alaa_mahmoud/index.md

@@ -0,0 +1,22 @@
+---
+title: Alaa Mahmoud
+weight: 2
+description: Alaa is a software engineer, known for hardworking nature and ambitious attitude. 
+taxonomies:
+    people: [alaa_mahmoud]
+    memberships: [team]
+    categories: [foundation]
+extra:
+    imgPath: alaa_mahmoud.jpg
+    organizations: [threefold_tech]
+    countries: [Egypt]
+    cities: [Cairo]
+    private: 0
+    socialLinks: {
+        LinkedIn: https://www.linkedin.com/in/alaa-mahmoud-647236153/,
+        websites: https://threefold.io/,
+    }
+---
+
+
+Alaa is an accomplished software engineer boasting over a year of professional experience in the field.Alaa consistently strives for excellence in all endeavors. With a passion for innovation and a dedication to achieving results, they bring invaluable expertise to every project they undertake.

content/people/cameron_ramraichan_labeyrie/index.md

@@ -0,0 +1,21 @@
+---
+title: Cameron Ramraichan Labeyrie
+weight: 3
+description: Humble and a happy listener. 
+taxonomies:
+    people: [cameron_ramraichan_labeyrie]
+    memberships: [team]
+    categories: [foundation]
+extra:
+    imgPath: cameron_ramraichan_labeyrie.jpg
+    organizations: [threefold_tech]
+    countries: [India]
+    cities: [Bangalore, Chennai]
+    private: 0
+    socialLinks: {
+        websites: https://threefold.io/,
+    }
+---
+
+
+I work as a support at Threefold.I am passionate about road trips, exploring new places, a music enthusiast, and enjoy trying exotic foods. 

content/people/eslam_nawara/index.md

@@ -0,0 +1,22 @@
+---
+title: Eslam Nawara
+weight: 2
+description: Passionate software engineer interrested in developing software solutions and problem solving 
+taxonomies:
+    people: [eslam_nawara]
+    memberships: [team]
+    categories: [foundation]
+extra:
+    imgPath: eslam_nawara.jpg
+    organizations: [threefold_tech]
+    countries: [Egypt]
+    cities: [Cairo]
+    private: 0
+    socialLinks: {
+        LinkedIn: https://www.linkedin.com/in/eslam-nawara,
+        websites: https://threefold.io/,
+    }
+---
+
+
+Eslam is a passionate software engineer focused on crafting innovative solutions and tackling complex challenges through creative problem-solving. With a strong foundation in software development, Eslam excels in designing and implementing robust applications to meet diverse user needs.

content/people/gregory_flipo/index.md

@@ -0,0 +1,22 @@
+---
+title: Gregory Flipo
+weight: 3
+description: I move people to develop their potential and serve the common good.
+taxonomies:
+    people: [gregory_flipo]
+    memberships: [team]
+    categories: [foundation]
+extra:
+    imgPath: gregory_flipo.jpg
+    organizations: [threefold_tech]
+    countries: []
+    cities: []
+    private: 0
+    socialLinks: {
+        LinkedIn: https://www.linkedin.com/in/gregory-flipo-34a9947/,
+        websites: https://threefold.io/,
+    }
+---
+
+
+Gregory Flipo is a purpose-driven Entrepreneur dedicated to accelerating human progress for 20 years. After a round-the-world trip, meeting hundreds of social entrepreneurs who focused on the 4 billion people who are living with less than 2 dollars per day. He founded Sikana, A learning and sharing collaborative platform to empower anyone with life skills to develop their potential and serve the common good. Hundreds of millions of people have been impacted by Sikana Original content all supported by thousands of engaged members from around the world. Gregory is bringing that innovative, impactful, and decentralized approach to our Ecosystem of ventures as a Community Developer.

content/people/omar_abdulaziz/index.md

@@ -1,7 +1,7 @@
 ---
 title: Omar Abdulaziz
-weight: 4
-description: A software engineer, Golang, Typescript.
+weight: 3
+description: Golang, Typescript.
 taxonomies:
     people: [omar_abdulaziz]
     memberships: [team]
@@ -19,4 +19,4 @@ extra:
     }
 ---
 
-A software engineer, Golang, Typescript. 
+A software engineer. 

content/people/timur_gordon/index.md

@@ -0,0 +1,22 @@
+---
+title: Timur Gordon
+weight: 2
+description: Nature-inspired software developer, turning tech and teamwork into tools for change.
+taxonomies:
+    people: [timur_gordon]
+    memberships: [team]
+    categories: [foundation]
+extra:
+    imgPath: timur_gordon.jpg
+    organizations: [threefold_foundation]
+    countries: [Turkey, USA]
+    cities: [Istanbul, Zanzibar]
+    private: 0
+    socialLinks: {
+        LinkedIn: https://www.linkedin.com/in/timur-gordon/,
+        github: https://github.com/timurgordon,
+        websites: https://threefold.io,
+    }
+---
+
+I'm a software developer who loves nature and believes in using tech to help the planet and people. My background is in computer science, but I've also dabbled in math, philosophy, and cybersecurity. I'm really into open source because I think working together and sharing ideas is the way to go. When I'm not coding, I like to get outside and enjoy the outdoors. I'm here to do my bit, combining my interests and skills to make a difference with tech.

static/js/custom.js

@@ -142,8 +142,10 @@ window.onload = function () {
     });
   });
 
-  document.getElementById("filter-btn").addEventListener('click', toggleFilter);
-  document.getElementById("mobile-learn-btn").addEventListener('click', toggleMenu);
+  document.getElementById("filter-btn").addEventListener("click", toggleFilter);
+  document
+    .getElementById("mobile-learn-btn")
+    .addEventListener("click", toggleMenu);
 };
 
 function openInNewTab(url) {
@@ -162,21 +164,12 @@ function readingTime() {
   }
 }
 
-const urls = [
-  "https://gridproxy.grid.tf/stats?status=up",
-  "https://gridproxy.dev.grid.tf/stats?status=up",
-  "https://gridproxy.test.grid.tf/stats?status=up",
-  "https://gridproxy.bknd1.ninja.tf/stats?status=standby", // will change to mainnet when release
-  "https://gridproxy.dev.grid.tf/stats?status=standby",
-  "https://gridproxy.test.grid.tf/stats?status=standby",
-];
-
 async function getStats() {
   try {
-    const stats = await Promise.all(
-      urls.map((url) => fetch(url).then((resp) => resp.json()))
-    );
-    return mergeStatsData(stats);
+    const stats = await fetch(
+      "https://stats.grid.tf/api/stats-summary"
+    ).then((res) => res.json());
+    return formatStatsData(stats);
   } catch (error) {
     throw new Error(
       `Failed to retrieve data from network statistics: ${error}`
@@ -184,62 +177,17 @@ async function getStats() {
   }
 }
 
-function mergeStatsData(stats) {
-  const res = stats[0];
-  for (let i = 1; i < stats.length; i++) {
-    res.nodes += stats[i].nodes;
-    res.totalCru += stats[i].totalCru;
-    res.totalHru += stats[i].totalHru;
-    res.totalSru += stats[i].totalSru;
-    res.nodesDistribution = mergeNodeDistribution([
-      res.nodesDistribution,
-      stats[i].nodesDistribution,
-    ]);
-    res.countries = Object.keys(res.nodesDistribution).length;
-  }
-  let capacity = toTeraOrGiga(res.totalHru + res.totalSru);
-  document.getElementById("capacity").innerHTML = capacity;
-  document.getElementById("nodes").innerHTML = res.nodes;
-  document.getElementById("countries").innerHTML = res.countries;
-  document.getElementById("cores").innerHTML = res.totalCru
+function formatStatsData(stats) {
+  let items = document.querySelector(".items");
+  items.classList.remove("animate-pulse");
+  document.getElementById("capacity").innerHTML = stats.capacity;
+  document.getElementById("nodes").innerHTML = stats.nodes;
+  document.getElementById("countries").innerHTML = stats.countries;
+  document.getElementById("cores").innerHTML = stats.cores
     .toString()
     .replace(/\B(?=(\d{3})+(?!\d))/g, ",");
 }
 
-function mergeNodeDistribution(stats) {
-  const keys = new Set(stats.map((obj) => Object.keys(obj)).flat());
-
-  return Array.from(keys).reduce((res, key) => {
-    res[key] = 0;
-    stats.forEach((country) => {
-      res[key] += country[key] ?? 0;
-    });
-    return res;
-  }, {});
-}
-
-function toTeraOrGiga(value) {
-  const giga = 1024 ** 3;
-
-  if (!value) return "0";
-
-  const val = +value;
-  if (val === 0 || isNaN(val)) return "0";
-
-  if (val < giga) return val.toString();
-
-  let gb = val / giga;
-
-  if (gb < 1024) return `${gb.toFixed(2)} GB`;
-
-  gb = gb / 1024;
-
-  if (gb < 1024) return `${gb.toFixed(2)} TB`;
-
-  gb = gb / 1024;
-  return `${gb.toFixed(2)} PB`;
-}
-
 readingTime();
 getStats();
 document.getElementById("year").innerHTML = new Date().getFullYear();

templates/blogPage.html

@@ -20,21 +20,21 @@
   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 class="container mx-auto mt-16">
 
     <div>
       <article class="article lg:w-4/6 mx-auto">
-        <h1 class="lg:text-5xl text-2xl font-medium leading-none mt-0  text-gray-700">
+        <h2 class="md:text-4xl text-3xl font-medium mb-2 leading-none  text-gray-700">
           {{ page.title }}
-        </h1>
+        </h2>
 
-        <h4 class="lg:text-2xl text-base text-gray-600 leading-8">
+        <p class="md:text-lg mb-4 text-base text-gray-600">
           {{ page.description }}
-        </h4>
-        <section class="post-author-list mb-3 mx-0">
+        </p>
+        <section class="post-author-list mb-3 mt-2 mx-0">
           <div class="flex items-center">
             <div class="flex justify-between items-center">
-              <ul class="list-none flex author-list m-0">
+              <ul class="list-none pl-0 flex author-list m-0">
                 <li class="author-list-item">
                   {% if author %}
                   {% set author_img = get_url(path='/' ~ author.relative_path | replace(from='_', to='-') |

templates/categories/single.html

@@ -2,9 +2,9 @@
 
 {% block content %}
 
-<main class="pt-16">
+<main class="pt-12">
 
-    <div class="flex flex-col md:flex-row">
+    <div class="flex flex-col md:flex-row container mx-auto">
         {% include "partials/blogPosts.html" %}
         {% include "partials/blogSidebar.html" %}
     </div>

templates/partials/blogPosts.html

@@ -1,8 +1,8 @@
 {% block content %}
 
-<div class="text-center main-title px-0 md:w-2/3 lg:w-2/3 mx-8 md:mx-12">
-  <h1
-    class="tracking-tight text-left text-2xl md:text-4xl lg:text-5xl fw-500 leading-snug font-normal mb-10"
+<div class="text-center main-title px-0 md:w-2/3 mx-8 md:mx-12">
+  <h2
+    class="tracking-tight text-left text-2xl md:text-4xl fw-500 leading-snug font-medium"
   >
   {% set path_array = current_path | split(pat="/") %}
   {% set taxonomy = path_array[1] %}
@@ -11,9 +11,9 @@
     {% if taxonomy == "categories" %} - 
         {{category | replace(from='-', to=' ' ) | title}}
     {% endif %}
-  </h1>
+  </h2>
   <div>
-    <div class="mt-12 grid gap-5 max-w-lg mx-auto lg:grid-cols-2 xl:grid-cols-3 lg:max-w-none">
+    <div class="mt-3 grid gap-5 max-w-lg mx-auto md:grid-cols-2 lg:grid-cols-3 lg:max-w-none">
       {%- for post in paginator.pages %} 
           {% if not post.extra.hidden %}
             {% include "partials/postCard.html" %} 

templates/partials/blogSidebar.html

@@ -1,14 +1,14 @@
 
-<div class="mx-8 md:mx-4 flex flex-col">
-    <div class="flex flex-col mb-12 mr-8 lg:mr-24">
-        <h4 class="text-base not-italic font-medium leading-6 text-gray-600 mb-6"> FILTER POSTS BY</h4>
-        <a id="all" class="mb-3 text-black font-normal" href="/blog">All</a>
+<div class="mx-8 md:mx-4 flex flex-col mt-2 md:mt-8">
+    <div class="flex flex-col mb-12">
+        <h4 class="text-base not-italic font-medium leading-6 text-gray-600 mb-4"> FILTER POSTS BY</h4>
+        <a id="all" class="mb-2 text-black font-normal" href="/blog">All</a>
         {% set taxonomy = get_taxonomy(kind="categories") %}
         {% set categories = taxonomy.items %}
         {% for category in categories %}
             {% set path = category.name | slugify %}
             {% set fullpath = "/categories/" ~ path %}
-            <a id="{{path}}" class="mb-3 text-black font-normal" href={{fullpath}}> {{category.name}} </a>
+            <a id="{{path}}" class="mb-2 text-black font-normal" href={{fullpath}}> {{category.name}} </a>
         {% endfor %}
     </div>
 

templates/partials/featuredBlog.html

@@ -9,27 +9,30 @@
 
 <body>
 
-  <div class="md:grid md:grid-cols-2 md:gap-8 relative mt-16 lg:mt-16 items-center container mx-auto">
-    <div class="relative lg:ml-8 my-8 w-full md:w-auto">
-      <h3 class="text-base not-italic leading-6 text-gray-600">FEATURED POST</h3>
+  <div class="md:grid md:grid-cols-2 md:gap-8 relative mt-12 md:mt-10 items-center container mx-auto">
+    <div class="relative my-8 w-full md:w-auto mx-3 lg:mx-12">
+      <h3 class="text-base not-italic font-medium leading-6 text-gray-600 mb-4">FEATURED POST</h3>
       <a href={{featured.permalink}} class="">
         <h2
-          class="mt-8 text-2xl main-title sm:text-3xl md:text-4xl lg:text-5xl fw-500 leading-snug font-normal mb-4 md:mb-10 ">
+          class="text-2xl main-title md:text-4xl fw-500 leading-snug font-medium">
           {{ featured.title }}
         </h2>
+        <p class="mt-2 text-base font-normal text-gray-500 text-left">
+          {{ featured.description }}
+        </p>
       </a>
-      <h4 class="text-sm not-italic font-light leading-6 text-gray-600">
+      <h4 class="my-2 text-sm not-italic font-light leading-6 text-gray-600">
         {{ featured.date | date(format="%B %e, %Y", timezone="America/Chicago")}} -
       </h4>
 
     </div>
 
-    <div class="mx-4 relative lg:mt-0 max-w-full">
-      <img class="relative mx-auto md:w-auto rounded md:max-w-full max-h-80" src={{featured.permalink}}{{featured.extra.imgPath}} alt="" />
+    <div class="relative lg:mt-0 max-w-full">
+      <img class="relative rounded mx-auto  max-h-64 p-2 border-2 border-gray-100" src={{featured.permalink}}{{featured.extra.imgPath}} alt="" />
     </div>
   </div>
 
-  <hr class="mt-6">
+  <hr class="mt-6 max-w-7xl mx-auto">
 
   </div>
   </div>

templates/partials/postCard.html

@@ -19,9 +19,9 @@
         <img class="h-48 w-full mx-auto object-cover" src={{img_url}} alt="{{post.title ~ ' Picture'}}" />
       </div>
       {%endif%}
-      <div class="flex-1 bg-white p-6 flex flex-col justify-between">
+      <div class="flex-1 bg-white p-4 flex flex-col justify-between">
 
-        <h3 class="mt-2 text-xl leading-6 font-medium text-gray-900 text-left not-italic">
+        <h3 class="mt-2 text-lg leading-6 font-medium text-gray-900 text-left not-italic">
           {{ post.title }}
         </h3>
         {% if post.description %}

templates/shortcodes/grid_stats.html

@@ -3,9 +3,9 @@
     <div class="relative lg:max-w-6xl mx-auto">
         <div class="text-center rounded lg:px-6 mt-10 lg:mt-0 mx-auto">
             {{body | markdown | safe }}
-            <div class="my-10 grid lg:grid-cols-4 lg:gap-8">
+            <div class="items my-10 grid lg:grid-cols-4 lg:gap-8 animate-pulse">
                 <!-- capacity -->
-                <div class="flex flex-col border border-gray-50 shadow-lg bg-white py-8 my-4">
+                <div class="item flex flex-col border border-gray-50 shadow-lg bg-white py-8 my-4">
                     <img
                         class="mx-auto p-4"
                         src="images/V3-08.png"
@@ -16,7 +16,7 @@
                     <span class="block text-lg mt-4 font-normal capitalize">capacity</span>
                 </div>
                 <!-- Nodes -->
-                <div class="flex flex-col border border-gray-50 shadow-lg bg-white py-8 my-4">
+                <div class="item flex flex-col border border-gray-50 shadow-lg bg-white py-8 my-4">
                     <img
                         class="mx-auto p-4"
                         src="images/V3-09.png"
@@ -27,7 +27,7 @@
                     <span class="block text-lg mt-4 font-normal capitalize">nodes</span>
                 </div>
                 <!-- countries -->
-                <div class="flex flex-col border border-gray-50 shadow-lg bg-white py-8 my-4">
+                <div class="item flex flex-col border border-gray-50 shadow-lg bg-white py-8 my-4">
                     <img
                         class="mx-auto p-4"
                         src="images/V3-10.png"
@@ -38,7 +38,7 @@
                     <span class="block text-lg mt-4 font-normal capitalize">countries</span>
                 </div>
                 <!-- cores -->
-                <div class="flex flex-col border border-gray-50 shadow-lg bg-white py-8 my-4">
+                <div class="item flex flex-col border border-gray-50 shadow-lg bg-white py-8 my-4">
                     <img
                         class="mx-auto p-4"
                         src="images/V3-11.png"

templates/shortcodes/grid_stats_expand.html

@@ -58,7 +58,7 @@
  
             </div>
             
-        <button><a href="https://dashboard.grid.tf/explorer/statistics">Explore Grid Capacity</a></button>
+        <button><a href="https://dashboard.grid.tf/#/tf-grid/node-statistics/">Explore Grid Capacity</a></button>
         <button><a href="/host">Become a Host</a></button>
         </div>
     </div>