Update Linux download link

- Auto-detects git branch (master/development/other)
- Sets correct base_url for each environment:
  * master -> https://www.mycelium.threefold.io/ (production)
  * development -> https://www2.mycelium.threefold.io/ (staging)
  * other -> /mycelium/ (local development)
- Eliminates merge conflicts between staging and production
- Enables seamless branch merging workflow

.github/workflows/tf_update_dev.yml

@@ -1,46 +0,0 @@
-name: www2.threefold_io
-on: 
-  push:
-    branches: [ development ]
-
-jobs:
-  deploy:
-    name: Deploy
-    runs-on: ubuntu-latest
-    steps:
-    - name: pushing latest change on www2.threefold.io
-      uses: appleboy/ssh-action@master
-      with:
-        host: dev.threefold.io
-        username: webuser
-        key: ${{ secrets.TF_SECRET }}
-        port: 34022
-        script: |
-          cd websites/www2/www_threefold_io/
-          git log -1
-          git fetch
-          git reset --hard origin/development
-          sed -i "s/https:\/\/www.threefold.io/https:\/\/dev.threefold.io/g" config.toml
-          ./build.sh
-          
-  wait:
-    needs: deploy
-    name: Wait for Website Update
-    runs-on: ubuntu-latest
-    steps:
-    - name: Wait Period
-      id: wait-deploy
-      run: |
-        echo "Sleeping for 30"
-        sleep 30
-        
-  checklinks:
-    needs: wait
-    name: Check for Broken Links
-    runs-on: ubuntu-latest
-    steps:
-      - name: Check for Broken Links
-        id: link-report
-        uses: docker://ghcr.io/threefoldfoundation/website-link-checker:latest
-        with:
-          args: 'https://www2.threefold.io -w 404'

.github/workflows/tf_update_prod.yml

@@ -1,46 +0,0 @@
-name: www.threefold_io
-on: 
-  push:
-    branches: [ master ]
-
-jobs:
-  deploy:
-    name: Deploy
-    runs-on: ubuntu-latest
-    steps:
-    - name: pushing latest change on www.threefold.io
-      uses: appleboy/ssh-action@master
-      with:
-        host: www.threefold.io
-        username: root
-        key: ${{ secrets.TF_SECRET }}
-        port: 22
-        script: |
-          cd /opt/www_threefold_io/
-          git log -1
-          git fetch
-          git reset --hard origin/master
-          sed -i "s/https:\/\/dev.threefold.io/https:\/\/www.threefold.io/g" config.toml
-          ./build.sh
-          
-  wait:
-    needs: deploy
-    name: Wait for Website Update
-    runs-on: ubuntu-latest
-    steps:
-    - name: Wait Period
-      id: wait-deploy
-      run: |
-        echo "Sleeping for 30"
-        sleep 30
-        
-  checklinks:
-    needs: wait
-    name: Check for Broken Links
-    runs-on: ubuntu-latest
-    steps:
-      - name: Check for Broken Links
-        id: link-report
-        uses: docker://ghcr.io/threefoldfoundation/website-link-checker:latest
-        with:
-          args: 'https://www.threefold.io -w 404'

.github/workflows/update_dev2.yml

@@ -1,46 +0,0 @@
-name: www3.threefold_io
-on: 
-  push:
-    branches: [ development_sasha ]
-
-jobs:
-  deploy:
-    name: Deploy
-    runs-on: ubuntu-latest
-    steps:
-    - name: pushing latest change on www3.threefold.io
-      uses: appleboy/ssh-action@master
-      with:
-        host: www3.threefold.io
-        username: webuser
-        key: ${{ secrets.TF_SECRET }}
-        port: 34022
-        script: |
-          cd websites/tmp/www_threefold_io/
-          git log -1
-          git restore .
-          git pull
-          sed -i "s/https:\/\/dev.threefold.io/https:\/\/dev2.threefold.io/g" config.toml
-          bash build.sh
-          
-  wait:
-    needs: deploy
-    name: Wait for Website Update
-    runs-on: ubuntu-latest
-    steps:
-    - name: Wait Period
-      id: wait-deploy
-      run: |
-        echo "Sleeping for 30"
-        sleep 30
-        
-  checklinks:
-    needs: wait
-    name: Check for Broken Links
-    runs-on: ubuntu-latest
-    steps:
-      - name: Check for Broken Links
-        id: link-report
-        uses: docker://ghcr.io/threefoldfoundation/website-link-checker:latest
-        with:
-          args: 'https://www3.threefold.io -w 404'

.github/workflows/update_www3.yml

@@ -1,46 +0,0 @@
-name: www3.threefold_io
-on: 
-  push:
-    branches: [ 3.10.0 ]
-
-jobs:
-  deploy:
-    name: Deploy
-    runs-on: ubuntu-latest
-    steps:
-    - name: pushing latest change on www3.threefold.io
-      uses: appleboy/ssh-action@master
-      with:
-        host: www3.threefold.io
-        username: webuser
-        key: ${{ secrets.TF_SECRET }}
-        port: 34022
-        script: |
-          cd websites/www3/www_threefold_io/
-          git log -1
-          git restore .
-          git pull
-          sed -i "s/https:\/\/www.threefold.io/https:\/\/www3.threefold.io/g" config.toml
-          bash build.sh
-          
-  wait:
-    needs: deploy
-    name: Wait for Website Update
-    runs-on: ubuntu-latest
-    steps:
-    - name: Wait Period
-      id: wait-deploy
-      run: |
-        echo "Sleeping for 30"
-        sleep 30
-        
-  checklinks:
-    needs: wait
-    name: Check for Broken Links
-    runs-on: ubuntu-latest
-    steps:
-      - name: Check for Broken Links
-        id: link-report
-        uses: docker://ghcr.io/threefoldfoundation/website-link-checker:latest
-        with:
-          args: 'https://www3.threefold.io -w 404'

.gitignore

@@ -33,3 +33,4 @@ install*
 public
 static/css
 tailwindcss
+config.toml

README.md

