ourworld_web/www_mycelium
20
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'development' of https://git.ourworld.tf/ourworld_web/www_mycelium into development
Some checks are pending
www2.threefold_io / Deploy (push) Waiting to run
Details
www2.threefold_io / Wait for Website Update (push) Blocked by required conditions
Details
www2.threefold_io / Check for Broken Links (push) Blocked by required conditions
Details

Browse Source
This commit is contained in:
sasha-astiadi 2025-02-28 01:06:16 +08:00
commit 8e2fb27126
19 changed files with 174 additions and 137 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
content/footer/_index.md
View File

@ -14,31 +14,13 @@ extra:
<br> <br>
###### [Learn](https://docs.threefold.io/docs/introduction) ###### [Manual](https://manual.grid.tf/)
###### [Host (Farm)](https://docs.threefold.io/docs/category/become-a-farmer)
###### [Dashboard](https://dashboard.grid.tf/) ###### [Dashboard](https://dashboard.grid.tf/)
###### [Download TF Connect: iOS](https://apps.apple.com/us/app/3bot-login/id1459845885) <h6><a target="_self" onclick="window.location.href='/download'">Download Mycelium</a></h6>
###### [Download TF Connect: Android](https://play.google.com/store/apps/details?id=org.jimber.threebotlogin&hl=en_US)
|||
##### <span class="text-black">COMMUNITY</span>
<br>
###### [Main Chat](https://t.me/threefold)
###### [Hosting / Farming Chat](https://t.me/threefoldfarmers)
###### [Grid User Chat](https://t.me/threefoldtesting)
###### [Forum](https://forum.threefold.io/)
###### [Support](https://threefoldfaq.crisp.help/en/)
||| |||
@ -48,13 +30,9 @@ extra:
<h6><a target="_self" onclick="window.location.href='/about'">About</a></h6> <h6><a target="_self" onclick="window.location.href='/about'">About</a></h6>
<h6><a target="_self" onclick="window.location.href='/blog'">Blog</a></h6> ###### [ThreeFold](https://threefold.io/)
<h6><a target="_self" onclick="window.location.href='/newsroom'">NewsRoom</a></h6> ###### [Support](https://threefoldfaq.crisp.help/en/)
<h6><a target="_self" href="javascript:;" onclick="ml_account('webforms', '3562741', 'n7q9l7', 'show')">Newsletter</a></h6>
<h6><a target="_self" onclick="window.location.href='/community'">Community</a></h6>

40
env.sh
View File

