update home and about
This commit is contained in:
parent
b3b9d41e8b
commit
c2c021531c
@ -1,7 +1,7 @@
|
|||||||
---
|
---
|
||||||
title: "Mycelium"
|
title: "Mycelium"
|
||||||
description: "Mycelium is a decentralized networking and storage solution designed to integrate seamlessly with AI workloads, content delivery, and messaging." # quotation marks to allow colons where used
|
description: "Mycelium is a decentralized networking and storage solution designed to integrate seamlessly with AI workloads, content delivery, and messaging." # quotation marks to allow colons where used
|
||||||
template: "layouts/about.html"
|
template: "page.html"
|
||||||
insert_anchor_links: "left"
|
insert_anchor_links: "left"
|
||||||
extra:
|
extra:
|
||||||
author: ThreeFold
|
author: ThreeFold
|
||||||
@ -10,21 +10,101 @@ extra:
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
|
||||||
This page is made by combining different 'section' (partial html pages) together.
|
|
||||||
To edit the page content, please go to specific 'section' that you would like to edit (stored inside templates/partials folders).
|
|
||||||
To see the list of the section blocks in this page, add or remove some of the partial pages,
|
|
||||||
go to: static/templates/layouts/why.html.
|
|
||||||
|
|
||||||
ABOUT / WHY PAGE (static/templates/layouts/why.html) contains:
|
|
||||||
|
|
||||||
1. About hero section: "templates/partials/about/about1.html"
|
|
||||||
2. benefit1 section: "templates/partials/about/about2.html"
|
|
||||||
3. benefit2 section: "templates/partials/about/about3.html"
|
|
||||||
4. benefit3 new section: "templates/partials/about/about4.html"
|
|
||||||
5. tf section: "templates/partials/about/about5.html"
|
|
||||||
6. faq section: "templates/partials/about/about6.html"
|
|
||||||
7. cta section: "templates/partials/hero/myhero7.html"
|
|
||||||
|
|
||||||
|
|
||||||
-->
|
<!-- section 1 -->
|
||||||
|
|
||||||
|
{{ hero_right_img(
|
||||||
|
image_src="/images/mycel5.jpg",
|
||||||
|
image_alt="Mobile App Screenshot",
|
||||||
|
title="About Mycelium",
|
||||||
|
subtitle="Redefining Digital Communication",
|
||||||
|
description_1="Mycelium is designed to improve how we connect and communicate in the digital world. Its goal is to create a secure, efficient, and scalable digital ecosystem where data flows seamlessly and remains protected.",
|
||||||
|
description_2="We aim to build a system that adapts to our growing digital needs while promoting sustainability and security."
|
||||||
|
) }}
|
||||||
|
|
||||||
|
|
||||||
|
<!-- section 2 -->
|
||||||
|
|
||||||
|
{{ desciption_blockquote(
|
||||||
|
title="Our Technology",
|
||||||
|
description_1="Mycelium enables secure, efficient, and scalable data transfer between network nodes by optimizing data routing. It ensures that information takes the shortest path with the lowest latency, resulting in faster and more efficient communication.",
|
||||||
|
description_2="The technology relies on end-to-end encryption, with each node uniquely identified by its own key pair, guaranteeing the security and privacy of data. This approach ensures that data remains confidential and authentic, strengthening the overall privacy and integrity of the network.",
|
||||||
|
description_3="Mycelium was created to overcome the limitations of traditional networking protocols while promoting a more sustainable and eco-friendly digital ecosystem. Its goal is to transform digital communication, making it not only efficient and secure but also environmentally responsible.",
|
||||||
|
description_4="The inspiration behind Mycelium comes from the need for a technology that can adapt to changing network conditions and continue to operate efficiently in a rapidly evolving digital landscape."
|
||||||
|
|
||||||
|
|
||||||
|
) }}
|
||||||
|
|
||||||
|
|
||||||
|
<!-- section 3 -->
|
||||||
|
|
||||||
|
{{ text_left_img(
|
||||||
|
image_src="/images/efficient.jpeg",
|
||||||
|
image_alt="Discover Mycelium",
|
||||||
|
title="Highly Efficient",
|
||||||
|
subheader="BENEFITS",
|
||||||
|
subtitle="Optimizing Data Routing",
|
||||||
|
description="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.",
|
||||||
|
description_2="",
|
||||||
|
button_text="",
|
||||||
|
button_link=""
|
||||||
|
) }}
|
||||||
|
|
||||||
|
|
||||||
|
<!-- section 4 -->
|
||||||
|
|
||||||
|
{{ text_right_img(
|
||||||
|
image_src="/images/security.jpeg",
|
||||||
|
image_alt="Discover Mycelium",
|
||||||
|
title="Enhancing Security",
|
||||||
|
subheader="BENEFITS",
|
||||||
|
subtitle="End-to-End Encryption",
|
||||||
|
description="Each node in the Mycelium network is assigned a unique key pair, consisting of a public and private key. The public key is used to encrypt data intended for that node, while the private key decrypts the data upon receipt. This cryptographic system ensures that only the intended recipient can access the information.",
|
||||||
|
description_2="When one node sends data to another within the Mycelium network, the data is encrypted with the recipient's public key. This ensures that even if the data is intercepted during transmission, it remains secure and unreadable without the corresponding private key.",
|
||||||
|
button_text="",
|
||||||
|
button_link=""
|
||||||
|
) }}
|
||||||
|
|
||||||
|
<!-- section 5 -->
|
||||||
|
|
||||||
|
{{ text_left_img(
|
||||||
|
image_src="/images/scalability.jpeg",
|
||||||
|
image_alt="Discover Mycelium",
|
||||||
|
title="Enhances Scalability",
|
||||||
|
subheader="BENEFITS",
|
||||||
|
subtitle="Designed to Adapt",
|
||||||
|
description="Mycelium is an open-source project built to adapt dynamically to changing network conditions. As new nodes join or existing nodes leave, the system adjusts seamlessly, allowing Mycelium to scale and support more participants without sacrificing performance.",
|
||||||
|
description_2="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.",
|
||||||
|
button_text="",
|
||||||
|
button_link=""
|
||||||
|
) }}
|
||||||
|
|
||||||
|
|
||||||
|
<!-- section 6 -->
|
||||||
|
|
||||||
|
{{ header_center(
|
||||||
|
title="A Part of ThreeFold Ecosystem",
|
||||||
|
subheader="BENEFITS",
|
||||||
|
subtitle="An Integral Component of Sustainable Decentralization",
|
||||||
|
description="Mycelium seamlessly integrates into the larger ThreeFold ecosystem, driving the shift toward sustainable and decentralized digital transformation. As a core pillar, it enhances the ThreeFold Grid with efficient, secure, and scalable networking solutions, contributing to a future where digital connectivity is both eco-conscious and accessible to all."
|
||||||
|
) }}
|
||||||
|
|
||||||
|
<!-- section 6 -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
{{ cta(
|
||||||
|
image_src="/images/mycel3.png",
|
||||||
|
image_alt="App screenshot",
|
||||||
|
title="Get Mycelium Today",
|
||||||
|
description="Join the Mycelium network and be a part of the decentralized movement.",
|
||||||
|
button_text="Download Now",
|
||||||
|
button_link="/download",
|
||||||
|
button_text2="Read More",
|
||||||
|
button_link2="https://threefold.info/mycelium/docs/"
|
||||||
|
) }}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -8,20 +8,307 @@ extra:
|
|||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<!--
|
<!-- Hero section 1 -->
|
||||||
This page is made by combining different 'section' (partial html pages) together.
|
|
||||||
To edit the page content, please go to specific 'section' that you would like to edit (stored inside templates/partials folders).
|
{{ hero_right_img(
|
||||||
To see the list of the section blocks in this page, add or remove some of the partial pages,
|
image_src="/images/mycel_1.png",
|
||||||
go to: static/templates/layouts/index.html.
|
image_alt="Mycelium Network Graphic",
|
||||||
|
title="MYCELIUM",
|
||||||
|
subtitle="Unleashing the Power of Decentralized Networks",
|
||||||
|
description="Discover Mycelium, an end-to-end encrypted IPv6 overlay network. The future of secure, efficient, and scalable networking.",
|
||||||
|
highlight="Coming Soon: New Decentralized Features",
|
||||||
|
button_text="Get Mycelium",
|
||||||
|
button_link="/download"
|
||||||
|
) }}
|
||||||
|
|
||||||
|
|
||||||
|
<!-- section 2 -->
|
||||||
|
|
||||||
|
{{ text_right_img(
|
||||||
|
image_src="/images/mycel2.png",
|
||||||
|
image_alt="Discover Mycelium",
|
||||||
|
title="Discover Mycelium",
|
||||||
|
subtitle_1="ABOUT",
|
||||||
|
description="Mycelium is an unbreakable network, always finding the shortest path and providing 100% secure, peer-to-peer communication. But this is just the beginning.",
|
||||||
|
description_2="Our mission is to create a sustainable digital ecosystem where communication is seamless, data is secure, and scalability knows no bounds.",
|
||||||
|
button_text="Learn more",
|
||||||
|
button_link="/about"
|
||||||
|
) }}
|
||||||
|
|
||||||
|
|
||||||
|
<!-- section 3 -->
|
||||||
|
|
||||||
|
{{ hero_features(
|
||||||
|
image_src="/images/feature6a.png",
|
||||||
|
image_alt="How Mycelium Operates",
|
||||||
|
subtitle_1="HOW IT WORKS",
|
||||||
|
title="How Mycelium Operates",
|
||||||
|
description="Mycelium, like its natural namesake, thrives on decentralization, efficiency, and security, making it a truly powerful force in the world of decentralized networks.",
|
||||||
|
|
||||||
|
feature_1_title="Decentralized Nodes",
|
||||||
|
feature_1_description="Mycelium operates through a network of decentralized nodes, similar to how nature's mycelium forms a decentralized network of threads. Each node acts as a connection point in the overall digital ecosystem.",
|
||||||
|
|
||||||
|
feature_2_title="Efficient Data Routing",
|
||||||
|
feature_2_description="Mycelium optimizes data routing by choosing the most efficient path for communication. Data travels along the shortest path in terms of latency, ensuring that information reaches its destination swiftly.",
|
||||||
|
|
||||||
|
feature_3_title="End-to-End Encryption",
|
||||||
|
feature_3_description="Each node in the system is identified by a unique key pair. Data between nodes is encrypted using secret keys derived from these pairs. This ensures that data remains confidential, enhancing the privacy of the network."
|
||||||
|
) }}
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Section 4 -->
|
||||||
|
|
||||||
|
{{ left_header(
|
||||||
|
subtitle="WHAT IT ENABLES",
|
||||||
|
title="Powering Secure & Decentralized Connectivity",
|
||||||
|
description="Mycelium, a key component of the ThreeFold Grid, can be installed on any computer (macOS, Linux, Windows) and smartphone (iOS, Android). With seamless integration, it enables secure and private communication across devices.",
|
||||||
|
description2="The ThreeFold Dashboard offers dozens of applications with built-in Mycelium support, making it easy to deploy and utilize. Once installed, Mycelium provides a secure, encrypted network for a wide range of use cases, from private communication to decentralized infrastructure."
|
||||||
|
) }}
|
||||||
|
|
||||||
|
<div class="lg:max-w-7xl container mx-auto py-12 lg:pb-24 px-4">
|
||||||
|
<div class="mx-auto grid grid-cols-1 gap-x-6 gap-y-10 text-base 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 ">
|
||||||
|
|
||||||
|
###### **PRODUCTIVITY & COMMUNICATION**
|
||||||
|
|
||||||
|
<div class="mt-2">
|
||||||
|
|
||||||
|
- Secure remote work collaboration.
|
||||||
|
- Private file sharing between trusted nodes.
|
||||||
|
- Encrypted voice/video calls.
|
||||||
|
- Self-hosted messaging systems.
|
||||||
|
- Secure document collaboration.
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="relative ">
|
||||||
|
|
||||||
|
###### **INFRASTRUCTURE**
|
||||||
|
|
||||||
|
<div class="mt-2">
|
||||||
|
|
||||||
|
- Private cloud computing resources.
|
||||||
|
- Secure IoT device networks.
|
||||||
|
- Remote system administration..
|
||||||
|
- Virtual private networks (VPNs).
|
||||||
|
- Secure backup systems.
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="relative ">
|
||||||
|
|
||||||
|
###### **SERVICES**
|
||||||
|
|
||||||
|
<div class="mt-2">
|
||||||
|
|
||||||
|
- Self-hosted web services.
|
||||||
|
- Private file sharing between trusted nodes.
|
||||||
|
- Private DNS systems.
|
||||||
|
- Personal email servers.
|
||||||
|
- Secure document collaboration.
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="relative ">
|
||||||
|
|
||||||
|
###### **MEDIA & CONTENT**
|
||||||
|
|
||||||
|
<div class="mt-2">
|
||||||
|
|
||||||
|
- Private media streaming.
|
||||||
|
- Personal cloud storage.
|
||||||
|
- Protected content distribution.
|
||||||
|
- Secure game servers.
|
||||||
|
- Private git repositories.
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
---------------------------------------------
|
||||||
|
|
||||||
|
<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 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>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Section 5 -->
|
||||||
|
|
||||||
|
{{ hero_bottom_img(
|
||||||
|
image_src="/images/future.png",
|
||||||
|
image_alt="Coming Soon: The Future of Mycelium",
|
||||||
|
subtitle="WHAT'S NEW",
|
||||||
|
title="Coming Soon: The Future of Mycelium",
|
||||||
|
description="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."
|
||||||
|
) }}
|
||||||
|
|
||||||
|
<div class="lg:max-w-7xl container mx-auto lg:pb-24 pb-12">
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 my-12">
|
||||||
|
|
||||||
|
{{
|
||||||
|
feature_card(
|
||||||
|
title="✓ Quantum Safe Storage Functionality",
|
||||||
|
description="Mycelium's quantum safe storage enables flexible, scalable, and efficient data distribution across a decentralized network, ensuring redundancy and security.",
|
||||||
|
icon="") }}
|
||||||
|
|
||||||
|
{{ feature_card(
|
||||||
|
title="✓ Entry and Exit Points for AI Workloads",
|
||||||
|
description="Seamlessly connect AI applications to Mycelium, providing optimized nd secured data pipelines for training, inference, and real-time processing.",
|
||||||
|
icon="") }}
|
||||||
|
|
||||||
|
{{ feature_card(
|
||||||
|
title="✓ Data Storage and Retrieval Mechanisms",
|
||||||
|
description="Users can choose between storing data locally for quick access or utilizing the distributed grid for enhanced scalability and resilience.",
|
||||||
|
icon="") }}
|
||||||
|
|
||||||
|
{{ feature_card(
|
||||||
|
title="✓ Integrated Name Services (DNS)",
|
||||||
|
description="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.",
|
||||||
|
icon="") }}
|
||||||
|
|
||||||
|
{{ feature_card(
|
||||||
|
title="✓ Frontend/Backend Integration",
|
||||||
|
description="Mycelium provides seamless integration with existing applications, enabling developers to leverage decentralized storage across both frontend and backend architectures.",
|
||||||
|
icon="") }}
|
||||||
|
|
||||||
|
{{ feature_card(
|
||||||
|
title="✓ CDN (Content Delivery Network)",
|
||||||
|
description="Mycelium accelerates data distribution by acting as a decentralized CDN, ensuring fast, secure, and efficient content delivery across global nodes with minimal latency.",
|
||||||
|
icon="") }}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Section 6 -->
|
||||||
|
|
||||||
|
{{ left_header(
|
||||||
|
subtitle="BENEFITS",
|
||||||
|
title="Nature's Blueprint for Digital Connectivity",
|
||||||
|
description="Just as nature's mycelium network serves as a critical component in the ecosystems of forests, connecting trees and plants underground, the Mycelium technology offers reliable connectivity in an efficient and resilient way.",
|
||||||
|
description2=""
|
||||||
|
) }}
|
||||||
|
|
||||||
|
<div class="lg:max-w-7xl container mx-auto lg:pb-24 pb-12">
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 my-12">
|
||||||
|
{{
|
||||||
|
feature_card(
|
||||||
|
title="Decentralization",
|
||||||
|
description="Designed to operate in a decentralized manner, it connects nodes and enables efficient data transfer and communication without relying on a single central authority.",
|
||||||
|
icon="/images/decentralization.svg",
|
||||||
|
link="/about",
|
||||||
|
link_name="Learn More"
|
||||||
|
) }}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
{{ feature_card(
|
||||||
|
title="Efficiency",
|
||||||
|
description="Mycelium provides an efficient digital communication network where data travels along the most efficient paths, reducing latency and optimizing resource utilization.",
|
||||||
|
icon="/images/efficiency.svg",
|
||||||
|
link="/about",
|
||||||
|
link_name="Learn More"
|
||||||
|
|
||||||
|
) }}
|
||||||
|
|
||||||
|
{{ feature_card(
|
||||||
|
title="Resilience",
|
||||||
|
description="Inspired by nature's resilience, it creates a network that can adapt and continue to function even in the presence of challenges, ensuring uninterrupted communication.",
|
||||||
|
icon="/images/resilience.svg",
|
||||||
|
link="/about",
|
||||||
|
link_name="Learn More"
|
||||||
|
|
||||||
|
) }}
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Section 7 -->
|
||||||
|
|
||||||
|
<div class="lg:max-w-7xl container mx-auto lg:pb-24 pb-12">
|
||||||
|
|
||||||
|
{{ left_header(
|
||||||
|
subtitle="",
|
||||||
|
title="Frequently Asked Questions",
|
||||||
|
description="",
|
||||||
|
description2=""
|
||||||
|
) }}
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
{{ accordion(
|
||||||
|
question="What is Mycelium?",
|
||||||
|
description="Mycelium is an end-to-end encrypted IPv6 overlay network written in Rust. Each node joining the network receives an IP in the 400::/7 range, facilitating secure and private communications."
|
||||||
|
) }}
|
||||||
|
|
||||||
|
{{ accordion(
|
||||||
|
question="Is mycelium ready to scale to the world?",
|
||||||
|
description="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."
|
||||||
|
) }}
|
||||||
|
|
||||||
|
{{ accordion(
|
||||||
|
question="How do I install Mycelium?",
|
||||||
|
description="The Mycelium app supports iOS, macOS, Android and Windows. For Linux, a binary is available. Installation guides are available for both local machines and virtual machines running on the TFGrid. Note that Windows users need to have wintun.dll in the same directory as the Mycelium executable. Click here for more info."
|
||||||
|
) }}
|
||||||
|
|
||||||
|
{{ accordion(
|
||||||
|
question="How can I find and use my Mycelium address?",
|
||||||
|
description="Upon using the Mycelium app, you're assigned a unique Mycelium address. To copy this address, click the button located to the right of the displayed address in the app interface."
|
||||||
|
) }}
|
||||||
|
|
||||||
|
{{ accordion(
|
||||||
|
question="Can I deploy workloads on the TFGrid using Mycelium?",
|
||||||
|
description="Yes, after installing Mycelium, you can deploy workloads on the TFGrid and connect to them using the Mycelium network. Detailed deployment guides are available in the documentation."
|
||||||
|
) }}
|
||||||
|
|
||||||
|
{{ accordion(
|
||||||
|
question="Is there an API available for Mycelium?",
|
||||||
|
description="Yes, Mycelium offers an API for administrative operations, peer management, and message subsystem operations. Comprehensive API documentation can be found in the official Mycelium GitHub repository"
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
|
||||||
|
{{ accordion(
|
||||||
|
question="What should I do if I encounter issues during installation or usage?",
|
||||||
|
description="If you face any challenges, refer to the troubleshooting section in the Mycelium documentation. Additionally, ensure that all prerequisites are met, such as having wintun.dll in the correct directory for Windows installations."
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
|
||||||
|
{{ accordion(
|
||||||
|
question="How does Mycelium handle routing within its network?",
|
||||||
|
description="Mycelium incorporates core principles of the Babel routing protocol, enabling efficient and dynamic routing within its encrypted IPv6 overlay network."
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Section 8 -->
|
||||||
|
|
||||||
|
{{ cta(
|
||||||
|
image_src="/images/mycel3.png",
|
||||||
|
image_alt="App screenshot",
|
||||||
|
title="Get Mycelium Today",
|
||||||
|
description="Join the Mycelium network and be a part of the decentralized movement.",
|
||||||
|
button_text="Download Now",
|
||||||
|
button_link="/download",
|
||||||
|
button_text2="Read More",
|
||||||
|
button_link2="https://threefold.info/mycelium/docs/"
|
||||||
|
) }}
|
||||||
|
|
||||||
|
|
||||||
HOMEPAGE (static/templates/layouts/index.html) contains:
|
|
||||||
|
|
||||||
1. Hero section: "templates/partials/hero/myhero.html
|
|
||||||
2. About section: "templates/partials/hero/myhero1.html"
|
|
||||||
3. How it works section: "templates/partials/hero/myhero3.html"
|
|
||||||
4. whats new section: "templates/partials/hero/myhero5.html
|
|
||||||
5. benefits section: "templates/partials/hero/myhero2.html"
|
|
||||||
6. faq section: "templates/partials/hero/myhero6.html"
|
|
||||||
6. cta section: "templates/partials/hero/myhero7.html"
|
|
||||||
|
|
||||||
-->
|
|
||||||
@ -263,12 +263,10 @@ background-color:#5596f5 !important;
|
|||||||
@layer components {
|
@layer components {
|
||||||
h1 {
|
h1 {
|
||||||
@apply text-4xl lg:text-6xl font-normal;
|
@apply text-4xl lg:text-6xl font-normal;
|
||||||
color: #ffffff;
|
|
||||||
font-family: "Inter", sans-serif !important;
|
font-family: "Inter", sans-serif !important;
|
||||||
}
|
}
|
||||||
h2 {
|
h2 {
|
||||||
@apply text-3xl lg:text-4xl my-4 font-normal leading-none;
|
@apply text-3xl lg:text-4xl my-4 font-normal leading-none;
|
||||||
color: #ffffff;
|
|
||||||
font-family: "Inter", sans-serif !important;
|
font-family: "Inter", sans-serif !important;
|
||||||
}
|
}
|
||||||
h2 strong {
|
h2 strong {
|
||||||
@ -276,7 +274,6 @@ background-color:#5596f5 !important;
|
|||||||
}
|
}
|
||||||
h3 {
|
h3 {
|
||||||
@apply text-2xl lg:text-3xl my-4 font-extralight;
|
@apply text-2xl lg:text-3xl my-4 font-extralight;
|
||||||
color: #ffffff;
|
|
||||||
font-family: "Inter", sans-serif !important;
|
font-family: "Inter", sans-serif !important;
|
||||||
}
|
}
|
||||||
h3 strong {
|
h3 strong {
|
||||||
|
|||||||
76
static/images/decentralization.svg
Normal file
76
static/images/decentralization.svg
Normal file
@ -0,0 +1,76 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 50 50">
|
||||||
|
<defs>
|
||||||
|
<style>
|
||||||
|
.cls-1 {
|
||||||
|
fill: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-1, .cls-2, .cls-3 {
|
||||||
|
stroke-width: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-4 {
|
||||||
|
clip-path: url(#clippath-2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-2 {
|
||||||
|
fill: #a6a6a6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-3 {
|
||||||
|
fill: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-5 {
|
||||||
|
clip-path: url(#clippath-1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-6 {
|
||||||
|
clip-path: url(#clippath-4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-7 {
|
||||||
|
clip-path: url(#clippath);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-8 {
|
||||||
|
clip-path: url(#clippath-3);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<clipPath id="clippath">
|
||||||
|
<rect class="cls-3" x="9.6" y="9.5" width="31.3" height="31.3"/>
|
||||||
|
</clipPath>
|
||||||
|
<clipPath id="clippath-1">
|
||||||
|
<rect class="cls-3" x="21.1" y="4.7" width="8.3" height="8.6"/>
|
||||||
|
</clipPath>
|
||||||
|
<clipPath id="clippath-2">
|
||||||
|
<rect class="cls-3" x="21.1" y="36.6" width="8.3" height="8.7"/>
|
||||||
|
</clipPath>
|
||||||
|
<clipPath id="clippath-3">
|
||||||
|
<rect class="cls-3" x="37" y="27.4" width="7.7" height="9.2"/>
|
||||||
|
</clipPath>
|
||||||
|
<clipPath id="clippath-4">
|
||||||
|
<rect class="cls-3" x="37" y="12.4" width="7.7" height="10"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
<g class="cls-7">
|
||||||
|
<path class="cls-2" d="M40.5,24.9c0,1-.1,2-.3,3,0,.5-.2,1-.4,1.5-.1.5-.3,1-.5,1.4-.4.9-.9,1.8-1.4,2.7-.6.8-1.2,1.6-1.9,2.3-.4.4-.7.7-1.1,1-.4.3-.8.6-1.2.9-3,2-6.5,2.9-10.1,2.5-.5,0-1-.1-1.5-.2-.5-.1-1-.2-1.5-.4-.5-.1-1-.3-1.4-.5-.9-.4-1.8-.9-2.7-1.4-.4-.3-.8-.6-1.2-.9-.8-.6-1.5-1.4-2.1-2.1-.3-.4-.6-.8-.9-1.2-.6-.8-1-1.7-1.4-2.7-.2-.5-.4-.9-.5-1.4-.1-.5-.3-1-.4-1.5-.1-.5-.2-1-.2-1.5,0-.5,0-1,0-1.5s0-1,0-1.5c0-.5.1-1,.2-1.5,0-.5.2-1,.4-1.5.6-1.9,1.6-3.8,2.8-5.3.3-.4.7-.8,1-1.1.4-.4.7-.7,1.1-1,1.2-1,2.5-1.8,3.9-2.3.5-.2.9-.4,1.4-.5,1.5-.4,3-.7,4.5-.7,1,0,2,.1,3,.3.5.1,1,.2,1.5.4,1,.3,1.9.7,2.8,1.2.4.2.9.5,1.3.8.4.3.8.6,1.2.9.4.3.8.7,1.1,1,.4.4.7.7,1,1.1.3.4.6.8.9,1.2,1.7,2.5,2.6,5.5,2.6,8.6Z"/>
|
||||||
|
</g>
|
||||||
|
<path class="cls-1" d="M28.5,22.5l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.2,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c0,0,.2,0,.3,0,.1,0,.2,0,.3,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5ZM27.6,26.4l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
|
||||||
|
<g class="cls-5">
|
||||||
|
<path class="cls-1" d="M28.5,6.6l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.1,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c0,0,.2,0,.3,0,.1,0,.2,0,.3,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5ZM27.6,10.5l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
|
||||||
|
</g>
|
||||||
|
<g class="cls-4">
|
||||||
|
<path class="cls-1" d="M28.5,38.6l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.2,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c0,0,.2,0,.3,0,.1,0,.2,0,.3,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5ZM27.6,42.4l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
|
||||||
|
</g>
|
||||||
|
<path class="cls-1" d="M12.5,29.9l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.2,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c.2.1.4.1.6,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5ZM11.6,33.7l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
|
||||||
|
<g class="cls-8">
|
||||||
|
<path class="cls-1" d="M44.5,29.9l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.2,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c.2.1.4.1.6,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5ZM43.6,33.7l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
|
||||||
|
</g>
|
||||||
|
<path class="cls-1" d="M12.5,15.1l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.2,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c.2.1.4.1.6,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5h0ZM11.6,19l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
|
||||||
|
<g class="cls-6">
|
||||||
|
<path class="cls-1" d="M44.5,15.1l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.2,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c.2.1.4.1.6,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5h0ZM43.6,19l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
|
||||||
|
</g>
|
||||||
|
<path class="cls-1" d="M9.7,26.5v-3.1c0-.3-.3-.6-.6-.6s-.6.3-.6.6v3.1c0,.3.3.6.6.6s.6-.3.6-.6h0ZM25.7,34.4v-3.1c0-.3-.3-.6-.6-.6-.3,0-.6.3-.6.6h0v3.1c0,.3.3.6.6.6.3,0,.6-.3.6-.6,0,0,0,0,0,0ZM18.9,37.4l-3.7-2.3c-.3-.2-.7,0-.9.2s0,.7.2.9h0l3.7,2.3c.3.2.7,0,.9-.2.2-.3,0-.7-.2-.9ZM34.7,35.1l-3.7,2.3c-.3.2-.4.6-.2.9.1.2.3.3.5.3.1,0,.2,0,.3,0l3.7-2.3c.3-.2.4-.6.2-.9-.2-.3-.6-.4-.8-.2ZM31,12.5l3.7,2.3c0,0,.2,0,.3,0,.2,0,.4-.1.5-.3.2-.3,0-.7-.2-.9l-3.7-2.3c-.3-.2-.7,0-.9.2,0,0,0,0,0,0-.2.3,0,.7.2.9ZM15.1,14.8c.1,0,.2,0,.3,0l3.7-2.3c.3-.2.4-.6.2-.9-.2-.3-.6-.4-.9-.2l-3.7,2.3c-.3.2-.4.6-.2.9.1.2.3.3.5.3ZM25.7,18.5v-3.1c0-.3-.3-.6-.6-.6s-.6.3-.6.6v3.1c0,.3.3.6.6.6.3,0,.6-.3.6-.6,0,0,0,0,0,0ZM41.7,26.5v-3.1c0-.3-.3-.6-.6-.6s-.6.3-.6.6v3.1c0,.3.3.6.6.6s.6-.3.6-.6h0ZM19.2,21.6l-3.7-1.8c-.3-.1-.7,0-.8.3,0,0,0,0,0,0-.1.3,0,.7.3.8l3.7,1.8c0,0,.2,0,.3,0,.2,0,.5-.1.6-.4.1-.3,0-.7-.3-.8ZM31.3,22.8c0,0,.2,0,.3,0l3.7-1.8c.3-.1.5-.5.3-.8-.1-.3-.5-.5-.8-.3,0,0,0,0,0,0l-3.7,1.8c-.3.1-.4.5-.3.8.1.2.3.4.6.4ZM35.3,29.2l-3.7-1.8c-.3-.1-.7,0-.8.3,0,0,0,0,0,0-.1.3,0,.7.3.8h0s3.7,1.8,3.7,1.8c0,0,.2,0,.3,0,.3,0,.6-.3.6-.6,0-.2-.1-.5-.4-.6ZM18.6,27.4l-3.7,1.8c-.3.1-.4.5-.3.8.1.2.3.4.6.4,0,0,.2,0,.3,0l3.7-1.8c.3-.1.4-.5.3-.8-.1-.3-.5-.4-.8-.3,0,0,0,0,0,0Z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 5.0 KiB |
36
static/images/efficiency.svg
Normal file
36
static/images/efficiency.svg
Normal file
@ -0,0 +1,36 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 50 50">
|
||||||
|
<defs>
|
||||||
|
<style>
|
||||||
|
.cls-1 {
|
||||||
|
fill: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-1, .cls-2, .cls-3 {
|
||||||
|
stroke-width: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-2 {
|
||||||
|
fill: #a6a6a6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-3 {
|
||||||
|
fill: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-4 {
|
||||||
|
clip-path: url(#clippath);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<clipPath id="clippath">
|
||||||
|
<rect class="cls-3" x="9.6" y="9.5" width="31.2" height="31.2"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
<g class="cls-4">
|
||||||
|
<path class="cls-2" d="M40.5,25c0,1-.1,2-.3,3-.1.5-.2,1-.4,1.5-.1.5-.3,1-.5,1.4-.4.9-.9,1.8-1.4,2.7-.6.8-1.2,1.6-1.9,2.3-1.1,1.1-2.3,2-3.6,2.7-.4.2-.9.5-1.4.6-.5.2-.9.4-1.4.5-.5.1-1,.3-1.5.4-2,.4-4,.4-6,0-1-.2-2-.5-2.9-.9-1.4-.6-2.7-1.4-3.9-2.3-.4-.3-.8-.7-1.1-1-1.1-1.1-2-2.3-2.7-3.6-.2-.4-.5-.9-.6-1.4-.2-.5-.4-.9-.5-1.4-.4-1.5-.7-3-.7-4.5,0-1,.1-2,.3-3,.1-.5.2-1,.4-1.5.6-1.9,1.6-3.8,2.8-5.3.3-.4.7-.8,1-1.1.4-.4.7-.7,1.1-1,.4-.3.8-.6,1.2-.9,2.5-1.7,5.5-2.6,8.6-2.6,1,0,2,.1,3,.3.5.1,1,.2,1.5.4.5.1,1,.3,1.4.5.9.4,1.8.9,2.7,1.4.8.6,1.6,1.2,2.3,1.9.4.4.7.7,1,1.1.3.4.6.8.9,1.2,1.7,2.5,2.6,5.5,2.6,8.6Z"/>
|
||||||
|
</g>
|
||||||
|
<path class="cls-1" d="M24.4,22.7c.2-.5,0-1.1-.5-1.3,0,0,0,0,0,0-1.3-.6-2.8-1-4.3-1-1.3,0-2.6.3-3.9.8-1.2.5-2.3,1.2-3.2,2.1-.9.9-1.6,2-2.1,3.2-.5,1.2-.8,2.5-.8,3.9,0,1.3.3,2.6.8,3.9,1,2.4,2.9,4.3,5.3,5.3,1.2.5,2.5.8,3.9.8s2.6-.3,3.9-.8c2.4-1,4.3-2.9,5.3-5.3.5-1.2.8-2.5.8-3.9s-.3-2.9-.9-4.2c-.2-.5-.8-.7-1.3-.5-.5.2-.7.8-.5,1.3.5,1.1.8,2.2.8,3.4,0,2.1-.8,4.1-2.3,5.6-1.5,1.5-3.5,2.3-5.6,2.3-2.1,0-4.1-.8-5.6-2.3-1.5-1.5-2.3-3.5-2.3-5.6,0-2.1.8-4.1,2.3-5.6,1.5-1.5,3.5-2.3,5.6-2.3,1.2,0,2.4.3,3.4.8.5.2,1.1,0,1.3-.5h0Z"/>
|
||||||
|
<path class="cls-1" d="M30.7,22.2c-.5.3-.6.9-.3,1.4,1.3,2,1.9,4.3,1.9,6.7,0,1.7-.3,3.4-1,4.9-.6,1.5-1.6,2.9-2.7,4-1.2,1.2-2.5,2.1-4,2.7-1.6.7-3.2,1-4.9,1-1.7,0-3.4-.3-4.9-1-1.5-.6-2.9-1.6-4-2.7-1.2-1.2-2.1-2.5-2.7-4-.7-1.6-1-3.2-1-4.9,0-5.3,3.2-10,8.2-11.8,1.4-.5,3-.8,4.5-.8,2.4,0,4.7.7,6.7,1.9.5.3,1.1.1,1.4-.4.3-.5.1-1-.3-1.3-2.3-1.4-5-2.2-7.7-2.2-1.8,0-3.5.3-5.2.9-5.7,2.2-9.5,7.6-9.5,13.7,0,3.9,1.5,7.6,4.3,10.4,1.3,1.3,2.9,2.4,4.7,3.1,1.8.8,3.7,1.2,5.7,1.2,3.9,0,7.6-1.5,10.4-4.3,2.8-2.7,4.3-6.5,4.3-10.4,0-2.8-.8-5.5-2.2-7.8-.3-.5-.9-.6-1.4-.3Z"/>
|
||||||
|
<path class="cls-1" d="M44.9,12.9c-.1-.4-.4-.6-.8-.7l-5-.8c-.1-.2-.3-.4-.5-.5l-.8-5c0-.4-.3-.7-.7-.8-.4-.1-.8,0-1,.2l-6.4,6.4c-.2.2-.3.5-.3.9l.9,5.7-11,11c-.4.4-.4,1,0,1.4.2.2.4.3.7.3.3,0,.5,0,.7-.3l11-11,5.7.9c.3,0,.6,0,.9-.3l6.4-6.4c.3-.3.4-.7.2-1h0ZM36.1,8.1l.6,3.8-4.6,4.6-.6-3.8,4.6-4.6ZM37.2,18.5l-3.8-.6,4.6-4.6,3.8.6-4.6,4.6Z"/>
|
||||||
|
<path class="cls-1" d="M19.7,27.7c.1,0,.2,0,.4,0,.5,0,1.1-.3,1.1-.9,0-.5-.3-1.1-.9-1.1h0c-.2,0-.4,0-.6,0-2.6,0-4.7,2.1-4.7,4.7,0,2.6,2.1,4.7,4.7,4.7,2.6,0,4.7-2.1,4.7-4.7,0-.2,0-.4,0-.6,0-.5-.6-.9-1.2-.8-.5,0-.9.6-.8,1.1,0,.1,0,.2,0,.4,0,1.5-1.2,2.7-2.7,2.7-1.5,0-2.7-1.2-2.7-2.7,0-1.5,1.2-2.7,2.7-2.7Z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.9 KiB |
42
static/images/resilience.svg
Normal file
42
static/images/resilience.svg
Normal file
@ -0,0 +1,42 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 50 50">
|
||||||
|
<defs>
|
||||||
|
<style>
|
||||||
|
.cls-1 {
|
||||||
|
fill: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-1, .cls-2, .cls-3 {
|
||||||
|
stroke-width: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-2 {
|
||||||
|
fill: #a6a6a6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-3 {
|
||||||
|
fill: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-4 {
|
||||||
|
clip-path: url(#clippath-1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-5 {
|
||||||
|
clip-path: url(#clippath);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<clipPath id="clippath">
|
||||||
|
<rect class="cls-3" x="9.4" y="9.5" width="31.2" height="31.3"/>
|
||||||
|
</clipPath>
|
||||||
|
<clipPath id="clippath-1">
|
||||||
|
<rect class="cls-3" x="8.4" y="5" width="33.1" height="40"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
<g class="cls-5">
|
||||||
|
<path class="cls-2" d="M40.3,25c0,.5,0,1,0,1.5-.2,2-.8,4-1.8,5.8-.2.4-.5.9-.8,1.3-.3.4-.6.8-.9,1.2-.6.8-1.4,1.5-2.1,2.1-.4.3-.8.6-1.2.9-.4.3-.9.5-1.3.8-.9.5-1.8.9-2.8,1.2-.5.1-1,.3-1.5.4-1.5.3-3,.4-4.5.2-.5,0-1-.1-1.5-.2-.5-.1-1-.2-1.5-.4-.5-.1-1-.3-1.4-.5-.5-.2-.9-.4-1.4-.6-.4-.2-.9-.5-1.3-.8-.4-.3-.8-.6-1.2-.9-.8-.6-1.5-1.4-2.1-2.1-.3-.4-.6-.8-.9-1.2-.3-.4-.5-.9-.8-1.3-.5-.9-.9-1.8-1.2-2.8-.7-2.4-.9-5-.4-7.5,0-.5.2-1,.4-1.5.2-.5.3-1,.5-1.4.2-.5.4-.9.6-1.4.5-.9,1-1.7,1.7-2.5.6-.8,1.4-1.5,2.1-2.1.4-.3.8-.6,1.2-.9.4-.3.9-.5,1.3-.8.4-.2.9-.5,1.4-.6.5-.2.9-.4,1.4-.5,1.5-.4,3-.7,4.5-.7,1,0,2,0,3,.3.5,0,1,.2,1.5.4,1,.3,1.9.7,2.8,1.2.4.2.9.5,1.3.8.4.3.8.6,1.2.9.4.3.8.7,1.1,1s.7.7,1,1.1c.6.8,1.2,1.6,1.7,2.5.2.4.5.9.6,1.4.2.5.4.9.5,1.4.3,1,.5,2,.6,3,0,.5,0,1,0,1.5Z"/>
|
||||||
|
</g>
|
||||||
|
<g class="cls-4">
|
||||||
|
<path class="cls-1" d="M40.8,10.4c-.3-.3-.7-.4-1-.3-.8,0-1.6.1-2.4.1-5.8,0-9.9-2.2-10.9-4.4-.2-.5-.7-.8-1.2-.8h-.8c-.5,0-1,.3-1.2.8-1,2.2-5.1,4.4-10.9,4.4s-1.6,0-2.4-.1c-.4,0-.8,0-1,.3-.3.3-.4.6-.4,1v8c0,10.9,6.1,20.6,15.8,25.4.4.2.8.2,1.2,0,9.8-4.8,15.8-14.6,15.8-25.4v-8c0-.4-.2-.7-.4-1h0ZM38.6,19.4c0,9.6-5.3,18.3-13.8,22.7-8.5-4.5-13.8-13.1-13.8-22.7v-6.6c.4,0,.8,0,1.2,0,5.5,0,10.3-1.8,12.5-4.7,2.2,2.8,7,4.7,12.5,4.7s.8,0,1.2,0v6.6ZM35.1,17.5c.5.5.5,1.4,0,1.9,0,0,0,0,0,0l-11.6,11.2c-.2.2-.6.4-.9.4h0c-.4,0-.7-.2-.9-.4l-4.2-4.7c-.5-.6-.4-1.4.1-1.9.5-.5,1.3-.4,1.8,0l3.3,3.7,10.6-10.2c.5-.5,1.4-.5,1.9,0,0,0,0,0,0,0h0Z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.2 KiB |
@ -1,12 +1,10 @@
|
|||||||
{% extends "_default/base.html" %}
|
{% extends "_default/base.html" %}
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
|
||||||
{% include "partials/hero/myhero.html" %}
|
<!-- home page template, has a banner and rows of page summaries -->
|
||||||
{% include "partials/hero/myhero1.html" %}
|
<div>
|
||||||
{% include "partials/hero/myhero3.html" %}
|
{% set page = get_page(path="home/index.md") %}
|
||||||
{% include "partials/hero/myhero8.html" %}
|
{{page.content | safe}}
|
||||||
{% include "partials/hero/myhero5.html" %}
|
</div>
|
||||||
{% include "partials/hero/myhero2.html" %}
|
|
||||||
{% include "partials/hero/myhero6.html" %}
|
|
||||||
{% include "partials/hero/myhero7.html" %}
|
|
||||||
{% endblock content %}
|
{% endblock content %}
|
||||||
|
|
||||||
|
|||||||
@ -1,12 +1,6 @@
|
|||||||
{% extends "_default/base.html" %}
|
{% extends "_default/base.html" %}
|
||||||
{% block content %}
|
{% block content %}
|
||||||
{% include "partials/about/about1.html" %}
|
|
||||||
{% include "partials/about/about2.html" %}
|
|
||||||
{% include "partials/about/about3.html" %}
|
|
||||||
{% include "partials/about/about4.html" %}
|
|
||||||
{% include "partials/about/about5.html" %}
|
|
||||||
{% include "partials/about/about6.html" %}
|
|
||||||
{% include "partials/hero/myhero7.html" %}
|
|
||||||
|
|
||||||
|
|
||||||
{% endblock content %}
|
{% endblock content %}
|
||||||
65
templates/shortcodes/accordion.html
Normal file
65
templates/shortcodes/accordion.html
Normal file
@ -0,0 +1,65 @@
|
|||||||
|
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
|
||||||
|
<script>
|
||||||
|
tailwind.config = {
|
||||||
|
theme: {
|
||||||
|
extend: {
|
||||||
|
fontFamily: {
|
||||||
|
inter: ['Inter', 'sans-serif'],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<!-- <main class="fade-in relative flex flex-col justify-center overflow-hidden bg-white"> -->
|
||||||
|
<!-- <div class="w-full mx-auto px-4 md:px-6 py-12 border-t-2"> -->
|
||||||
|
|
||||||
|
<!-- <h1 class="text-3xl lg:text-4xl font-normal tracking-tight text-black pt-12">Frequently Asked Questions</h1> -->
|
||||||
|
|
||||||
|
<!-- Accordion component -->
|
||||||
|
<!-- <div class="divide-y divide-white/50 my-10"> -->
|
||||||
|
<!-- Accordion item -->
|
||||||
|
<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 px-4 border rounded-lg"
|
||||||
|
@click="expanded = !expanded"
|
||||||
|
:aria-expanded="expanded"
|
||||||
|
aria-controls="faqs-text-01"
|
||||||
|
>
|
||||||
|
<span class="">{{ question }}</span>
|
||||||
|
<svg class="shrink-0 ml-8" fill="gray" 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 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">
|
||||||
|
{% if description %}
|
||||||
|
<p class="py-3 px-4 text-base font-light">
|
||||||
|
{{ description }}
|
||||||
|
</p>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- </div>
|
||||||
|
</div> -->
|
||||||
|
<!-- End: Accordion component -->
|
||||||
|
|
||||||
|
<!-- </div>
|
||||||
|
</main> -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
28
templates/shortcodes/cta.html
Normal file
28
templates/shortcodes/cta.html
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
{% set title = title | default(value="") %}
|
||||||
|
{% set description = description | default(value="") %}
|
||||||
|
{% set button_text = button_text | default(value="") %}
|
||||||
|
{% set button_link = button_link | default(value="") %}
|
||||||
|
{% set button_text2 = button_text2 | default(value="") %}
|
||||||
|
{% set button_link2 = button_link2 | default(value="") %}
|
||||||
|
{% set image_src = image_src | default(value="") %}
|
||||||
|
{% set image_alt = image_alt | default(value="") %}
|
||||||
|
|
||||||
|
|
||||||
|
<div class="fade-in lg:pt-12">
|
||||||
|
<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="mx-auto max-w-md text-center lg:mx-0 lg:flex-auto lg:py-32 lg:text-left">
|
||||||
|
<h2 class="text-4xl font-normal tracking-tight text-balance text-white lg:text-5xl">{{ title }}</h2>
|
||||||
|
<p class="mt-6 text-lg lg:text-xl text-pretty font-light text-gray-300">{{ description }}</p>
|
||||||
|
<div class="mt-10 flex items-center justify-center gap-x-6 lg:justify-start">
|
||||||
|
<a href="{{ button_link }}" class="rounded-2xl bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-xs hover:bg-gray-100 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white">{{ button_text }}</a>
|
||||||
|
<a href="{{ button_link2 }}" class="text-sm/6 font-semibold text-white hover:text-gray-100">{{ button_text2 }}<span aria-hidden="true">→</span></a>
|
||||||
|
</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">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
59
templates/shortcodes/desciption_blockquote.html
Normal file
59
templates/shortcodes/desciption_blockquote.html
Normal file
@ -0,0 +1,59 @@
|
|||||||
|
{% set title = title | default(value="") %}
|
||||||
|
{% set description_1 = description_1 | default(value="") %}
|
||||||
|
{% set description_2 = description_2 | default(value="") %}
|
||||||
|
{% set description_3 = description_3 | default(value="") %}
|
||||||
|
{% set description_4 = description_4 | default(value="") %}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="lg:py-24 py-12 relative bg-white isolate overflow-hidden">
|
||||||
|
<div class="mx-auto container lg:max-w-7xl px-4">
|
||||||
|
<div>
|
||||||
|
<h2 class="fade-in lg:text-5xl text-4xl font-medium tracking-tight l">{{ title }}
|
||||||
|
</h2>
|
||||||
|
</div>
|
||||||
|
<div class="relative grid lg:grid-cols-12 lg:gap-8">
|
||||||
|
<!-- Left Content -->
|
||||||
|
<div class="lg:col-span-6">
|
||||||
|
<div class="mx-auto max-w-2xl lg:mx-0">
|
||||||
|
<p class="fade-in mt-2 text-lg lg:text-xl font-light">
|
||||||
|
{{ description_1 }}
|
||||||
|
<br><br>
|
||||||
|
{{ description_2 }}
|
||||||
|
<br><br>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Right Blockquote -->
|
||||||
|
<div class="lg:col-span-6">
|
||||||
|
<figure class=" mt-2 pl-8">
|
||||||
|
<blockquote class=" fade-in px-6">
|
||||||
|
<p class="text-md leading-normal font-normal">{{ description_3 }}
|
||||||
|
<br><br>
|
||||||
|
{{ description_4 }}</p>
|
||||||
|
</blockquote>
|
||||||
|
<br>
|
||||||
|
<div class="mx-4">
|
||||||
|
<p class="fade-in mx-auto text-xl font-semibold tracking-tight lg:text-2xl opacity-0 transition-opacity duration-1000" data-observer>
|
||||||
|
Decentralized. Scalable. Intelligent.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</figure>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.blockquote::before {
|
||||||
|
content: open-quote;
|
||||||
|
font-size: 4rem;
|
||||||
|
position: absolute;
|
||||||
|
top: -1rem;
|
||||||
|
left: -1rem;
|
||||||
|
color: #8d1212;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
34
templates/shortcodes/feature_card.html
Normal file
34
templates/shortcodes/feature_card.html
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
{% set title = title | default(value="Feature") %}
|
||||||
|
{% set description = description | default(value="") %}
|
||||||
|
{% set link = link | default(value="") %}
|
||||||
|
{% set icon = icon | default(value="") %}
|
||||||
|
{% set bg_color = bg_color | default(value="bg-white") %}
|
||||||
|
{% set hover_color = hover_color | default(value="hover:bg-gray-50") %}
|
||||||
|
|
||||||
|
|
||||||
|
<div class="relative {{ bg_color }} {{ hover_color }} shadow rounded-lg p-4 transition-all duration-300">
|
||||||
|
{% if icon %}
|
||||||
|
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-gray-200 text-white mb-4">
|
||||||
|
<img src="{{ icon | safe }}" class="">
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
<h3 class="text-md font-medium">{{ title }}</h3>
|
||||||
|
{% if description %}
|
||||||
|
<p class="my-2 font-extralight">{{ description }}</p>
|
||||||
|
{% endif %}
|
||||||
|
{% if link %}
|
||||||
|
<a href="{{ link }}" class="text-sm font-semibold text-black hover:text-gray-700">{{ link_name }} <span aria-hidden="true">→</span></a>
|
||||||
|
{% endif %}
|
||||||
|
{% if caller %}
|
||||||
|
<div class="mt-4">
|
||||||
|
{{ caller() }}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style scop>
|
||||||
|
|
||||||
|
p{
|
||||||
|
font-weight: 200;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
17
templates/shortcodes/header_center.html
Normal file
17
templates/shortcodes/header_center.html
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
{% set title = title | default(value="Feature") %}
|
||||||
|
{% set subtitle = subtitle | default(value="") %}
|
||||||
|
{% set description = description | default(value="") %}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="fade-in py-12">
|
||||||
|
<div class="relative isolate px-4 lg:px-8">
|
||||||
|
<div class="mx-auto max-w-4xl">
|
||||||
|
<div class="text-left lg:text-center">
|
||||||
|
<h2 class="fade-in text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">{{ title }}</h2>
|
||||||
|
<h3 class="fade-in text-balance lg:text-3xl text-2xl font-normal tracking-tight text-black">{{ subtitle }}</h3>
|
||||||
|
<p class="mt-8 lg:text-lg font-light text-black sm:text-xl/8">{{ description }}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
61
templates/shortcodes/hero_bottom_img.html
Normal file
61
templates/shortcodes/hero_bottom_img.html
Normal file
@ -0,0 +1,61 @@
|
|||||||
|
<div class="lg:pt-24 pt-12 px-4">
|
||||||
|
<div class="mx-auto max-w-7xl">
|
||||||
|
<div class="mx-auto max-w-4xl text-left lg:text-center">
|
||||||
|
<p class="text-base/7 font-light tracking-wide">{{ subtitle }}</p>
|
||||||
|
<h2 class="fade-in text-balance lg:text-5xl text-4xl font-normal tracking-tight "> {{ title }}</h2>
|
||||||
|
<p class="mt-6 text-lg font-light lg:text-xl">{{ description }}</p>
|
||||||
|
</div>
|
||||||
|
</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">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- <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-4 text-base/7 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 lg:pl-9">
|
||||||
|
<dt class="inline font-semibold ">
|
||||||
|
|
||||||
|
✓ Quantum Safe Storage Functionality
|
||||||
|
</dt>
|
||||||
|
<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 class="relative lg:pl-9">
|
||||||
|
<dt class="inline font-semibold ">
|
||||||
|
|
||||||
|
✓ Entry and Exit Points for AI Workloads
|
||||||
|
</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>
|
||||||
|
</div>
|
||||||
|
<div class="relative lg:pl-9">
|
||||||
|
<dt class="inline font-semibold ">
|
||||||
|
|
||||||
|
✓ Data Storage and Retrieval Mechanisms
|
||||||
|
</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>
|
||||||
|
</div>
|
||||||
|
<div class="relative lg:pl-9">
|
||||||
|
<dt class="inline font-semibold ">
|
||||||
|
|
||||||
|
✓ Integrated Name Services (DNS)
|
||||||
|
</dt>
|
||||||
|
<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 class="relative lg:pl-9">
|
||||||
|
<dt class="inline font-semibold ">
|
||||||
|
|
||||||
|
✓ Frontend/Backend Integration
|
||||||
|
</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>
|
||||||
|
</div>
|
||||||
|
<div class="relative lg:pl-9">
|
||||||
|
<dt class="inline font-semibold ">
|
||||||
|
|
||||||
|
✓ CDN (Content Delivery Network)
|
||||||
|
</dt>
|
||||||
|
<dd class="font-light">Mycelium accelerates data distribution by acting as a decentralized CDN, ensuring fast, secure, and efficient content delivery across global nodes with minimal latency.</dd>
|
||||||
|
</div>
|
||||||
|
</dl>
|
||||||
|
</div> -->
|
||||||
|
</div>
|
||||||
|
|
||||||
46
templates/shortcodes/hero_features.html
Normal file
46
templates/shortcodes/hero_features.html
Normal file
@ -0,0 +1,46 @@
|
|||||||
|
<div class="fade-in bg-white lg:max-w-7xl container mx-auto">
|
||||||
|
<div class="lg:py-24 py-12 relative isolate">
|
||||||
|
<div class="px-4 lg:px-8 lg:pb-24">
|
||||||
|
<p class="text-base font-light tracking-wide">{{ subtitle_1 }}</p>
|
||||||
|
<h2 class="fade-in lg:text-5xl text-4xl font-normal tracking-tight">{{ title }}</h2>
|
||||||
|
<p class="text-left mt-4 text-pretty lg:text-lg text-md font-light fade-in max-w-3xl">
|
||||||
|
{{ description }}
|
||||||
|
</p>
|
||||||
|
</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 }}"
|
||||||
|
alt="{{ image_alt }}">
|
||||||
|
</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">
|
||||||
|
{% if feature_1_title %}
|
||||||
|
<div class="relative pl-9">
|
||||||
|
<dt class="font-semibold lg:text-lg text-base ">
|
||||||
|
{{ feature_1_title }}
|
||||||
|
</dt>
|
||||||
|
<dd class="mt-2 font-light">{{ feature_1_description }}</dd>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
{% if feature_2_title %}
|
||||||
|
<div class="relative pl-9">
|
||||||
|
<dt class="font-semibold lg:text-lg text-base ">
|
||||||
|
{{ feature_2_title }}
|
||||||
|
</dt>
|
||||||
|
<dd class="mt-2 font-light">{{ feature_2_description }}</dd>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
{% if feature_3_title %}
|
||||||
|
<div class="relative pl-9">
|
||||||
|
<dt class="font-semibold lg:text-lg text-base ">
|
||||||
|
{{ feature_3_title }}
|
||||||
|
</dt>
|
||||||
|
<dd class="mt-2 font-light">{{ feature_3_description }}</dd>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
</dl>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
38
templates/shortcodes/hero_right_img.html
Normal file
38
templates/shortcodes/hero_right_img.html
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
{% set image_src = image_src | default(value="") %}
|
||||||
|
{% set image_alt = image_alt | default(value="") %}
|
||||||
|
{% set title = title | default(value="MYCELIUM") %}
|
||||||
|
{% set subtitle = subtitle | default(value="") %}
|
||||||
|
{% set description_1 = description_1 | default(value="") %}
|
||||||
|
{% set description_2 = description_2 | default(value="") %}
|
||||||
|
{% set button_text = button_text | default(value="") %}
|
||||||
|
{% set button_link = button_link | default(value="") %}
|
||||||
|
|
||||||
|
<div class=" fade-in">
|
||||||
|
<div class="relative isolate">
|
||||||
|
<div class="mx-auto lg:max-w-7xl px-6 lg:py-24 py-12 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
|
||||||
|
<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="{{ image_src }}"
|
||||||
|
alt="{{ image_alt }}">
|
||||||
|
</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 lg:text-6xl">
|
||||||
|
{{ title }}
|
||||||
|
</h1>
|
||||||
|
<h2 class="text-balance lg:text-4xl text-3xl font-normal tracking-tight">{{ subtitle }}</h2>
|
||||||
|
<p class="mt-6 text-md font-light text-stone-800 lg:text-lg">
|
||||||
|
{{ description_1 }}
|
||||||
|
<p class="mt-2 text-md font-light text-stone-800 lg:text-lg">
|
||||||
|
{{ description_2 }}
|
||||||
|
</p>
|
||||||
|
{% if button %}
|
||||||
|
<div class="mt-10 flex items-center gap-x-6">
|
||||||
|
<a href="{{ button_link }}" class="rounded-2xl bg-black px-3.5 py-2.5 text-sm font-semibold text-white shadow-xs hover:bg-gray-600 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-200">
|
||||||
|
{{ button_text }}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
72
templates/shortcodes/left_header.html
Normal file
72
templates/shortcodes/left_header.html
Normal file
@ -0,0 +1,72 @@
|
|||||||
|
<div class="lg:pt-24 pt-12 lg:max-w-7xl container mx-auto px-4 lg:px-0">
|
||||||
|
<div class="mx-auto">
|
||||||
|
<div class="mx-auto">
|
||||||
|
<p class="text-base font-light tracking-wide">{{ subtitle }}</p>
|
||||||
|
<h2 class="fade-in lg:text-5xl text-4xl font-normal tracking-tight">{{ title }}</h2>
|
||||||
|
|
||||||
|
<p class="mt-6 text-lg font-light">{{ description }}</p>
|
||||||
|
<p class="mt-6 text-lg font-light">{{ description2 }}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- <div class="mx-auto mt-10">
|
||||||
|
<dl class="mx-auto grid grid-cols-1 gap-x-6 gap-y-10 text-base 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">
|
||||||
|
<dt class="inline font-semibold ">
|
||||||
|
|
||||||
|
PRODUCTIVITY & COMMUNICATION
|
||||||
|
</dt>
|
||||||
|
<ul class="mx-4" style="list-style: circle;">
|
||||||
|
<li>Secure remote work collaboration.</li>
|
||||||
|
<li>Private file sharing between trusted nodes.</li>
|
||||||
|
<li>Encrypted voice/video calls.</li>
|
||||||
|
<li>Self-hosted messaging systems.</li>
|
||||||
|
<li>Secure document collaboration.</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="relative pl-9">
|
||||||
|
<dt class="inline font-semibold ">
|
||||||
|
|
||||||
|
INFRASTRUCTURE
|
||||||
|
</dt>
|
||||||
|
<ul class="mx-4" style="list-style: circle;">
|
||||||
|
<li>Private cloud computing resources.</li>
|
||||||
|
<li>Secure IoT device networks.</li>
|
||||||
|
<li>Remote system administration.</li>
|
||||||
|
<li>Virtual private networks (VPNs).</li>
|
||||||
|
<li>Secure backup systems.</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="relative pl-9">
|
||||||
|
<dt class="inline font-semibold ">
|
||||||
|
|
||||||
|
SERVICES
|
||||||
|
</dt>
|
||||||
|
<ul class="mx-4" style="list-style: circle;">
|
||||||
|
<li>Self-hosted web services.</li>
|
||||||
|
<li>Private file sharing between trusted nodes.</li>
|
||||||
|
<li>Private DNS systems.</li>
|
||||||
|
<li>Personal email servers.</li>
|
||||||
|
<li>Secure document collaboration.</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="relative pl-9">
|
||||||
|
<dt class="inline font-semibold ">
|
||||||
|
|
||||||
|
MEDIA & CONTENT
|
||||||
|
</dt>
|
||||||
|
<ul class="mx-4" style="list-style: circle;">
|
||||||
|
<li>Private media streaming.</li>
|
||||||
|
<li>Personal cloud storage.</li>
|
||||||
|
<li>Protected content distribution.</li>
|
||||||
|
<li>Secure game servers.</li>
|
||||||
|
<li>Private git repositories.</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</dl>
|
||||||
|
<hr class="my-6">
|
||||||
|
|
||||||
|
<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 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>
|
||||||
42
templates/shortcodes/text_left_img.html
Normal file
42
templates/shortcodes/text_left_img.html
Normal file
@ -0,0 +1,42 @@
|
|||||||
|
{% set title = title | default(value="") %}
|
||||||
|
{% set subheader = subheader | default(value="") %}
|
||||||
|
{% set subtitle = subtitle | default(value="") %}
|
||||||
|
{% set description = description | default(value="") %}
|
||||||
|
{% set description_2 = description_2 | default(value="") %}
|
||||||
|
{% set button_text = button_text | default(value="") %}
|
||||||
|
{% set button_link = button_link | default(value="") %}
|
||||||
|
{% set image_src = image_src | default(value="") %}
|
||||||
|
{% set image_alt = image_alt | default(value="") %}
|
||||||
|
|
||||||
|
<div class="lg:py-24 py-12 fade-in bg-semi-white lg:max-w-7xl container mx-auto px-4">
|
||||||
|
<div class="relative isolate">
|
||||||
|
<div class="mx-auto mt-10 lg:mt-0 lg:flex lg:items-center lg:gap-x-15 ">
|
||||||
|
<div class="lg:order-2 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 }}"
|
||||||
|
alt="{{ image_alt }}">
|
||||||
|
</div>
|
||||||
|
<div class="mx-auto max-w-xl lg:mx-6 lg:flex-auto">
|
||||||
|
<p class="text-base mt-4 font-light tracking-wide">{{ subheader }}</p>
|
||||||
|
<h2 class="fade-in lg:text-5xl text-4xl font-medium tracking-tight ">{{ title }}</h2>
|
||||||
|
<h3 class="font-light lg:text-3xl text-xl">
|
||||||
|
{{ subtitle }}
|
||||||
|
</h3>
|
||||||
|
<p class="text-left mt-4 text-pretty lg:text-lg text-md font-light fade-in">
|
||||||
|
{{ description }}
|
||||||
|
</p>
|
||||||
|
<p class="text-left mt-4 text-pretty lg:text-lg text-md font-light fade-in">
|
||||||
|
{{ description_2 }}
|
||||||
|
</p>
|
||||||
|
{% if button_link %}
|
||||||
|
<div class="mt-6 flex">
|
||||||
|
<a href="{{ button_link }}" class="rounded-2xl bg-black border border-white px-4 py-2 text-sm font-semibold text-white shadow hover:bg-gray-700 focus:outline focus:outline-2 focus:outline-offset-2 focus:outline-gray-300">{{ button_text }}</a>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
43
templates/shortcodes/text_right_img.html
Normal file
43
templates/shortcodes/text_right_img.html
Normal file
@ -0,0 +1,43 @@
|
|||||||
|
{% set title = title | default(value="") %}
|
||||||
|
{% set subheader = subheader | default(value="") %}
|
||||||
|
{% set subtitle = subtitle | default(value="") %}
|
||||||
|
{% set description = description | default(value="") %}
|
||||||
|
{% set description_2 = description_2 | default(value="") %}
|
||||||
|
{% set button_text = button_text | default(value="") %}
|
||||||
|
{% set button_link = button_link | default(value="") %}
|
||||||
|
{% set image_src = image_src | default(value="") %}
|
||||||
|
{% set image_alt = image_alt | default(value="") %}
|
||||||
|
|
||||||
|
<div class="lg:py-24 py-12 fade-in bg-semi-white lg:max-w-7xl container mx-auto px-4">
|
||||||
|
<div class="relative isolate">
|
||||||
|
|
||||||
|
<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 }}"
|
||||||
|
alt="{{ image_alt }}">
|
||||||
|
</div>
|
||||||
|
<div class="mx-auto max-w-xl lg:mx-6 lg:flex-auto">
|
||||||
|
<p class="text-base font-light tracking-wide mt-4">{{ subheader }}</p>
|
||||||
|
<h2 class="fade-in lg:text-5xl text-4xl font-medium tracking-tight ">{{ title }}</h2>
|
||||||
|
<h3 class="font-light lg:text-3xl text-xl">
|
||||||
|
{{ subtitle }}
|
||||||
|
</h3>
|
||||||
|
<p class="text-left mt-4 text-pretty lg:text-lg text-md font-light fade-in">
|
||||||
|
{{ description }}
|
||||||
|
</p>
|
||||||
|
<p class="text-left mt-4 text-pretty lg:text-lg text-md font-light fade-in">
|
||||||
|
{{ description_2 }}
|
||||||
|
</p>
|
||||||
|
{% if button_link %}
|
||||||
|
<div class="mt-6 flex">
|
||||||
|
<a href="{{ button_link }}" class="rounded-2xl bg-black border border-white px-4 py-2 text-sm font-semibold text-white shadow hover:bg-gray-700 focus:outline focus:outline-2 focus:outline-offset-2 focus:outline-gray-300">{{ button_text }}</a>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
Loading…
Reference in New Issue
Block a user