@@ -17,7 +17,7 @@ Mycelium is a decentralized networking and storage solution designed to integrat
 
 ### **Clone the Repository**  
 ```sh
-git clone https://git.ourworld.tf/ourworld_web/www_mycelium.git
+git clone https://git.threefold.info/ourworld_web/www_mycelium.git
 cd www_mycelium
 ```
 
@@ -36,7 +36,7 @@ This will generate and serve the website for preview.
 
 ## 📌 **Issues & Contributions**  
 Report bugs or suggest improvements in the issue tracker:  
-🔗 [Issue Tracker](https://git.ourworld.tf/tfgrid/circle_web_presence/issues)  
+🔗 [Issue Tracker](https://git.threefold.info/tfgrid/circle_web_presence/issues)  
 
 ## 📜 **License**  
 This project is open-source and licensed under [insert applicable license].  

build.sh

@@ -1,47 +1,71 @@
-#!/bin/bash
+PREFIX="mycelium"
 
-set -e
-echo "🧹 Cleaning build folders..."
-rm -rf public static/css
+echo "Starting build..."
 
-echo "⬇️ Downloading TailwindCSS CLI..."
-if [[ -f "tailwindcss" ]]; then
-  rm tailwindcss
-fi
+SOURCE=${BASH_SOURCE[0]}
+DIR_OF_THIS_SCRIPT="$( dirname "$SOURCE" )"
+ABS_DIR_OF_SCRIPT="$( realpath $DIR_OF_THIS_SCRIPT )"
 
-ASSET="tailwindcss-linux-x64"
-curl -sLO "https://github.com/tailwindlabs/tailwindcss/releases/download/v3.4.17/${ASSET}"
-mv ${ASSET} tailwindcss
-chmod +x tailwindcss
+# Check if tailwindcss executable exists, if not, download and install it
+if [[ ! -f "tailwindcss" ]]; then
+    echo "Installing & building tailwind..."
+    ASSET="tailwindcss"
 
-# Ensure correct config
-if [[ ! -f "tailwind.config.js" ]]; then
-  echo "⚙️ Creating tailwind.config.js"
-  echo "module.exports = {
-  content: ['./templates/**/*.html'],
-  theme: { extend: {} },
-  plugins: [],
-}" > tailwind.config.js
-fi
+    if [[ "$OSTYPE" == "linux-gnu"* ]]; then
+        ASSET="$ASSET-linux"
+    elif [[ "$OSTYPE" == "darwin"* ]]; then
+        ASSET="$ASSET-macos"
+    fi
+    if [[ "$(uname -m)" == "x86_64"* ]]; then
+        ASSET="$ASSET-x64"
+    elif [[ "$(uname -m)" == "arm64"* ]]; then
+        ASSET="$ASSET-arm64"
+    fi
 
-# Build Tailwind CSS
-echo "🎨 Building Tailwind CSS..."
-./tailwindcss -i css/index.css -o static/css/index.css --minify
-
-if [[ ! -f "static/css/index.css" ]]; then
-  echo "❌ Tailwind CSS not generated."
-  exit 1
-fi
-
-echo "✅ Tailwind CSS built at static/css/index.css"
-
-# Build Zola site
-echo "🏗  Building site with Zola..."
-zola build
-
-# Final check
-if [[ -f "public/css/index.css" ]]; then
-  echo "✅ CSS successfully copied to public/"
+    curl -sLO "https://github.com/tailwindlabs/tailwindcss/releases/download/v3.4.17/${ASSET}"
+    chmod +x $ASSET
+    mv $ASSET tailwindcss
 else
-  echo "❌ CSS NOT copied to public/. Check Zola static settings."
+    echo "tailwindcss already exists, skipping installation."
 fi
+
+
+# initialized and configures tailwind if not configured
+echo "Initializing tailwind..."
+if [[ ! -f "tailwind.config.js" ]]
+then
+    ./tailwindcss init
+    sed -i '' "s|  content: \\[\\],|  content: \\['./templates/**/*.html'\\],|g" tailwind.config.js
+fi
+
+# compiles tailwind css for prod & builds project
+echo "Compiling tailwindcss and building zola project..."
+rm -rf public static/css
+./tailwindcss -i css/index.css -o ./static/css/index.css --minify
+
+# Auto-detect deployment environment based on git branch
+CURRENT_BRANCH=$(git rev-parse --abbrev-ref HEAD)
+echo "Detected git branch: $CURRENT_BRANCH"
+
+if [ "$CURRENT_BRANCH" = "master" ]; then
+    # Production deployment (www.mycelium.threefold.io)
+    echo "Building for PRODUCTION environment..."
+    BASE_URL="https://www.mycelium.threefold.io/"
+    DEPLOY_PATH="root@threefold.info:/root/hero/www/info/$PREFIX/"
+elif [ "$CURRENT_BRANCH" = "development" ]; then
+    # Staging deployment (www2.mycelium.threefold.io)
+    echo "Building for STAGING environment..."
+    BASE_URL="https://www2.mycelium.threefold.io/"
+    DEPLOY_PATH="root@threefold.info:/root/hero/www/info/$PREFIX/"
+else
+    # Fallback for other branches (local development mode)
+    echo "Building for LOCAL/OTHER branch environment..."
+    BASE_URL="/mycelium/"
+    DEPLOY_PATH="${HOME}/hero/var/www/$PREFIX/"
+fi
+
+echo "Using base_url: $BASE_URL"
+sed "s|base_url = \"BASEURL\"|base_url = \"$BASE_URL\"|" config.templ.toml > config.toml
+zola --root $ABS_DIR_OF_SCRIPT build
+echo "Build completed. Site available in 'public/' directory."
+# Deployment removed: rsync -avz --delete public/ "$DEPLOY_PATH"

config.templ.toml

@@ -0,0 +1,99 @@
+# The URL the site will be built for
+base_url = "BASEURL"
+
+title = "Mycelium"
+description = "Our global digital backbone"
+
+# When set to "true", a feed is automatically generated.
+# generate_feed = true
+
+# The filename to use for the feed. Used as the template filename, too.
+# Defaults to "atom.xml", which has a built-in template that renders an Atom 1.0 feed.
+# There is also a built-in template "rss.xml" that renders an RSS 2.0 feed.
+# feed_filename = "atom.xml"
+
+# The number of articles to include in the feed. All items are included if
+# this limit is not set (the default).
+# feed_limit = 10
+
+# Whether to automatically compile all Sass files in the sass directory
+compile_sass = false
+
+# When set to "true", the generated HTML files are minified.
+# minify_html = true
+# I'm keeping off for now -- buggy -- 2021-02-05 (@keats says it'll be fixed 0.14.0)
+
+# Whether to build a search index to be used later on by a JavaScript library
+build_search_index = false
+
+[markdown]
+# Whether to do syntax highlighting
+# Theme can be customised by setting the `highlight_theme` variable to a theme supported by Zola
+highlight_code = true
+highlight_theme = "visual-studio-dark"
+
+# When set to "true", emoji aliases translated to their corresponding
+# Unicode emoji equivalent in the rendered Markdown files. (e.g.: :smile: => 😄)
+render_emoji = false
+
+# Whether external links are to be opened in a new tab
+# If this is true, a `rel="noopener"` will always automatically be added for security reasons
+# external_links_target_blank = false
+
+# Whether to set rel="nofollow" for all external links
+external_links_no_follow = true
+
+# Whether to set rel="noreferrer" for all external links
+external_links_no_referrer = true
+
+# Whether smart punctuation is enabled (changing quotes, dashes, dots in their typographic form)
+# For example, `...` into `…`, `"quote"` into `“curly”` etc
+smart_punctuation = true
+
+#[build]
+#not_found = "404.md"
+
+[[taxonomies]]
+name = "categories"
+feed = true
+paginate_by = 6
+paginate_path = "blog-posts"
+
+[[taxonomies]]
+name = "partners-category"
+feed = true
+paginate_by = 6
+paginate_path = "partner-card"
+
+[[taxonomies]]
+name = "news-category"
+feed = true
+paginate_by = 6
+paginate_path = "news-card"
+
+[[taxonomies]]
+name = "roles"
+feed = true
+paginate_by = 2
+paginate_path = "join-us"
+
+[[taxonomies]]
+name = "tags"
+feed = true
+paginate_by = 9
+paginate_path = "tags"
+
+[[taxonomies]]
+name = "people"
+feed = false
+paginate_by = 9
+paginate_path = "people"
+
+[[taxonomies]]
+name = "memberships"
+feed = false
+paginate_by = 8
+paginate_path = "people/memberships"
+
+[extra]
+# Put all your custom variables here

config.toml

@@ -1,6 +1,5 @@
 # The URL the site will be built for
-base_url = "https://www3.mycelium.threefold.io/"
-# Change this to your own URL! Please note this variable **must** be uncommented .
+base_url = "https://www2.mycelium.threefold.io/"
 
 title = "Mycelium"
 description = "Our global digital backbone"

content/_index.md

@@ -5,8 +5,8 @@ description: "Mycelium is a decentralized networking and storage solution design
 #updated: 2021-02-20T14:40:00-06:00
 draft: false
 extra:
-  author: ThreeFold
-  imgPath: home/tf.png
+  author: Mycelium
+  imgPath: home/mycel2.png
 ---
 
 
@@ -105,7 +105,7 @@ True digital sovereignty for open-source builders. The ThreeFold Grid provides l
 
 |||
 
-<button>[The Manual](https://threefold.info/mycelium/docs/)</button>
+<button>[The Manual](https://docs.ourworld.tf/mycelium_cloud/docs/)</button>
 
 |||
 

content/about/index.md

@@ -102,7 +102,7 @@ extra:
     button_text="Download Now",
     button_link="/download",
     button_text2="Read More",
-    button_link2="https://threefold.info/mycelium/docs/"
+    button_link2="https://docs.ourworld.tf/mycelium_cloud/docs/"
 ) }}
 
 