@ -1,3 +1,4 @@
export NAME='threefoldio' export NAME='threefoldio'
SOURCE=${BASH_SOURCE[0]} SOURCE=${BASH_SOURCE[0]}
@ -42,7 +43,7 @@ if [[ ! -f "$HOME/hero/bin/tailwindcss" ]]; then
pushd /tmp pushd /tmp
rm -f $ASSET rm -f $ASSET
rm -f tailwindcss rm -f tailwindcss
curl -sLO "https://github.com/tailwindlabs/tailwindcss/releases/latest/download/${ASSET}" curl -sLO "https://github.com/tailwindlabs/tailwindcss/releases/download/v3.4.17/${ASSET}"
FILE_SIZE=$(get_file_size "$ASSET") FILE_SIZE=$(get_file_size "$ASSET")
if [[ $FILE_SIZE -lt 20000000 ]]; then if [[ $FILE_SIZE -lt 20000000 ]]; then
@ -59,6 +60,8 @@ if [[ ! -f "$HOME/hero/bin/tailwindcss" ]]; then
popd popd
fi fi
# Zola version and platform-specific binaries are handled in the install functions below
check_zola() { check_zola() {
if command -v zola &> /dev/null; then if command -v zola &> /dev/null; then
echo "Zola is already installed." echo "Zola is already installed."
@ -88,12 +91,37 @@ install_zola_arch() {
# Function to install Zola on macOS # Function to install Zola on macOS
install_zola_macos() { install_zola_macos() {
echo "Installing Zola on macOS..." echo "Installing Zola on macOS..."
if command -v brew &> /dev/null; then ZOLA_VERSION="v0.18.0"
brew install zola
# Determine architecture
if [[ "$(uname -m)" == "arm64" ]]; then
ZOLA_ARCH="aarch64"
else else
echo "Homebrew is not installed. Please install Homebrew first." ZOLA_ARCH="x86_64"
fi
ZOLA_FILE="zola-${ZOLA_VERSION}-${ZOLA_ARCH}-apple-darwin.tar.gz"
ZOLA_URL="https://github.com/getzola/zola/releases/download/${ZOLA_VERSION}/${ZOLA_FILE}"
echo "Downloading Zola ${ZOLA_VERSION} for ${ZOLA_ARCH}..."
pushd /tmp
curl -sLO "${ZOLA_URL}"
# Check file size (should be around 8-9MB)
FILE_SIZE=$(get_file_size "$ZOLA_FILE")
if [[ $FILE_SIZE -lt 7000000 ]]; then
echo "Error: Downloaded file size is less than 7MB, download may be incomplete."
rm "$ZOLA_FILE"
popd
exit 1 exit 1
fi fi
# Extract and install
tar -xzf "$ZOLA_FILE"
chmod +x zola
mv zola "$HOME/hero/bin/"
rm "$ZOLA_FILE"
popd
} }
if ! check_zola; then if ! check_zola; then
@ -131,6 +159,6 @@ fi
# Compile tailwindcss for prod & build project # Compile tailwindcss for prod & build project
echo "Compiling tailwindcss and building zola project..." echo "Compiling tailwindcss and building zola project..."
rm -rf public static/css rm -rf public static/css
set +e
tailwindcss -i css/index.css -o ./static/css/index.css --minify tailwindcss -i css/index.css -o ./static/css/index.css --minify

14
templates/partials/about/about1.html
View File

@ -1,8 +1,11 @@
<div class=" fade-in"> <div class=" fade-in">
<div class="relative isolate"> <div class="relative isolate">
<div class="mx-auto max-w-7xl px-6 py-24 lg:flex lg:items-center lg:gap-x-20 lg:px-8"> <div class="mx-auto max-w-7xl px-6 lg:py-24 py-12 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
<div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto"> <div class="my-6 lg:my-16 sm:mt-24 lg:mt-0 lg:flex lg:justify-center lg:w-1/2 lg:order-2">
<img class="w-full max-w-lg h-auto object-cover rounded-xl" src="/images/mycel5.jpg"
alt="Mobile App Screenshot">
</div>
<div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto lg:order-1">
<h1 class="mt-2 text-4xl font-semibold tracking-tight text-black lg:text-6xl"> <h1 class="mt-2 text-4xl font-semibold tracking-tight text-black lg:text-6xl">
About Mycelium About Mycelium
</h1> </h1>
@ -13,10 +16,7 @@
We aim to build a system that adapts to our growing digital needs while promoting sustainability and security. We aim to build a system that adapts to our growing digital needs while promoting sustainability and security.
</p> </p>
</div> </div>
<div class="mt-16 sm:mt-24 lg:mt-0 lg:flex lg:justify-center lg:w-1/2">
<img class="w-full max-w-lg h-auto object-cover rounded-xl" src="/images/mycel5.jpg"
alt="Mobile App Screenshot">
</div>
</div> </div>
</div> </div>
</div> </div>

4
templates/partials/about/about2.html
View File

@ -1,5 +1,5 @@
<div class="relative bg-white isolate overflow-hidden py-12"> <div class="relative bg-white isolate overflow-hidden py-12">
<div class="mx-auto max-w-7xl px-6 lg:px-8"> <div class="mx-auto max-w-7xl px-4 lg:px-8">
<div> <div>
<h1 class="fade-in text-balance text-4xl font-medium tracking-tight text-black lg:text-5xl">Our Technology <h1 class="fade-in text-balance text-4xl font-medium tracking-tight text-black lg:text-5xl">Our Technology
</h1> </h1>

19
templates/partials/about/about3.html
View File

@ -1,7 +1,12 @@
<div class=" fade-in"> <div class=" fade-in py-12">
<div class="relative isolate"> <div class="relative isolate">
<div class="mx-auto max-w-7xl px-6 py-12 lg:flex lg:items-center lg:gap-x-20 lg:px-8"> <div class="mx-auto max-w-7xl px-4 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
<div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto"> <div class="mb-6 lg:flex lg:justify-center lg:w-1/2 lg:order-2">
<img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/efficient.jpeg"
alt="Mobile App Screenshot">
</div>
<div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto lg:order-1">
<p class="text-base/7 font-light text-black tracking-wide">BENEFITS</p> <p class="text-base/7 font-light text-black tracking-wide">BENEFITS</p>
<h2 class="text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">Highly Efficient</h2> <h2 class="text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">Highly Efficient</h2>
<h3 class="mt-6 font-light text-black lg:text-3xl text-xl"> <h3 class="mt-6 font-light text-black lg:text-3xl text-xl">
@ -11,12 +16,8 @@
Mycelium's routing algorithms prioritize minimizing latency in data transfer. This ensures that data takes the most direct and efficient route, reducing the time it takes to travel from the source node to the destination node. Mycelium's routing algorithms prioritize minimizing latency in data transfer. This ensures that data takes the most direct and efficient route, reducing the time it takes to travel from the source node to the destination node.
</p> </p>
</div> </div>
<div class="mt-16 sm:mt-24 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="/images/about1.jpg"
alt="Mobile App Screenshot"> #}
<img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/efficient.jpeg"
alt="Mobile App Screenshot">
</div>
</div> </div>
</div> </div>
</div> </div>

6
templates/partials/about/about4.html
View File

@ -1,7 +1,7 @@
<div class=" fade-in bg-white"> <div class=" fade-in py-12">
<div class="relative isolate"> <div class="relative isolate">
<div class="mx-auto max-w-7xl px-6 py-24 lg:flex lg:items-center lg:gap-x-20 lg:px-8"> <div class="mx-auto max-w-7xl px-4 lg:py-24 py-12 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
<div class="mt-16 sm:mt-24 lg:mt-0 lg:flex lg:justify-center lg:w-1/2"> <div class="my-6 lg:flex lg:justify-center lg:w-1/2">
{# <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/about3.jpg" {# <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/about3.jpg"
alt="Mobile App Screenshot"> #} alt="Mobile App Screenshot"> #}
<img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/security.jpeg" <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/security.jpeg"

16
templates/partials/about/about5.html
View File

@ -1,7 +1,11 @@
<div class=" fade-in"> <div class=" fade-in py-12">
<div class="relative isolate"> <div class="relative isolate">
<div class="mx-auto max-w-7xl px-6 py-24 lg:flex lg:items-center lg:gap-x-20 lg:px-8"> <div class="mx-auto max-w-7xl px-4 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
<div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto"> <div class="my-6 lg:flex lg:justify-center lg:w-1/2 lg:order-2">
<img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/scalability.jpeg"
alt="Mobile App Screenshot">
</div>
<div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto lg:order-1">
<p class="text-base/7 font-light text-black tracking-wide">BENEFITS</p> <p class="text-base/7 font-light text-black tracking-wide">BENEFITS</p>
<h2 class="text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">Enhances Scalability</h2> <h2 class="text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">Enhances Scalability</h2>
<h3 class="mt-6 font-light text-black lg:text-3xl text-xl"> <h3 class="mt-6 font-light text-black lg:text-3xl text-xl">
@ -14,12 +18,6 @@
The system is designed to efficiently distribute network traffic. During periods of high demand or increased data transfer, Mycelium balances the load by routing data through multiple paths or nodes. This ensures the network can handle greater traffic and more users without becoming overloaded. The system is designed to efficiently distribute network traffic. During periods of high demand or increased data transfer, Mycelium balances the load by routing data through multiple paths or nodes. This ensures the network can handle greater traffic and more users without becoming overloaded.
</p> </p>
</div> </div>
<div class="mt-16 sm:mt-24 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="/images/about4.jpg"
alt="Mobile App Screenshot"> #}
<img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/scalability.jpeg"
alt="Mobile App Screenshot">
</div>
</div> </div>
</div> </div>
</div> </div>

10
templates/partials/about/about6.html
View File

@ -1,7 +1,7 @@
<div class="bg-white fade-in"> <div class="fade-in py-12">
<div class="relative isolate px-6 lg:px-8"> <div class="relative isolate px-4 lg:px-8">
<div class="mx-auto max-w-4xl py-24"> <div class="mx-auto max-w-4xl">
<div class="text-center"> <div class="text-left lg:text-center">
<h2 class="fade-in text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">A Part of ThreeFold Ecosystem</h2> <h2 class="fade-in text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">A Part of ThreeFold Ecosystem</h2>
<h3 class="fade-in text-balance lg:text-3xl text-2xl font-normal tracking-tight text-black">An Integral Component of Sustainable Decentralization</h3> <h3 class="fade-in text-balance lg:text-3xl text-2xl font-normal tracking-tight text-black">An Integral Component of Sustainable Decentralization</h3>
<p class="mt-8 lg:text-lg font-light text-black sm:text-xl/8">Mycelium seamlessly integrates into the larger ThreeFold ecosystem, driving the shift toward sustainable and decentralized digital transformation. <p class="mt-8 lg:text-lg font-light text-black sm:text-xl/8">Mycelium seamlessly integrates into the larger ThreeFold ecosystem, driving the shift toward sustainable and decentralized digital transformation.
@ -9,4 +9,4 @@
</div> </div>
</div> </div>
</div> </div>
</div>

29
templates/partials/download/download1.html
View File

@ -13,9 +13,9 @@
</div> </div>
</div> </div>
<section class="pb-12"> <section class="pb-12">
<div class="max-w-6xl mx-8 lg:mx-auto"> <div class="max-w-7xl mx-8 lg:mx-auto">
<div class="mx-auto max-w-2xl lg:max-w-none"> <div class="mx-auto max-w-2xl lg:max-w-none">
<dl class="grid max-w-xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-3"> <dl class="grid max-w-xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-4">
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-transparent items-start"> <div class="fade-in-box flex flex-col p-8 rounded-2xl bg-transparent items-start">
<img src="/images/icons/apple.svg" alt="Apple" class="w-16 h-16 justify-start"> <img src="/images/icons/apple.svg" alt="Apple" class="w-16 h-16 justify-start">
<dt class="mt-2 flex items-starts gap-x-3 text-base lg:text-md rounded-2xl font-semibold text-black"> <dt class="mt-2 flex items-starts gap-x-3 text-base lg:text-md rounded-2xl font-semibold text-black">
@ -53,19 +53,20 @@
</p> </p>
</dd> </dd>
</div> </div>
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-transparent hover:bg-transparent items-start">
<img src="/images/icons/linux.png" alt="Android" class="w-16 h-16 justify-start">
<dt class="mt-2 flex items-center gap-x-3 text-base lg:text-md rounded-2xl font-semibold text-black">
Download for Linux
</dt>
<dd class="mt-1 flex flex-auto flex-col">
<p class="flex-auto leading-normal font-light text-black text-sm">
Download the Mycelium binary for Linux directly from its Github repository.</p>
<p class="mt-3">
<a href="https://github.com/threefoldtech/mycelium/releases/latest" target="_blank" class="text-sm/6 font-semibold text-black hover:text-gray-300">Download Now <span aria-hidden="true">→</span></a>
</dl>
</div> </div>
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-transparent hover:bg-transparent items-start"> </div>
<img src="/images/icons/linux.png" alt="Android" class="w-16 h-16 justify-start">
<dt class="mt-2 flex items-center gap-x-3 text-base lg:text-md rounded-2xl font-semibold text-black">
Download for Linux
</dt>
<dd class="mt-1 flex flex-auto flex-col">
<p class="flex-auto leading-normal font-light text-black text-sm">
Download the Mycelium binary for Linux directly from its Github repository.</p>
<p class="mt-3">
<a href="https://github.com/threefoldtech/mycelium/releases/latest" target="_blank" class="text-sm/6 font-semibold text-black hover:text-gray-300">Download Now <span aria-hidden="true">→</span></a>
</dl>
</div>
</div> </div>
</section> </section>

10
templates/partials/footer.html
View File

@ -6,17 +6,17 @@
<body> <body>
<div class="mt-20 border-t border-gray-700"></div> <div class="mt-20 border-t border-gray-700"></div>
<footer class="bg-transparent"> <footer class="bg-transparent">
<div class="max-w-screen-2xl mx-auto py-12 px-4 sm:px-6"> <div class="max-w-7xl mx-auto py-12 px-4 sm:px-6">
<div class="xl:flex xl:gap-4"> <div class="grid max-w-xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-2">
<div class="space-y-8 lg:max-w-sm xl:max-w-sm lg:mr-8 lg:mb-8 xl:col-span-1"> <div class="grid-cols-4 space-y-8 lg:max-w-sm xl:max-w-sm lg:mr-8 lg:mb-8 xl:col-span-1">
<img class="w-36 h-auto" src="{{ get_url(path=logoPath)}}" alt="ThreeFold Logo" /> <img class="w-36 h-auto" src="{{ get_url(path=logoPath)}}" alt="ThreeFold Logo" />
<p class="text-gray-200 text-base font-light leading-6"> <p class="text-gray-200 text-base font-light leading-6">
{{section.description}} {{section.description}}
</p> </p>
{% include "partials/socialLinks.html" %} {# {% include "partials/socialLinks.html" %} #}
</div> </div>
<div class="mt-6 lg:mt-0 w-full px-8 sm:px-12 md:px-16 lg:px-20 footer-cust"> <div class="grid-cols-8 mt-6 lg:mt-0 w-full px-8 sm:px-12 md:px-16 lg:px-20 footer-cust">
{{ section.content | safe }} {{ section.content | safe }}
</div> </div>

4
templates/partials/header.html
View File

@ -111,7 +111,7 @@
</a> </a>
</li> </li>
</ul> #} </ul> #}
<a href="/download" target="_blank" class="blinking-effect dashboard rounded-2xl bg-black px-4 p-2 text-sm font-semibold text-white shadow-sm hover:bg-gray-600">Get Mycelium</a> <a href="/download" class="blinking-effect dashboard rounded-2xl bg-black px-4 p-2 text-sm font-semibold text-white shadow-sm hover:bg-gray-600">Get Mycelium</a>
</div> </div>
</div> </div>
</div> </div>
@ -204,7 +204,7 @@
Docs Docs
</a> </a>
<div class="rounded-full border-2 my-4 border-gray-400 py-2 mx-4"> <div class="rounded-full border-2 my-4 border-gray-400 py-2 mx-4">
<a href="/download" target="_blank" class="mt-2 rounded-md px-4 py-2.5 text-lg font-semibold text-black 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> <a href="/download" class="mt-2 rounded-md px-4 py-2.5 text-lg font-semibold text-black 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> </div>
</nav> </nav>
</div> </div>

4
templates/partials/hero/myhero.html
View File

@ -1,4 +1,4 @@
<div class="relative fade-in pt-20 mt-4 lg:mt-24 lg:pt-24 h-screen"> <div class="relative fade-in pt-10 mt-4 lg:mt-24 lg:pt-24 lg:h-screen">
<div class="mx-auto max-w-7xl lg:grid lg:grid-cols-12 lg:gap-x-8 lg:px-8"> <div class="mx-auto max-w-7xl lg:grid lg:grid-cols-12 lg:gap-x-8 lg:px-8">
<div class="px-6 lg:col-span-7 lg:px-0 xl:col-span-6"> <div class="px-6 lg:col-span-7 lg:px-0 xl:col-span-6">
<div class="mx-auto max-w-2xl lg:mx-0 lg:flex-auto"> <div class="mx-auto max-w-2xl lg:mx-0 lg:flex-auto">
@ -18,7 +18,7 @@
</div> </div>
</div> </div>
<div class="relative lg:col-span-5 lg:-mr-8 xl:absolute xl:inset-0 xl:left-1/2 xl:mr-0 "> <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 md:w-1/2 lg:w-full object-cover lg:absolute lg:inset-0 lg:aspect-auto" src="/images/mycel_1.png" 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="/images/mycel_1.png" alt="">
</div> </div>
</div> </div>
</div> </div>

6
templates/partials/hero/myhero1.html
View File

@ -1,7 +1,7 @@
<div class="pb-24 fade-in bg-semi-white"> <div class="py-24 lg:pt-0 fade-in bg-semi-white">
<div class="relative isolate"> <div class="relative isolate">
<div class="mx-auto max-w-7xl px-6 lg:flex lg:items-center lg:gap-x-15 lg:px-8"> <div class="mx-auto mt-10 lg:mt-0 max-w-7xl px-6 lg:flex lg:items-center lg:gap-x-15 lg:px-8">
<div class="mx-auto max-w-lg lg:mx-0 lg:flex-auto"> <div class="mx-auto max-w-lg lg:mx-0 lg:flex-auto">
<p class="text-base/7 font-light text-black tracking-wide">ABOUT</p> <p class="text-base/7 font-light text-black tracking-wide">ABOUT</p>
<h2 class="fade-in text-balance lg:text-5xl text-4xl font-normal tracking-tight text-black">Discover Mycelium</h2> <h2 class="fade-in text-balance lg:text-5xl text-4xl font-normal tracking-tight text-black">Discover Mycelium</h2>
@ -13,7 +13,7 @@
</div> </div>
</div> </div>
<div class="lg:order-first mt-16 sm:mt-24 lg:mt-0 lg:flex lg:justify-center lg:w-1/2"> <div class="lg:order-first mt-6 lg:mt-0 lg:flex lg:justify-center lg:w-1/2">
<img class="w-full max-w-lg h-auto object-cover rounded-xl" src="/images/mycel2.png" <img class="w-full max-w-lg h-auto object-cover rounded-xl" src="/images/mycel2.png"
alt="Mobile App Screenshot"> alt="Mobile App Screenshot">
</div> </div>

27
templates/partials/hero/myhero2.html
View File

File diff suppressed because one or more lines are too long

19
templates/partials/hero/myhero3.html
View File

@ -1,14 +1,18 @@
<div class=" fade-in bg-white"> <div class="fade-in bg-white">
<div class="lg:py-12 relative isolate"> <div class="lg:py-24 py-12 relative isolate">
<div class=" mx-auto max-w-2xl px-6 lg:max-w-7xl lg:px-8 pb-24"> <div class=" mx-auto max-w-2xl px-6 lg:max-w-7xl lg:px-8 lg:pb-24">
<p class="text-base/7 font-light text-black tracking-wide">HOW IT WORKS</p> <p class="text-base/7 font-light text-black tracking-wide">HOW IT WORKS</p>
<h2 class="fade-in text-balance lg:text-5xl text-4xl font-normal tracking-tight text-black">How Mycelium Operates</h2> <h2 class="fade-in text-balance lg:text-5xl text-4xl font-normal tracking-tight text-black">How Mycelium Operates</h2>
<p class="text-left mt-4 text-pretty lg:text-lg text-md font-light text-black fade-in max-w-3xl"> <p class="text-left mt-4 text-pretty lg:text-lg text-md font-light text-black fade-in max-w-3xl">
Mycelium, like its natural namesake, thrives on decentralization, efficiency, and security, making it a truly powerful force in the world of decentralized networks. Mycelium, like its natural namesake, thrives on decentralization, efficiency, and security, making it a truly powerful force in the world of decentralized networks.
</p> </p>
</div> </div>
<div class="mx-auto max-w-7xl px-6 lg:flex lg:items-center lg:gap-x-15 lg:px-8"> <div class="mx-auto max-w-7xl lg:flex lg:items-center lg:gap-x-15 lg:px-8">
<div class="mx-auto max-w-lg lg:mx-0 lg:flex-auto"> <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="/images/feature6a.png"
alt="Mobile App Screenshot">
</div>
<div class="mx-auto max-w-lg lg:mx-0 lg:flex-auto pt-4">
<dl class="space-y-8 text-base/7 lg:max-w-none"> <dl class="space-y-8 text-base/7 lg:max-w-none">
<div class="relative pl-9"> <div class="relative pl-9">
<dt class="font-semibold lg:text-lg text-base text-black "> <dt class="font-semibold lg:text-lg text-base text-black ">
@ -32,10 +36,7 @@
</div> </div>
</dl> </dl>
</div> </div>
<div class="lg:order-first mt-16 sm:mt-24 lg:mt-0 lg:flex lg:justify-center lg:w-1/2">
<img class="w-full max-w-lg h-auto object-cover rounded-xl" src="/images/feature6a.png"
alt="Mobile App Screenshot">
</div>
</div> </div>
</div> </div>
</div> </div>

30
templates/partials/hero/myhero5.html
View File

@ -1,54 +1,54 @@
<div class="py-24 sm:py-32"> <div class="lg:py-24 py-12">
<div class="mx-auto max-w-7xl px-6 lg:px-8"> <div class="mx-auto max-w-7xl px-6 lg:px-8">
<div class="mx-auto max-w-4xl text-center"> <div class="mx-auto max-w-4xl text-left lg:text-center">
<p class="text-base/7 font-light text-black tracking-wide">WHAT'S NEW</p> <p class="text-base/7 font-light text-black tracking-wide">WHAT'S NEW</p>
<h2 class="fade-in text-balance lg:text-5xl text-4xl font-normal tracking-tight text-black"> Coming Soon: The Future of Mycelium</h2> <h2 class="fade-in text-balance lg:text-5xl text-4xl font-normal tracking-tight text-black"> Coming Soon: The Future of Mycelium</h2>
<p class="mt-6 text-lg font-light lg:text-xl">Mycelium is evolving to bring even more powerful decentralized features, designed to enhance your experience and expand possibilities. Be the first to explore what’s coming next by staying connected with our latest updates.</p> <p class="mt-6 text-lg font-light lg:text-xl">Mycelium is evolving to bring even more powerful decentralized features, designed to enhance your experience and expand possibilities. Be the first to explore what’s coming next by staying connected with our latest updates.</p>
</div> </div>
</div> </div>
<div class="relative overflow-hidden pt-10"> <div class="relative overflow-hidden pt-2">
<div class="mx-auto max-w-7xl px-6 lg:px-8 flex items-center justify-center"> <div class="mx-auto max-w-7xl px-4 lg:px-8 flex items-center justify-center">
<img src="/images/future.png" alt="App screenshot" width="900"> <img src="/images/future.png" alt="App screenshot" width="900">
</div> </div>
</div> </div>
<div class="mx-auto mt-10 max-w-7xl px-6 lg:px-8"> <div class="mx-auto mt-10 max-w-7xl px-6 lg:px-8">
<dl class="mx-auto grid max-w-2xl grid-cols-1 gap-x-6 gap-y-10 text-base/7 text-black sm:grid-cols-2 lg:mx-0 lg:max-w-none lg:grid-cols-3 lg:gap-x-8 lg:gap-y-16"> <dl class="mx-auto grid max-w-2xl grid-cols-1 gap-x-6 gap-y-4 text-base/7 text-black sm:grid-cols-2 lg:mx-0 lg:max-w-none lg:grid-cols-3 lg:gap-x-8 lg:gap-y-10">
<div class="relative pl-9"> <div class="relative lg:pl-9">
<dt class="inline font-semibold text-black"> <dt class="inline font-semibold text-black">
✓ QSFS Storage Functionality ✓ Quantum Safe Storage Functionality
</dt> </dt>
<dd class="font-light">Mycelium’s QSFS storage enables flexible, scalable, and efficient data distribution across a decentralized network, ensuring redundancy and security.</dd> <dd class="font-light">Mycelium’s quantum safe storage enables flexible, scalable, and efficient data distribution across a decentralized network, ensuring redundancy and security.</dd>
</div> </div>
<div class="relative pl-9"> <div class="relative lg:pl-9">
<dt class="inline font-semibold text-black"> <dt class="inline font-semibold text-black">
✓ Entry and Exit Points for AI Workloads ✓ Entry and Exit Points for AI Workloads
</dt> </dt>
<dd class="font-light">Seamlessly connect AI applications to Mycelium, providing optimized nd secured data pipelines for training, inference, and real-time processing.</dd> <dd class="font-light">Seamlessly connect AI applications to Mycelium, providing optimized nd secured data pipelines for training, inference, and real-time processing.</dd>
</div> </div>
<div class="relative pl-9"> <div class="relative lg:pl-9">
<dt class="inline font-semibold text-black"> <dt class="inline font-semibold text-black">
✓ Data Storage and Retrieval Mechanisms ✓ Data Storage and Retrieval Mechanisms
</dt> </dt>
<dd class="font-light">Users can choose between storing data locally for quick access or utilizing the distributed grid for enhanced scalability and resilience.</dd> <dd class="font-light">Users can choose between storing data locally for quick access or utilizing the distributed grid for enhanced scalability and resilience.</dd>
</div> </div>
<div class="relative pl-9"> <div class="relative lg:pl-9">
<dt class="inline font-semibold text-black"> <dt class="inline font-semibold text-black">
✓ Ability to Store Data on Behalf of Other Users ✓ Integrated Name Services (DNS)
</dt> </dt>
<dd class="font-light">Mycelium enables users to securely store and manage data for others, facilitating shared access while maintaining ownership and permissions.</dd> <dd class="font-light">The Integrated DNS system efficiently finds the shortest path between users and websites, automatically balancing loads and identifying alternative routes in case of internet issues.</dd>
</div> </div>
<div class="relative pl-9"> <div class="relative lg:pl-9">
<dt class="inline font-semibold text-black"> <dt class="inline font-semibold text-black">
✓ Frontend/Backend Integration ✓ Frontend/Backend Integration
</dt> </dt>
<dd class="font-light"> Mycelium provides seamless integration with existing applications, enabling developers to leverage decentralized storage across both frontend and backend architectures.</dd> <dd class="font-light"> Mycelium provides seamless integration with existing applications, enabling developers to leverage decentralized storage across both frontend and backend architectures.</dd>
</div> </div>
<div class="relative pl-9"> <div class="relative lg:pl-9">
<dt class="inline font-semibold text-black"> <dt class="inline font-semibold text-black">
✓ CDN (Content Delivery Network) ✓ CDN (Content Delivery Network)

31
templates/partials/hero/myhero6.html
View File

@ -52,6 +52,37 @@
</div> </div>
</div> </div>
</div> </div>
<div x-data="{ expanded: false }" class="py-2">
<h2>
<button
id="faqs-title-01"
type="button"
class="flex items-center justify-between w-full text-left font-semibold py-2 border-none"
@click="expanded = !expanded"
:aria-expanded="expanded"
aria-controls="faqs-text-01"
>
<span class="pl-4" style="color: #000;">Is mycelium ready to scale to the world?</span>
<svg class="fill-black shrink-0 ml-8" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
<rect y="7" width="16" height="2" rx="1" class="transform origin-center transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
<rect y="7" width="16" height="2" rx="1" class="transform origin-center rotate-90 transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
</svg>
</button>
</h2>
<div
id="faqs-text-01"
role="region"
aria-labelledby="faqs-title-01"
class="grid text-sm text-black overflow-hidden transition-all duration-300 ease-in-out"
:class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
>
<div class="overflow-hidden">
<p class="pb-3 text-black text-base font-light">
No, Mycelium is not yet fully scalable to a global level. Currently, each network can support around 100,000 users, but multiple networks can be deployed to expand capacity. We anticipate resolving these scalability challenges by 2025.
</p>
</div>
</div>
</div>
<!-- Accordion item --> <!-- Accordion item -->
<div x-data="{ expanded: false }" class="py-2"> <div x-data="{ expanded: false }" class="py-2">
<h2> <h2>

4
templates/partials/hero/myhero7.html
View File

@ -1,4 +1,4 @@
<div class="fade-in"> <div class="fade-in lg:pt-12">
<div class="mx-auto max-w-7xl py-12 sm:px-6 lg:px-8"> <div class="mx-auto max-w-7xl py-12 sm:px-6 lg:px-8">
<div class="relative isolate overflow-hidden bg-black px-6 pt-16 shadow-2xl sm:rounded-3xl sm:px-16 md:pt-24 lg:flex lg:gap-x-20 lg:px-24 lg:pt-0"> <div class="relative isolate overflow-hidden bg-black px-6 pt-16 shadow-2xl sm:rounded-3xl sm:px-16 md:pt-24 lg:flex lg:gap-x-20 lg:px-24 lg:pt-0">
<div class="mx-auto max-w-md text-center lg:mx-0 lg:flex-auto lg:py-32 lg:text-left"> <div class="mx-auto max-w-md text-center lg:mx-0 lg:flex-auto lg:py-32 lg:text-left">
@ -10,7 +10,7 @@
</div> </div>
</div> </div>
<div class="relative mt-16 h-80 lg:mt-8"> <div class="relative mt-16 h-80 lg:mt-8">
<img class="absolute top-0 left-0 w-[45rem] max-w-none rounded-2xl bg-white/5 ring-1 ring-white/10" src="/images/mycel3.png" alt="App screenshot" 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="/images/mycel3.png" alt="App screenshot" width="1824" height="1080">
</div> </div>
</div> </div>
</div> </div>

6
templates/partials/hero/myhero8.html
View File

@ -1,4 +1,4 @@
<div class="py-24 sm:py-32"> <div class="lg:py-24 py-12">
<div class="mx-auto max-w-7xl px-6 lg:px-8"> <div class="mx-auto max-w-7xl px-6 lg:px-8">
<div class="mx-auto"> <div class="mx-auto">
<p class="text-base/7 font-light text-black tracking-wide">WHAT IT ENABLES</p> <p class="text-base/7 font-light text-black tracking-wide">WHAT IT ENABLES</p>
@ -16,7 +16,7 @@
</div> </div>
</div> #} </div> #}
<div class="mx-auto mt-10 max-w-7xl"> <div class="mx-auto mt-10 max-w-7xl">
<dl class="mx-auto grid max-w-2xl grid-cols-1 gap-x-6 gap-y-10 text-base/7 text-black sm:grid-cols-2 lg:mx-0 lg:max-w-none lg:grid-cols-2 lg:gap-x-8 lg:gap-y-16"> <dl class="mx-auto grid max-w-2xl grid-cols-1 gap-x-6 gap-y-10 text-base/7 text-black sm:grid-cols-2 lg:mx-0 lg:max-w-none lg:grid-cols-2 lg:gap-x-8 lg:gap-y-8">
<div class="relative pl-9"> <div class="relative pl-9">
<dt class="inline font-semibold text-black"> <dt class="inline font-semibold text-black">
@ -72,7 +72,7 @@
</dl> </dl>
<hr class="my-6"> <hr class="my-6">
<div class="mx-auto mt-10 max-w-6xl"> <div class="mx-auto mt-10 px-6 lg:px-0 lg:max-w-6xl">
<a href="/download" class=" rounded-2xl bg-black px-6 py-2.5 text-sm font-semibold text-white shadow-xs hover:bg-gray-900 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-200">Get Started</a> <a href="/download" class=" rounded-2xl bg-black px-6 py-2.5 text-sm font-semibold text-white shadow-xs hover:bg-gray-900 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-200">Get Started</a>
</div> </div>
</div> </div>