From c2c021531c9bbe7c698f2236bb068e896c9f1cf4 Mon Sep 17 00:00:00 2001 From: ehab-hassan Date: Wed, 21 May 2025 15:37:35 +0300 Subject: [PATCH] update home and about --- content/about/index.md | 114 ++++++- content/home/index.md | 315 +++++++++++++++++- css/index.css | 3 - static/images/decentralization.svg | 76 +++++ static/images/efficiency.svg | 36 ++ static/images/resilience.svg | 42 +++ templates/index.html | 16 +- templates/layouts/about.html | 8 +- templates/shortcodes/accordion.html | 65 ++++ templates/shortcodes/cta.html | 28 ++ .../shortcodes/desciption_blockquote.html | 59 ++++ templates/shortcodes/feature_card.html | 34 ++ templates/shortcodes/header_center.html | 17 + templates/shortcodes/hero_bottom_img.html | 61 ++++ templates/shortcodes/hero_features.html | 46 +++ templates/shortcodes/hero_right_img.html | 38 +++ templates/shortcodes/left_header.html | 72 ++++ templates/shortcodes/text_left_img.html | 42 +++ templates/shortcodes/text_right_img.html | 43 +++ 19 files changed, 1065 insertions(+), 50 deletions(-) create mode 100644 static/images/decentralization.svg create mode 100644 static/images/efficiency.svg create mode 100644 static/images/resilience.svg create mode 100644 templates/shortcodes/accordion.html create mode 100644 templates/shortcodes/cta.html create mode 100644 templates/shortcodes/desciption_blockquote.html create mode 100644 templates/shortcodes/feature_card.html create mode 100644 templates/shortcodes/header_center.html create mode 100644 templates/shortcodes/hero_bottom_img.html create mode 100644 templates/shortcodes/hero_features.html create mode 100644 templates/shortcodes/hero_right_img.html create mode 100644 templates/shortcodes/left_header.html create mode 100644 templates/shortcodes/text_left_img.html create mode 100644 templates/shortcodes/text_right_img.html diff --git a/content/about/index.md b/content/about/index.md index 06983f2..a0726f8 100644 --- a/content/about/index.md +++ b/content/about/index.md @@ -1,7 +1,7 @@ --- 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 -template: "layouts/about.html" +template: "page.html" insert_anchor_links: "left" extra: author: ThreeFold @@ -10,21 +10,101 @@ extra: - + + +{{ 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." +) }} + + + + +{{ 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." + + +) }} + + + + +{{ 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="" +) }} + + + + +{{ 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="" +) }} + + + +{{ 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="" +) }} + + + + +{{ 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." +) }} + + + + + +{{ 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/" +) }} + + + + diff --git a/content/home/index.md b/content/home/index.md index de39c98..09c2447 100644 --- a/content/home/index.md +++ b/content/home/index.md @@ -8,20 +8,307 @@ extra: --- - + +{{ hero_right_img( + image_src="/images/mycel_1.png", + 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" +) }} + + + + +{{ 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" +) }} + + + + +{{ 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." +) }} + + + + +{{ 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." +) }} + +
+
+
+ +###### **PRODUCTIVITY & COMMUNICATION** + +
+ +- Secure remote work collaboration. +- Private file sharing between trusted nodes. +- Encrypted voice/video calls. +- Self-hosted messaging systems. +- Secure document collaboration. + +
+
+ +
+ +###### **INFRASTRUCTURE** + +
+ +- Private cloud computing resources. +- Secure IoT device networks. +- Remote system administration.. +- Virtual private networks (VPNs). +- Secure backup systems. + +
+
+ +
+ +###### **SERVICES** + +
+ +- Self-hosted web services. +- Private file sharing between trusted nodes. +- Private DNS systems. +- Personal email servers. +- Secure document collaboration. + +
+
+ +
+ +###### **MEDIA & CONTENT** + +
+ +- Private media streaming. +- Personal cloud storage. +- Protected content distribution. +- Secure game servers. +- Private git repositories. + +
+ +
+
+ +
+ +--------------------------------------------- + +
+ Get Started +
+ + +
+ + + + + + +{{ 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." +) }} + +
+
+ +{{ + 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="") }} + +
+
+ + + + +{{ 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="" +) }} + +
+
+{{ + 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" + + ) }} + + +
+
+ + + + +
+ +{{ left_header( + subtitle="", + title="Frequently Asked Questions", + description="", + description2="" +) }} + +
+ +{{ 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." + ) + }} + +
+ + + + + +{{ 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" ---> \ No newline at end of file diff --git a/css/index.css b/css/index.css index 0940b5a..10e3b2d 100644 --- a/css/index.css +++ b/css/index.css @@ -263,12 +263,10 @@ background-color:#5596f5 !important; @layer components { h1 { @apply text-4xl lg:text-6xl font-normal; - color: #ffffff; font-family: "Inter", sans-serif !important; } h2 { @apply text-3xl lg:text-4xl my-4 font-normal leading-none; - color: #ffffff; font-family: "Inter", sans-serif !important; } h2 strong { @@ -276,7 +274,6 @@ background-color:#5596f5 !important; } h3 { @apply text-2xl lg:text-3xl my-4 font-extralight; - color: #ffffff; font-family: "Inter", sans-serif !important; } h3 strong { diff --git a/static/images/decentralization.svg b/static/images/decentralization.svg new file mode 100644 index 0000000..eba1ac4 --- /dev/null +++ b/static/images/decentralization.svg @@ -0,0 +1,76 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/static/images/efficiency.svg b/static/images/efficiency.svg new file mode 100644 index 0000000..dfbeb84 --- /dev/null +++ b/static/images/efficiency.svg @@ -0,0 +1,36 @@ + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/static/images/resilience.svg b/static/images/resilience.svg new file mode 100644 index 0000000..b7a237c --- /dev/null +++ b/static/images/resilience.svg @@ -0,0 +1,42 @@ + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/templates/index.html b/templates/index.html index ad9b504..5f05074 100644 --- a/templates/index.html +++ b/templates/index.html @@ -1,12 +1,10 @@ {% extends "_default/base.html" %} {% block content %} -{% include "partials/hero/myhero.html" %} -{% include "partials/hero/myhero1.html" %} -{% include "partials/hero/myhero3.html" %} -{% include "partials/hero/myhero8.html" %} -{% include "partials/hero/myhero5.html" %} -{% include "partials/hero/myhero2.html" %} -{% include "partials/hero/myhero6.html" %} -{% include "partials/hero/myhero7.html" %} -{% endblock content %} \ No newline at end of file + +
+ {% set page = get_page(path="home/index.md") %} + {{page.content | safe}} +
+{% endblock content %} + diff --git a/templates/layouts/about.html b/templates/layouts/about.html index e0ef7db..b094f1e 100644 --- a/templates/layouts/about.html +++ b/templates/layouts/about.html @@ -1,12 +1,6 @@ {% extends "_default/base.html" %} {% 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 %} \ No newline at end of file diff --git a/templates/shortcodes/accordion.html b/templates/shortcodes/accordion.html new file mode 100644 index 0000000..0f69ef8 --- /dev/null +++ b/templates/shortcodes/accordion.html @@ -0,0 +1,65 @@ + + + + + + + + + + + + +
+

+ +

+
+
+ {% if description %} +

+ {{ description }} +

+ {% endif %} +
+
+
+ + + + + + + + diff --git a/templates/shortcodes/cta.html b/templates/shortcodes/cta.html new file mode 100644 index 0000000..ea386d5 --- /dev/null +++ b/templates/shortcodes/cta.html @@ -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="") %} + + +
+
+
+
+

{{ title }}

+

{{ description }}

+
+ {{ button_text }} + {{ button_text2 }} +
+
+
+ {{ image_alt }} +
+
+
+
+ diff --git a/templates/shortcodes/desciption_blockquote.html b/templates/shortcodes/desciption_blockquote.html new file mode 100644 index 0000000..0834089 --- /dev/null +++ b/templates/shortcodes/desciption_blockquote.html @@ -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="") %} + + + +
+
+
+

{{ title }} +

+
+
+ +
+
+

+ {{ description_1 }} +

+ {{ description_2 }} +

+

+
+
+ + +
+
+
+

{{ description_3 }} +

+ {{ description_4 }}

+
+
+
+

+ Decentralized. Scalable. Intelligent. +

+
+
+
+
+
+
+ + + + diff --git a/templates/shortcodes/feature_card.html b/templates/shortcodes/feature_card.html new file mode 100644 index 0000000..e189b47 --- /dev/null +++ b/templates/shortcodes/feature_card.html @@ -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") %} + + +
+ {% if icon %} +
+ +
+ {% endif %} +

{{ title }}

+ {% if description %} +

{{ description }}

+ {% endif %} + {% if link %} + {{ link_name }} + {% endif %} + {% if caller %} +
+ {{ caller() }} +
+ {% endif %} +
+ + diff --git a/templates/shortcodes/header_center.html b/templates/shortcodes/header_center.html new file mode 100644 index 0000000..1f67ae9 --- /dev/null +++ b/templates/shortcodes/header_center.html @@ -0,0 +1,17 @@ +{% set title = title | default(value="Feature") %} +{% set subtitle = subtitle | default(value="") %} +{% set description = description | default(value="") %} + + + +
+
+
+
+

{{ title }}

+

{{ subtitle }}

+

{{ description }}

+
+
+
+
\ No newline at end of file diff --git a/templates/shortcodes/hero_bottom_img.html b/templates/shortcodes/hero_bottom_img.html new file mode 100644 index 0000000..7b90adf --- /dev/null +++ b/templates/shortcodes/hero_bottom_img.html @@ -0,0 +1,61 @@ +
+
+
+

{{ subtitle }}

+

{{ title }}

+

{{ description }}

+
+
+
+
+ {{ image_alt }} +
+
+ +
+ \ No newline at end of file diff --git a/templates/shortcodes/hero_features.html b/templates/shortcodes/hero_features.html new file mode 100644 index 0000000..1a606c5 --- /dev/null +++ b/templates/shortcodes/hero_features.html @@ -0,0 +1,46 @@ +
+
+
+

{{ subtitle_1 }}

+

{{ title }}

+

+ {{ description }} +

+
+
+
+ {{ image_alt }} +
+
+
+ {% if feature_1_title %} +
+
+ {{ feature_1_title }} +
+
{{ feature_1_description }}
+
+ {% endif %} + {% if feature_2_title %} +
+
+ {{ feature_2_title }} +
+
{{ feature_2_description }}
+
+ {% endif %} + {% if feature_3_title %} +
+
+ {{ feature_3_title }} +
+
{{ feature_3_description }}
+
+ {% endif %} +
+
+ +
+
+
diff --git a/templates/shortcodes/hero_right_img.html b/templates/shortcodes/hero_right_img.html new file mode 100644 index 0000000..e4daa7a --- /dev/null +++ b/templates/shortcodes/hero_right_img.html @@ -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="") %} + +
+
+
+
+ {{ image_alt }} +
+
+