content/download/index.md

@@ -15,7 +15,7 @@ extra:
     title="Download Mycelium",
     description="Get Mycelium for Android, Windows, macOS, and iOS to securely connect, store, and interact with the decentralized network—seamlessly and efficiently.",
     description3="Not sure how it works?",
-    button_link="https://threefold.info/mycelium/docs/",
+    button_link="https://docs.ourworld.tf/mycelium_cloud/docs/",
     button_text="Read the manual." 
 ) }}
 
@@ -55,7 +55,7 @@ extra:
     title="Download for Linux", 
     description="Download the Mycelium binary for Linux directly from its Github repository.", 
     icon="/images/icons/linux.png",
-    link="https://github.com/threefoldtech/mycelium/releases/tag/v0.6.1",
+    link="https://github.com/threefoldtech/mycelium/releases",
     link_name="Download Now"
 
     ) }}
@@ -142,5 +142,5 @@ extra:
     button_text="Download Now",
     button_link="/download",
     button_text2="Read More",
-    button_link2="https://threefold.info/mycelium/docs/"
+    button_link2="https://docs.ourworld.tf/mycelium_cloud/docs/"
 ) }}

content/footer/_index.md

@@ -14,7 +14,7 @@ extra:
 
 <br>
 
-###### [Manual](https://threefold.info/mycelium/docs/)
+###### [Manual](https://docs.ourworld.tf/mycelium_cloud/docs/)
 
 ###### [Dashboard](https://dashboard.grid.tf/)
 

content/header/index.md

@@ -9,6 +9,6 @@ extra:
 ---
 
 - [About]("/about")
-- [Docs]("https://threefold.info/mycelium/docs/")
+- [Docs]("https://docs.ourworld.tf/mycelium_cloud/docs/")
 
 

content/home/index.md

@@ -3,7 +3,7 @@ title: "Mycelium"
 description: "Mycelium is a decentralized networking and storage solution designed to integrate seamlessly with AI workloads, content delivery, and messaging." 
 insert_anchor_links: "left"
 extra:
- author: ThreeFold
+ author: Mycelium
  imgPath: home/mycel2.png
 ---
 
@@ -314,7 +314,7 @@ extra:
     button_text="Download Now",
     button_link="/download",
     button_text2="Read More",
-    button_link2="https://threefold.info/mycelium/docs/"
+    button_link2="https://docs.ourworld.tf/mycelium_cloud/docs/"
 ) }}
 
 

css/code.css

@@ -0,0 +1,94 @@
+code.language-html,
+code.language-css,
+code.language-md,
+code.language-cmd,
+code.language-bash,
+code.language-text,
+code.language-js,
+span.o,
+span.nx {
+  color: rgb(255, 255, 255);
+  line-height: 1.4;
+}
+span.c {
+  color: hsl(120, 100%, 20%);
+}
+
+.active {
+  color: #2E83FF;
+}
+
+span.p,
+span.s1,
+span.s2,
+span.nt {
+  color: hsl(40, 100%, 30%);
+}
+
+span.gs,
+span.gh,
+span.ge {
+  color: hsl(208, 100%, 50%);
+}
+
+span.gs {
+  font-weight: bold;
+}
+
+span.ge {
+  font-style: italic;
+}
+
+pre,
+code {
+  @apply font-mono;
+}
+
+code {
+  background-color: hsl(0, 0%, 98%);
+  border-radius: 3px;
+  color: hsl(120, 100%, 20%);
+  font-size: 85%;
+}
+
+pre {
+  margin: 0;
+  margin: 0;
+  padding: 1rem;
+  overflow: scroll;
+}
+
+pre code {
+  background-color: transparent;
+  color: inherit;
+  font-size: 100%;
+  padding: 0;
+}
+
+.highlight {
+  background-color: transparent;
+  border-radius: 3px;
+  margin: 0 0 0.5rem;
+  padding: 0;
+
+  & pre {
+    margin-bottom: 0;
+    overflow-x: auto;
+  }
+
+  & .lineno {
+    color: hsla(0, 0%, 67%, 0.72);
+    display: inline-block; /* Ensures the null space also isn't selectable */
+    padding: 0 0.75rem 0 0.25rem;
+    /* Make sure numbers aren't selectable */
+  }
+}
+
+/* TODO: dark theme for future
+@media (prefers-color-scheme: dark) {
+  code {
+    color: #fff;
+    background: hsl(200, 63%, 15%);
+  }
+}
+*/

css/index.css

@@ -1,7 +1,10 @@
-
+/*! purgecss start ignore */
+/* @import "nav.css"; */
+@import "code.css";
+/*! purgecss end ignore */
 
 @import "tailwindcss/base";
-@import "layout.css";
+
 @import "tailwindcss/components";
 @import "admonition.css";
 @import "tailwindcss/utilities";
@@ -71,6 +74,10 @@ body.dark-mode .icon {
   fill: #ffffff !important;
 }
 