+ {{ title }} +

+

{{ subtitle }}

+

+ {{ description_1 }} +

+ {{ description_2 }} +

+ {% if button %} +
+ + {{ button_text }} + +
+ {% endif %} +
+ +
+
+
diff --git a/templates/shortcodes/left_header.html b/templates/shortcodes/left_header.html new file mode 100644 index 0000000..e5fdcbf --- /dev/null +++ b/templates/shortcodes/left_header.html @@ -0,0 +1,72 @@ +
+
+
+

{{ subtitle }}

+

{{ title }}

+ +

{{ description }}

+

{{ description2 }}

+
+
+ +
diff --git a/templates/shortcodes/text_left_img.html b/templates/shortcodes/text_left_img.html new file mode 100644 index 0000000..f67cde1 --- /dev/null +++ b/templates/shortcodes/text_left_img.html @@ -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="") %} + +
+
+
+
+ {{ image_alt }} +
+
+

{{ subheader }}

+

{{ title }}

+

+ {{ subtitle }} +

+

+ {{ description }} +

+

+ {{ description_2 }} +

+ {% if button_link %} +
+ {{ button_text }} +
+ {% endif %} + +
+ + +
+
+
+ diff --git a/templates/shortcodes/text_right_img.html b/templates/shortcodes/text_right_img.html new file mode 100644 index 0000000..1aad73f --- /dev/null +++ b/templates/shortcodes/text_right_img.html @@ -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="") %} + +
+
+ +
+
+ {{ image_alt }} +
+
+

{{ subheader }}

+

{{ title }}

+

+ {{ subtitle }} +

+

+ {{ description }} +

+

+ {{ description_2 }} +

+ {% if button_link %} +
+ {{ button_text }} +
+ {% endif %} + +
+ + +
+
+
+