+body.dark-mode .card {
+  background-color: rgba(82, 82, 82, 50%) !important;
+}
+
 body.dark-mode .dropdown a{
   @apply
   px-0
@@ -103,20 +110,6 @@ body.dark-mode .d_menu {
   background-color: rgba(255, 255, 255, 0.75);
 }
 
-.bg-dark-gradient {
-  background: rgba(16,16,16,1);
-  background: radial-gradient(circle, rgba(16,16,16,1) 0%, rgb(24, 24, 24) 50%, rgba(16,16,16,1) 100%);
-}
-
-.bg-black1 {
-  background-color: rgba(16,16,16,1);
-}
-
-.bg-transparent {
-  background-color: transparent;
-}
-
-
 
 /* Custom css allowing image styling in markdown */
 img[src*="#mx-auto"] {
@@ -209,63 +202,18 @@ a img:hover{
   text-white
 }
 
-.subtitle {
-  background-color:#58CF77 !important;
-  color: #fff !important;
-  text-transform: uppercase;
-  /* font-weight: 600 !important;  */
-}
-
-.green{
-
-  background-color:#58CF77 !important;
-  color: #fff !important;
-
-}
-
-.green:hover {
-background-color:#7ad993 !important;
-}
-.green a{
-   color: #fff !important;
-}
-
-.green:hover {
-background-color:#7ad993 !important;
-}
-
-.green_text{
-color: #58CF77 ;
-}
-
-
-  .blue_b{
-
-  background-color:#2E83FF !important;
-  color: #fff !important;
-
-}
-.blue_b a{
-   color: #fff !important;
-}
-
-.blue_b:hover {
-background-color:#5596f5 !important;
-}
-
-
 .footer-cust a{
-  color: #999; 
+   
   cursor: pointer;
 }
 
 .footer-cust a:hover {
-  color: #c7c7c7; 
+  color: #a3a3a3; 
 }
 
-.footer-cust h6{
+/* .footer-cust h6{
   margin-bottom: 15px;
-}
+} */
 
 .logo_size{
   width:200px
@@ -330,18 +278,18 @@ background-color:#5596f5 !important;
 
 @layer components {
   h1 {
-    @apply text-4xl lg:text-6xl font-normal;
+    @apply text-4xl font-semibold tracking-tight lg:text-6xl;
     font-family: "Inter", sans-serif !important;
   }
   h2 {
-    @apply text-3xl lg:text-4xl my-4 font-normal leading-none;
+    @apply  lg:text-5xl text-4xl font-medium tracking-tight leading-none;
     font-family: "Inter", sans-serif !important;
   }
   h2 strong {
     @apply font-semibold;
   }
   h3 {
-    @apply text-2xl lg:text-3xl my-4 font-extralight;
+    @apply lg:text-4xl text-3xl font-normal tracking-tight;
     font-family: "Inter", sans-serif !important;
   }
   h3 strong {
@@ -458,11 +406,6 @@ background-color:#5596f5 !important;
     font-family: "Inter", sans-serif;
   }
 
-
-/* button:hover :is(:where(a)) {
-  color: #5e5e5e;
-} */
-
 button :is(:where(p)) {
   color: #ddd;
   font-weight: 400;
@@ -641,7 +584,6 @@ header {
 .post-content-text h2 {
   font-family: "Inter", sans-serif;
   line-height: 1.5;
-  font-size: 2.25rem;
   font-weight: 700;
 }
 .container-fluid {
@@ -655,12 +597,8 @@ header {
 .zola-anchor {
   display: none;
 }
-@media (min-width: 1024px){
-  h2 {
-    font-size: 3.5rem;
-  } 
 
-}
+
 
 @media (max-width: 1024px) {
 

css/index.css.bak

@@ -1,743 +0,0 @@
-
-
-@import "tailwindcss/base";
-@import "layout.css";
-@import "tailwindcss/components";
-@import "admonition.css";
-@import "tailwindcss/utilities";
-@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
-
-@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
-
-/* Defaul lightMode */
-body {
-  background-color: #ffffff;
-  color: #000000;
-}
-
-body .semigray {
-  
-  color: #424242 !important;
-}
-
-body .semigray2 {
-  
-  color: #424242 !important;
-}
-
-body .nav a {
-  color: #333333 !important;
-}
-
-body .dropdown a{
-  @apply
-  px-0
-  text-black
-}
-
-body .dropdown{
-  background-color: rgb(255 255 255 / 100%);
-  color: #121212;
-}
-
-body .d_menu {
-  background-color: #e5e5e5;
-}
-
-body .icon {
-  
-  fill: #424242 !important;
-}
-
-/* Dark Mode */
-body.dark-mode {
-  background-color: #121212;
-  color: #ffffff;
-}
-
-body.dark-mode .nav a {
-  color: #ffffff !important;
-}
-
-body.dark-mode .semigray {
-  color: #e5e7eb !important;
-}
-
-body.dark-mode .semigray2 {
-  color: #d1d5db !important;
-}
-
-body.dark-mode .icon {
-  fill: #ffffff !important;
-}
-
-body.dark-mode .dropdown a{
-  @apply
-  px-0
-  text-white
-}
-
-body.dark-mode .dropdown{
-  background-color: rgb(0 0 0 / 50%);
-  color: #fff;
-}
-
-body.dark-mode .d_menu {
-  background-color: rgba(34 34 34);
-}
-
-
-
-
-
-/* Custom CSS for header partial */
-.backdrop-blur {
-  -webkit-backdrop-filter: blur(40px);
-}
-
-* {
-  font-family: "Inter", sans-serif;
-}
-
-.bg-semi-white {
-  background-color: rgba(255, 255, 255, 0.75);
-}
-
-.bg-dark-gradient {
-  background: rgba(16,16,16,1);
-  background: radial-gradient(circle, rgba(16,16,16,1) 0%, rgb(24, 24, 24) 50%, rgba(16,16,16,1) 100%);
-}
-
-.bg-black1 {
-  background-color: rgba(16,16,16,1);
-}
-
-.bg-transparent {
-  background-color: transparent;
-}
-
-
-
-/* Custom css allowing image styling in markdown */
-img[src*="#mx-auto"] {
-  margin: auto;
-}
-
-img[src*="#small"] {
-  width: 68px;
-}
-
-img[src*="#medium"] {
-  width: 400px;
-  margin: auto;
-}
-
-img[src*="#logo"] {
-  max-width: min(250px, 100%);
-  margin: auto;
-}
-
-img[src*="#icon"] {
-  width: 200px;
-  margin: auto;
-}
-
-img[src*="#social"] {
-  width: 60px;
-  margin: auto;
-}
-
-img[src*="#semilarge"] {
-  width: 500px;
-  margin: auto;
-}
-
-img[src*="#large"] {
-  width: 700px;
-  margin: auto;
-}
-
-img[src*="#tft_img"] {
-  width: 100px;
-  margin: auto;
-}
-
-img[src*="#absolute"] {
-  position: absolute;
-  left: 0;
-  top: 0;
-}
-
-a img:hover{
-  opacity: 0.5 !important;
-  cursor: pointer;
-}
-
-/* new theme */
-
-.dropdown { 
-
-  background-color: rgb(0 0 0 / 50%);
-  @apply
-  lg:text-lg
-  px-6
-  py-1
-  lg:mr-5
-  my-3
-  shadow
-  border-black
-  capitalize 
-  leading-6 
-  border-transparent 
-  flex 
-  flex-col
-  border-2 
-  w-full 
-  items-start
-  rounded 
-  transition  
-  hover:border-stone-700 
-  /* hover:bg-stone-100  */
-  p-2 
-  text-left
-  text-white
-}
-
-.dropdown a{
-  @apply
-  px-0
-  text-white
-}
-
-.subtitle {
-  background-color:#58CF77 !important;
-  color: #fff !important;
-  text-transform: uppercase;
-  /* font-weight: 600 !important;  */
-}
-
-.green{
-
-  background-color:#58CF77 !important;
-  color: #fff !important;
-
-}
-
-.green:hover {
-background-color:#7ad993 !important;
-}
-.green a{
-   color: #fff !important;
-}
-
-.green:hover {
-background-color:#7ad993 !important;
-}
-
-.green_text{
-color: #58CF77 ;
-}
-
-
-  .blue_b{
-
-  background-color:#2E83FF !important;
-  color: #fff !important;
-
-}
-.blue_b a{
-   color: #fff !important;
-}
-
-.blue_b:hover {
-background-color:#5596f5 !important;
-}
-
-
-.footer-cust a{
-  color: #999; 
-  cursor: pointer;
-}
-
-.footer-cust a:hover {
-  color: #c7c7c7; 
-}
-
-.footer-cust h6{
-  margin-bottom: 15px;
-}
-
-.logo_size{
-  width:200px
-}
-
-
-.nav p > a {
-  display: flex;
-  width: 100%;
-  flex-direction: column;
-  align-items: flex-start;
-  text-align: left;
-  line-height: 1.5rem;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 150ms;
-  border-radius: 0.25rem;
-  border-width: 2px;
-  border-color: transparent;
-  padding: 0.5rem;
-  margin-top: 0.75rem;
-  margin-bottom: 0.75rem;
-  display: inline-block;
-  border-width: 2px;
-  border-color: rgb(0 0 0 / var(--tw-border-opacity));
-  padding-left: 3rem;
-  padding-right: 3rem;
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
-  text-transform: capitalize;
-  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
-}
-
-.nav p > a:hover {
-  --tw-border-opacity: 1;
-  border-color: rgb(231 229 228 / var(--tw-border-opacity));
-  --tw-bg-opacity: 1;
-  background-color: rgb(245 245 244 / var(--tw-bg-opacity));
-}
-
-.big_header{
-  font-size: 6rem !important;
-  font-weight: 500 !important;
-}
-
-.mycard{
-  height: 300px !important;
-}
-
-
-.mypartners{
-  height: 300px !important;
-
-}
-
-.key_card{
-
-  height: 250px;
-
-}
-
-
-@layer components {
-  h1 {
-    @apply text-4xl lg:text-6xl font-normal;
-    font-family: "Inter", sans-serif !important;
-  }
-  h2 {
-    @apply text-3xl lg:text-4xl my-4 font-normal leading-none;
-    font-family: "Inter", sans-serif !important;
-  }
-  h2 strong {
-    @apply font-semibold;
-  }
-  h3 {
-    @apply text-2xl lg:text-3xl my-4 font-extralight;
-    font-family: "Inter", sans-serif !important;
-  }
-  h3 strong {
-    @apply font-normal;
-  }
-  h4 {
-    @apply text-xl lg:text-2xl font-normal tracking-wider;
-    font-family: "Inter", sans-serif !important;
-    
-  }
-  h5 {
-    @apply text-lg my-1 tracking-normal font-medium;
-    font-family: "Inter", sans-serif !important;
-   
-  }
-  h6 {
-    @apply text-md not-italic font-normal my-1;
-    font-family: "Inter", sans-serif !important;
-  }
-  p {
-    @apply text-lg;
-   
-    font-family: "Inter", sans-serif !important;
-  }
-  blockquote {
-    @apply border-l-4 border-gray-400 mx-2 my-2 p-2;
-  }
-  li {
-    @apply text-base lg:text-base font-normal;
-  }
-  li li {
-    @apply text-sm lg:text-sm font-light;
-  }
-  button {
-    @apply 
-    inline-block
-    md:text-md
-    text-sm
-    lg:mr-3
-    py-1
-    my-2
-    border
-    rounded
-    shadow
-    border-gray-400
-    capitalize
-    bg-gray-200
-  }
-  .my-header h4{
-    color:#9f9f9f;
-
-  }
-
-  h3 a{
-    color:#ffffff;
-
-  }
-
-  h3 a:hover{
-    color:#b6b6b6;
-
-  }
-  
- 
- 
-
-
-  .article h2{
-    font-size: 2.25rem;
-    font-family: "Inter", sans-serif;
-    line-height: 1.5;
-    font-weight: 700;
-    color:#e2e2e2;
-  }
-  
-  .article h1{
-    font-family: "Inter", sans-serif;
-  }
-
-  }
-  .article p{
-    font-size: 1.125rem;
-    font-family: "Inter", sans-serif;
-    line-height: 1.7;
-    color:#e2e2e2
-  }
-  
-  .post-content-text a, .article a{
-    color: #a5a5a5;
-  }
-  
-  .post-content-text a:hover, .article a:hover{
-    color: #c6c9c8;
-  }
-
-  .article li{
-    font-size: 1.125rem;
-    font-family: "Inter", sans-serif;
-    line-height: 1.7;
-    color:#e2e2e2
-  }
-
-  .article h3{
-    font-weight: 400;
-   
-  }
-
-  .article h4{
-    color: #fff !important;
-   
-  }
-
-  .main-title {
-    font-family: "Inter", sans-serif;
-  }
-
-
-/* button:hover :is(:where(a)) {
-  color: #5e5e5e;
-} */
-
-button :is(:where(p)) {
-  color: #ddd;
-  font-weight: 400;
-}
-
-button a {
-  line-height: 1.3;
-  @apply
-  text-black
-  px-8
-}
-
-.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;
-}
-
-header {
-  font-family: "Inter", sans-serif;
-}
-
-.nav_btn {
-  margin: 0 !important;
-  border: none !important;
-  box-shadow: none !important;
-}
-
-.quicklinks {
-  box-sizing: border-box;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  width: auto;
-  margin: 0 auto;
-  border-radius: 10px;
-  margin-top: 30px;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-bottom: 20px;
-}
-.quicklinks img {
-  height: auto;
-  max-width: 200px;
-  display: inline-block;
-  padding: 10px;
-  -webkit-filter: grayscale(100%);
-  filter: grayscale(100%);
-  position: relative;
-  
-  -webkit-transition: all 0.2s ease;
-  transition: all 0.2s ease;
-  opacity: 0.5;
-}
-
-.quicklinks img:hover {
-  opacity: 1;
-  -webkit-transition: all 0.2s ease;
-  transition: all 0.2s ease;
-  -webkit-filter: grayscale(0%);
-  filter: grayscale(0%);
-}
-
-
-.banner {
-  width: 100%;
-  margin: 0;
-  padding: 120px 0;
-  text-align: center;
-  position: relative;
-  display: block;
-  color: #fff !important;
-  letter-spacing: 0.5px;
-  overflow: hidden;
-  background: #00838d;
-  transition: 1.5s;
-}
-
-.header {
-  height: auto;
-  background: none;
-  padding: 200px 0;
-}
-
-.banner h2,
-.header h1 {
-  margin: auto;
-  color: #fff;
-  position: relative;
-  transition: 0.3s;
-  z-index: 1;
-  white-space: nowrap;
-}
-
-.header h1 {
-  color: #000;
-  transition: none;
-}
-
-.banner h2 svg {
-  font-size: 40px;
-  margin-left: 15px;
-  position: absolute;
-  top: 55%;
-  transform: translateY(-50%) scale(0.5);
-  opacity: 0;
-  transition: 0.3s;
-}
-
-.banner .back {
-  width: 100%;
-  height: 100%;
-  position: absolute;
-  top: 0;
-  left: 0;
-  background-position: center;
-  background-size: cover;
-  filter: grayscale(1) contrast(1.4);
-  opacity: 0.25;
-  transition: 1.5s;
-}
-
-.header .back {
-  filter: none;
-  opacity: 1;
-  background-position: center;
-
-  background-size: cover;
-  background-repeat: no-repeat;
-}
-
-.banner:hover {
-  background: #4b3a92;
-}
-
-.header:hover {
-  background: none;
-}
-
-.banner:hover h2 svg {
-  transform: translateY(-50%) scale(1);
-  opacity: 1;
-}
-
-.banner:hover h2 {
-  padding-right: 40px;
-}
-
-.header:hover h1 {
-  padding-right: 0;
-}
-
-.banner:hover .back {
-  transform: scale(1.03);
-}
-
-.header:hover .back {
-  transform: none;
-}
-
-.my-test{
-  font-family: "Inter", sans-serif;
-} 
-.post-content-text .my-test  {
-  font-family: "Inter", sans-serif;
-  line-height: 1.7;
-}
-
-.post-content-text h2 {
-  font-family: "Inter", sans-serif;
-  line-height: 1.5;
-  font-size: 2.25rem;
-  font-weight: 700;
-}
-.container-fluid {
-  width: 100%;
-  /* padding-right: 15px;
-  padding-left: 15px; */
-  margin-right: auto;
-  margin-left: auto;
-}
-
-.zola-anchor {
-  display: none;
-}
-@media (min-width: 1024px){
-  h2 {
-    font-size: 3.5rem;
-  } 
-  
-}
-
-@media (max-width: 1024px) {
-
-  .mycard{
-    height: auto !important;
-  }
-
-}
-
-@media (max-width: 640px) {
-  .banner h2 {
-    font: 600 7vw/10vw;
-  }
-
-  .header h1 {
-    font-size: 35px;
-  }
-
-  .banner h2 svg {
-    font-size: 30px;
-  }
-  .arrow img{
-    -moz-transform:rotate(90deg);
-   -webkit-transform:rotate(90deg);
-   -ms-transform:rotate(90deg);
-   transform: rotate(90deg);   
-   }
-
-   .mycard{
-    height: auto !important;
-  }
-}
-
-@media (max-width: 480px) {
-  .banner,
-  .header {
-    padding: 80px 0;
-  }
-
-  .article h2{
-    font-size: 1.5rem;
-  }
-
-  img[src*="#medium"] {
-    width: 250px;
-    margin: auto;
-  }
-
-  img[src*="#sm_none"] {
-    display: none;
-  }
-
-  .big_header{
-    font-size: 4rem !important;
-   
-  }
-
-  .mytest{
-    height: auto;
-  }
-
-  .card_h {
-         height: auto !important;
-  }
-
-  .mycard{
-    height: auto !important;
-  }
-
-  .key_card{
-    height: auto;
-  }
-
-  .mypartners{
-    height: auto;
-  
-  }
-  
-}
-

templates/partials/footer.html

@@ -12,8 +12,8 @@
                         {# <img class="w-36 h-auto" src="images/mycelium_white.png" alt="MYCELIUM Logo" /> #}
                         <a href="/" class="flex">
 
-                            <img id="lightLogo" src="/images/mycelium_white.png" alt="Light Logo" class="logo light w-36 h-auto" style="max-width: none;">
-                            <img id="darkLogo" src="/images/mycelium_dark.png" alt="Dark Logo" class="logo dark w-36 h-auto" style="max-width: none;">
+                            <img id="lightLogo" src="{{ get_url(path='/images/mycelium_white.png') }}" alt="Light Logo" class="logo light w-36 h-auto" style="max-width: none;">
+                            <img id="darkLogo" src="{{ get_url(path='/images/mycelium_dark.png') }}" alt="Dark Logo" class="logo dark w-36 h-auto" style="max-width: none;">
 
                             
                           </a>

templates/partials/head.html

@@ -5,13 +5,6 @@
 {% set zolaVer = '0.13.0' %}
 <head>
     <link rel="icon" type="image/x-icon" href="{{ get_url(path='images/icons/favicon.png')}}">
-    <!-- Primary CSS link with Zola URL function -->
-    <link rel="stylesheet" href="{{ get_url(path='css/index.css', trailing_slash=false, cachebust=true) | safe }}">
-    
-    <!-- Fallback CSS links in case the Zola URL function doesn't work in production -->
-    <link rel="stylesheet" href="/css/index.css">
-    <link rel="stylesheet" href="https://www3.mycelium.threefold.io/css/index.css">
-    <link rel="stylesheet" href="/index.css">
     {% block title %}
     <title>{{ config.title }}</title>
     <meta property="og:type" content="website">
@@ -106,7 +99,7 @@
     <!-- Windows 8.1 and up, IE 11 -->
     <!-- **** CONCLUSION, favicons **** -->
     <!-- CSS/SCSS -->
-    
+    <link rel="stylesheet" href="{{ get_url(path='css/index.css', trailing_slash=false, cachebust=true) | safe }}">
     <style>
     .space-x-10>:not([hidden])~:not([hidden]){
       margin-left: calc(1.5rem*calc(1 - var(--tw-space-x-reverse)))!important;
@@ -134,5 +127,27 @@
   }
     </style>
     <script type="text/javascript" src="https://platform-api.sharethis.com/js/sharethis.js#property=62556aac80366d0019fc1af2&product=sop" async="async"></script>
+    <!-- MailerLite Universal -->
+    <script>
+    (function (m, a, i, l, e, r) {
+      m['MailerLiteObject'] = e; function f() {
+        var c = { a: arguments, q: [] }; var r = this.push(c); return "number" != typeof r ? r : f.bind(c.q);
+      }
+      f.q = f.q || []; m[e] = m[e] || f.bind(f.q); m[e].q = m[e].q || f.q; r = a.createElement(i);
+      var _ = a.getElementsByTagName(i)[0]; r.async = 1; r.src = l + '?v' + (~~(new Date().getTime() / 1000000));
+      _.parentNode.insertBefore(r, _);
+    })(window, document, 'script', 'https://static.mailerlite.com/js/universal.js', 'ml');
 
+    var ml_account = ml('accounts', '1778010', 'x2d3d9f8n1', 'load');
+  </script>
+  <!-- End MailerLite Universal -->
+  <!-- RSS feed -->
+  {% block rss %}
+  <link
+      rel="alternate"
+      type="application/rss+xml"
+      title="RSS"
+      href="{{ get_url(path='atom.xml', trailing_slash=false) }}"
+  >
+  {% endblock %}
 </head>

templates/partials/header.html

@@ -74,10 +74,7 @@
                 {% endif %}  
             {% endif %}
             {% endfor %}
-                <a href="https://threefold.info/mycelium/docs/" 
-                class="text-lg py-3 leading-6 font-light text-pretty tracking-wide  focus:outline-none focus:text-gray-200 transition ease-in-out duration-150" target="_blank">
-                Docs
-                </a>
+
             </nav>
 
             <div class="hidden md:inline-block md:order-last">
@@ -225,10 +222,6 @@
                           </p>
                           {% include "partials/socialLinks.html" %}
                       </div> #}
-                      <a href="https://threefold.info/mycelium/docs/" 
-                      class="text-lg px-8 py-3 leading-6 font-normal  hover:text-gray-600 focus:outline-none focus:text-gray-50 transition ease-in-out duration-150" target="_blank">
-                      Docs
-                      </a>
                       <div class="rounded-full border-2 my-4 border-gray-400 py-2 mx-4">
                         <a href="/download" class="mt-2 rounded-md px-4 py-2.5 text-lg font-semibold  shadow-sm hover:text-gray-300 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white">Get Mycelium</a>
                       </div>
@@ -259,7 +252,7 @@
 }
 
 .active{
-  color: rgb(100, 100, 100) !important;
+  color: rgb(144 143 143) !important
 }
 .nav_btn:hover {
   color: #c7c7c7 !important;

templates/shortcodes/cta.html

@@ -20,7 +20,7 @@
         </div>
       </div>
       <div class="relative mt-16 h-80 lg:mt-8">
-        <img class="absolute top-0 left-0 w-[25rem] lg:w-[45rem] max-w-none rounded-2xl ring-1 ring-white/10" src="{{ image_src }}" alt="{{ image_alt }}" width="1824" height="1080">
+        <img class="absolute top-0 left-0 w-[25rem] lg:w-[45rem] max-w-none rounded-2xl ring-1 ring-white/10" src="{{ get_url(path=image_src) }}" alt="{{ image_alt }}" width="1824" height="1080">
       </div>
     </div>
   </div>

templates/shortcodes/feature_card.html

@@ -9,7 +9,7 @@
 <div class="card relative shadow rounded-lg p-4 transition-all duration-300">
   {% if icon %}
   <div class="flex items-center justify-center h-12 w-12 rounded-md mb-4">
-    <img src="{{ icon | safe }}" class="">
+    <img src="{{ get_url(path=icon) }}" class="">
   </div>
   {% endif %}
   <h3 class="text-lg font-medium">{{ title }}</h3>

templates/shortcodes/hero.html

@@ -28,7 +28,7 @@
     </div>
     </div>
     <div class="relative lg:col-span-5 lg:-mr-8 xl:absolute xl:inset-0 xl:left-1/2 xl:mr-0 ">
-      <img class="lg:mt-10 aspect-1/1 mx-auto w-full sm:w-2/3 md:w-1/2 lg:w-full object-cover lg:absolute lg:inset-0 lg:aspect-auto" src="{{ image_src }}" alt="{{ image_alt }}">
+      <img class="lg:mt-10 aspect-1/1 mx-auto w-full sm:w-2/3 md:w-1/2 lg:w-full object-cover lg:absolute lg:inset-0 lg:aspect-auto" src="{{ get_url(path=image_src) }}" alt="{{ image_alt }}">
     </div>
   </div>
 </div>

templates/shortcodes/hero_bottom_img.html

@@ -8,7 +8,7 @@
     </div>
     <div class="relative overflow-hidden pt-2">
       <div class="mx-auto max-w-7xl px-4 lg:px-8 flex items-center justify-center">
-        <img src="{{ image_src }}" alt="{{ image_alt }}"  width="900">
+        <img src="{{ get_url(path=image_src) }}" alt="{{ image_alt }}"  width="900">
       </div>
     </div>
   

templates/shortcodes/hero_features.html

@@ -9,7 +9,7 @@
           </div>
         <div class="mx-auto max-w-7xl lg:flex lg:items-center lg:gap-x-15 lg:px-8">
           <div class="my-6 lg:my-0 lg:flex lg:justify-center lg:w-1/2">
-            <img class="w-full max-w-lg h-auto object-cover rounded-xl" src="{{ image_src }}" 
+            <img class="w-full max-w-lg h-auto object-cover rounded-xl" src="{{ get_url(path=image_src) }}"
                 alt="{{ image_alt }}">
         </div>
             <div class="mx-auto max-w-lg lg:mx-0 lg:flex-auto pt-4">

templates/shortcodes/text_right_img.html

@@ -13,7 +13,7 @@
 
         <div class="mx-auto mt-10 lg:mt-0  lg:flex lg:items-center lg:gap-x-15 ">
              <div class="mt-6 lg:mt-0 lg:flex lg:justify-center lg:w-1/2">
-                <img class="w-full max-w-md h-auto object-cover rounded-xl" src="{{ image_src }}" 
+                <img class="w-full max-w-md h-auto object-cover rounded-xl" src="{{ get_url(path=image_src) }}"
                     alt="{{ image_alt }}">
             </div>
             <div class="mx-auto max-w-xl lg:mx-6 lg:flex-auto">