zola update
timurgordon
@ -10,6 +10,8 @@ extra:
|
||||
|
||||
<!-- section 1 (header) -->
|
||||
|
||||
{{ space() }}
|
||||
|
||||
{% row(style="center lean-right") %}
|
||||
|
||||
### GROWTH BEGINS
|
||||
@ -24,7 +26,7 @@ Creator Zones are set up to allow aspiring entrepreneurs, business people and di
|
||||
|
||||
|||
|
||||
|
||||
|
||||
|
||||
|
||||
{% end %}
|
||||
|
||||
@ -32,7 +34,7 @@ Creator Zones are set up to allow aspiring entrepreneurs, business people and di
|
||||
|
||||
{% row(style="center lean-left" bgColor="#c4ffeb") %}
|
||||
|
||||
|
||||
|
||||
|
||||
|||
|
||||
|
||||
@ -52,7 +54,7 @@ to become the standard of every Creator Zone.
|
||||
|
||||
{% row(style="center lean-left" bgColor="#e9fcff") %}
|
||||
|
||||
|
||||
|
||||
|
||||
|||
|
||||
|
||||
@ -75,7 +77,7 @@ We have created an environment where collaboration and team work lead to the dev
|
||||
|
||||
<br>
|
||||
|
||||
|
||||
|
||||
|
||||
<br>
|
||||
|
||||
@ -105,7 +107,7 @@ All Creator Zone experiences and technologies are built on top of the world’s
|
||||
|
||||
|||
|
||||
|
||||
|
||||
|
||||
|
||||
{% end %}
|
||||
|
||||
|
Before Width: | Height: | Size: 102 KiB |
|
Before Width: | Height: | Size: 1.8 MiB |
|
Before Width: | Height: | Size: 3.3 KiB |
|
Before Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 412 KiB After Width: | Height: | Size: 412 KiB |
|
Before Width: | Height: | Size: 1.8 MiB After Width: | Height: | Size: 1.8 MiB |
|
Before Width: | Height: | Size: 3.3 KiB After Width: | Height: | Size: 3.3 KiB |
|
Before Width: | Height: | Size: 136 KiB After Width: | Height: | Size: 136 KiB |
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 529 KiB After Width: | Height: | Size: 529 KiB |
|
Before Width: | Height: | Size: 5.4 KiB After Width: | Height: | Size: 5.4 KiB |
|
Before Width: | Height: | Size: 102 KiB |
|
Before Width: | Height: | Size: 5.4 KiB |
@ -10,6 +10,8 @@ extra:
|
||||
|
||||
<!-- section 1 (header) -->
|
||||
|
||||
{{ space() }}
|
||||
|
||||
{% row(style="center" margin="narrow") %}
|
||||
|
||||
### EXPERIENCE
|
||||
@ -67,7 +69,7 @@ A better world is one where we all have access to endless information and opport
|
||||
|
||||
<br>
|
||||
|
||||
OurWorld allows you and your community to prosper together!
|
||||
OurWorld allows you and your community to prosper together!
|
||||
<br>Learn whatever your heart desires. Access any opportunity to earn.
|
||||
|
||||
{% end %}
|
||||
|
||||
|
Before Width: | Height: | Size: 412 KiB |
|
Before Width: | Height: | Size: 1.8 MiB |
|
Before Width: | Height: | Size: 3.3 KiB |
|
Before Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 412 KiB |
|
Before Width: | Height: | Size: 412 KiB After Width: | Height: | Size: 412 KiB |
|
Before Width: | Height: | Size: 508 KiB After Width: | Height: | Size: 508 KiB |
|
Before Width: | Height: | Size: 443 KiB After Width: | Height: | Size: 443 KiB |
|
Before Width: | Height: | Size: 289 KiB After Width: | Height: | Size: 289 KiB |
|
Before Width: | Height: | Size: 529 KiB After Width: | Height: | Size: 529 KiB |
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 3.0 KiB |
|
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 3.9 KiB |
|
Before Width: | Height: | Size: 54 KiB After Width: | Height: | Size: 54 KiB |
|
Before Width: | Height: | Size: 460 KiB After Width: | Height: | Size: 460 KiB |
|
Before Width: | Height: | Size: 5.0 KiB After Width: | Height: | Size: 5.0 KiB |
|
Before Width: | Height: | Size: 428 KiB After Width: | Height: | Size: 428 KiB |
|
Before Width: | Height: | Size: 621 KiB After Width: | Height: | Size: 621 KiB |
@ -10,7 +10,7 @@ extra:
|
||||
|
||||
<!-- section 1 (header) -->
|
||||
|
||||
|
||||
|
||||
|
||||
{% row(style="center narrow") %}
|
||||
|
||||
@ -38,7 +38,7 @@ Creator Zones are dedicated to building super-sustainable coworking and co-livin
|
||||
|
||||
|||
|
||||
|
||||
|
||||
|
||||
|
||||
{% end %}
|
||||
|
||||
@ -46,7 +46,7 @@ Creator Zones are dedicated to building super-sustainable coworking and co-livin
|
||||
|
||||
{% row(style="center lean-left") %}
|
||||
|
||||
|
||||
|
||||
|
||||
|||
|
||||
|
||||
@ -78,7 +78,7 @@ OurWorld consists of a decentralized internet network as the foundation. This ba
|
||||
|
||||
|||
|
||||
|
||||
|
||||
|
||||
|
||||
{% end %}
|
||||
|
||||
@ -86,7 +86,7 @@ OurWorld consists of a decentralized internet network as the foundation. This ba
|
||||
|
||||
{% row(style="center lean-left") %}
|
||||
|
||||
|
||||
|
||||
|
||||
|||
|
||||
|
||||
|
Before Width: | Height: | Size: 102 KiB |
|
Before Width: | Height: | Size: 5.4 KiB |
|
Before Width: | Height: | Size: 412 KiB |
|
Before Width: | Height: | Size: 1.8 MiB |
|
Before Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 508 KiB |
|
Before Width: | Height: | Size: 289 KiB |
|
Before Width: | Height: | Size: 102 KiB |
|
Before Width: | Height: | Size: 1.3 MiB |
|
Before Width: | Height: | Size: 878 KiB |
|
Before Width: | Height: | Size: 3.0 KiB |
|
Before Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 3.9 KiB |
|
Before Width: | Height: | Size: 1.0 MiB |
|
Before Width: | Height: | Size: 394 KiB |
|
Before Width: | Height: | Size: 1.7 MiB |
|
Before Width: | Height: | Size: 1.7 MiB |
|
Before Width: | Height: | Size: 561 KiB |
|
Before Width: | Height: | Size: 920 KiB |
|
Before Width: | Height: | Size: 164 KiB |
|
Before Width: | Height: | Size: 440 KiB |
|
Before Width: | Height: | Size: 693 KiB |
|
Before Width: | Height: | Size: 100 KiB |
|
Before Width: | Height: | Size: 113 KiB |
|
Before Width: | Height: | Size: 1.7 MiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 193 KiB |
|
Before Width: | Height: | Size: 1.1 MiB |
|
Before Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 16 KiB |
|
Before Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 5.1 MiB |
|
Before Width: | Height: | Size: 96 KiB |
|
Before Width: | Height: | Size: 54 KiB |
|
Before Width: | Height: | Size: 273 KiB |
|
Before Width: | Height: | Size: 216 KiB |
|
Before Width: | Height: | Size: 413 KiB |
|
Before Width: | Height: | Size: 460 KiB |
|
Before Width: | Height: | Size: 5.0 KiB |
|
Before Width: | Height: | Size: 428 KiB |
|
Before Width: | Height: | Size: 621 KiB |
@ -1,11 +1,12 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" charset="utf-8">
|
||||
|
||||
|
||||
{% include "partials/head.html" %}
|
||||
|
||||
<body>
|
||||
{% include "partials/header.html" %}
|
||||
<div id="content" class="mx-8 md:mx-12 lg:mx-16 xl:mx-20 pt-24">
|
||||
<div id="content" class="mx-auto overflow-hidden">
|
||||
{% block content %}{% endblock %}
|
||||
</div>
|
||||
{% include "partials/footer.html" %}
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<!-- Default page template for blog posts and basic informative markdown files -->
|
||||
<main>
|
||||
|
||||
<div class="sm:w-5/6 md:w-4/5 mr-auto ml-auto px-6 lg:px-16 xl:w-11/12">
|
||||
<div class="sm:w-5/6 md:w-4/5 mr-auto ml-auto px-6 lg:px-16 xl:w-11/12 py-12">
|
||||
<img class="max-h-60 sm:max-h-60 md:max-h-80 lg:max-h-96 mx-auto" src={{"/" ~ page.extra.imgPath}} alt="">
|
||||
<div>
|
||||
<article class="article lg:w-5/6 mx-auto">
|
||||
|
||||
@ -8,7 +8,7 @@ and a side nav for category and featured post navigation
|
||||
|
||||
{% block content %}
|
||||
|
||||
<main>
|
||||
<main class="pt-12">
|
||||
|
||||
<!--sets global featured variable as the most recent post with the isFeatured tag-->
|
||||
{%- set section = get_section(path="blog/_index.md") %}
|
||||
@ -17,11 +17,14 @@ and a side nav for category and featured post navigation
|
||||
{%- set_global featured = page %}
|
||||
{% break %}
|
||||
{% endif %}
|
||||
{% if not featured %}
|
||||
{%- set_global featured = section.pages[0] %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% include "partials/featuredBlog.html" %}
|
||||
|
||||
<div class="flex flex-col md:flex-row">
|
||||
<div class="flex flex-col md:flex-row container mx-auto">
|
||||
{% include "partials/blogPosts.html" %}
|
||||
{% include "partials/blogSidebar.html" %}
|
||||
</div>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
|
||||
<div class="mx-8 md:mx-4 flex flex-col">
|
||||
<div class="flex flex-col mb-12 mr-8 lg:mr-24">
|
||||
<div class="flex flex-col mb-12">
|
||||
<h4 class="text-base not-italic font-medium leading-6 text-gray-600 mb-6"> FILTER POSTS BY</h4>
|
||||
<a id="all" class="mb-3 text-black font-normal" href="/blog">All</a>
|
||||
{% set taxonomy = get_taxonomy(kind="categories") %}
|
||||
|
||||
@ -1,29 +1,36 @@
|
||||
<body>
|
||||
|
||||
<div class="md:grid md:grid-cols-2 md:gap-8 relative mt-16 lg:mt-16 items-center">
|
||||
<div class="relative lg:ml-8 my-8 w-full md:w-auto">
|
||||
<h3 class="text-base not-italic leading-6 text-gray-600">FEATURED POST</h3>
|
||||
<a href={{featured.permalink}} class="">
|
||||
<h2 class="mt-8 text-2xl sm:text-3xl md:text-4xl lg:text-5xl fw-500 leading-snug font-normal mb-2 md:mb-4">
|
||||
{{ featured.title }}
|
||||
</h2>
|
||||
</a>
|
||||
<p class="mb-4 md:mb-10 text-lg lg:pr-4">
|
||||
{{featured.description}}
|
||||
</p>
|
||||
|
||||
<h4 class="text-sm not-italic font-light leading-6 text-gray-600">
|
||||
{{ featured.date | date(format="%B %e, %Y", timezone="America/Chicago")}} -
|
||||
{{ featured.extra.author }}
|
||||
</h4>
|
||||
|
||||
</div>
|
||||
{% if featured.taxonomies.people %}
|
||||
{% set people = get_section(path="people/_index.md") %}
|
||||
{% set pages_str = people.pages | json_encode() | as_str %}
|
||||
{% if pages_str is containing(featured.taxonomies.people[0]) %}
|
||||
{% set author_path = 'people/' ~ featured.taxonomies.people[0] ~ '/index.md' %}
|
||||
{% set author = get_page(path=author_path) %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
<body>
|
||||
|
||||
<div class="md:grid md:grid-cols-2 md:gap-8 relative mt-16 lg:mt-16 items-center container mx-auto">
|
||||
<div class="relative lg:ml-8 my-8 w-full md:w-auto">
|
||||
<h3 class="text-base not-italic leading-6 text-gray-600">FEATURED POST</h3>
|
||||
<a href={{featured.permalink}} class="">
|
||||
<h2
|
||||
class="mt-8 text-2xl main-title sm:text-3xl md:text-4xl lg:text-5xl fw-500 leading-snug font-normal mb-4 md:mb-10 ">
|
||||
{{ featured.title }}
|
||||
</h2>
|
||||
</a>
|
||||
<h4 class="text-sm not-italic font-light leading-6 text-gray-600">
|
||||
{{ featured.date | date(format="%B %e, %Y", timezone="America/Chicago")}} -
|
||||
</h4>
|
||||
|
||||
<div class="-mx-4 relative lg:mt-0 max-w-full">
|
||||
<img class="relative mx-auto w-7/12 md:w-auto md:max-w-full max-h-80" src=/{{featured.extra.imgPath}} alt="" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="-mx-4 relative lg:mt-0 max-w-full">
|
||||
<img class="relative mx-auto w-7/12 md:w-auto rounded md:max-w-full max-h-80" src=/{{featured.extra.imgPath}} alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
<hr class="mt-6">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
@ -13,9 +13,8 @@
|
||||
{{ section.content | safe }}
|
||||
{% else %}
|
||||
{% set footer_class = config.extra.footer_class | default(value='') %}
|
||||
<div class="{{ footer_class ~ ' -mx-20 pt-20'}}">
|
||||
<img src="{{get_url(path='images/footer_logo.png')}}" alt="">
|
||||
ALL RIGHTS RESERVED 2022
|
||||
</div>
|
||||
<div class="{{ footer_class ~ ' -mx-20'}}">
|
||||
<img src="{{get_url(path='images/footer.png')}}" class="w-60" alt="">
|
||||
|
||||
{% endif %}
|
||||
</footer>
|
||||
@ -102,7 +102,7 @@
|
||||
<div class="mx-auto flex z-50 shadow justify-between items-center pl-6 pr-2 md:pr-0 lg:py-5 md:px-12 py-2 lg:px-20 lg:justify-start lg:space-x-20">
|
||||
<div>
|
||||
<a href="/" class="flex">
|
||||
<img class="w-48 h-auto sm:w-15" src="{{logo_path}}" alt="FreeFlow Logo" />
|
||||
<img class="w-56 h-auto sm:w-15" src="{{logo_path}}" alt="FreeFlow Logo" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="-mr-2 -my-2 lg:hidden">
|
||||
@ -122,7 +122,7 @@
|
||||
<div class="hidden lg:flex-1 lg:flex lg:items-center lg:justify-end lg:space-x-12">
|
||||
<nav class="flex space-x-10">
|
||||
{% for page in section.pages %}
|
||||
{% if page.relative_path == "home/index.md" %} {% continue %} {% endif %}
|
||||
{% if page.extra.menu %} {% continue %} {% endif %}
|
||||
<a href="{{page.permalink}}" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
|
||||
{{page.title}}
|
||||
</a>
|
||||
@ -178,6 +178,7 @@
|
||||
<nav class="flex flex-col justify-around pb-12">
|
||||
{% for page in section.pages %}
|
||||
{% if page.relative_path == "home/index.md" %} {% continue %} {% endif %}
|
||||
{% if page.extra.menu %} {% continue %} {% endif %}
|
||||
<a href="{{page.permalink}}" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
||||
{{page.title}}
|
||||
</a>
|
||||
|
||||
56
templates/shortcodes/earn_sec.html
Normal file
@ -0,0 +1,56 @@
|
||||
<style>
|
||||
.bg_earn {
|
||||
background-color: #F2EDE8;
|
||||
}
|
||||
|
||||
.bg-boxs {
|
||||
background-color: #f7f4f0;
|
||||
}
|
||||
</style>
|
||||
<div class="relative px-4 sm:px-6 lg:pb-28 lg:px-8 bg_earn">
|
||||
<div class="relative max-w-7xl mx-auto">
|
||||
<div class="grid gap-5 max-w-lg mx-auto lg:grid-cols-3 lg:max-w-none">
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-full w-full object-cover" src="/images/1_plug_in.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">All you need to get started is
|
||||
electricity, a network connection, and a FreeFlow Node</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-full w-full object-cover" src="/images/2_offer_capacity.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Provide decentralized storage and
|
||||
compute capacity to host your communities digital life while maintaining privacy.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-full w-full object-cover" src="/images/3_earn.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Earn in the most valuable and
|
||||
rapidly growing economy: the Internet and cloud</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<button class="flex mx-auto uppercase"
|
||||
onclick="window.open('https://threefoldfoundation.github.io/books/freeflow/network/farming/farming_reward.html', '_blank')">see
|
||||
rewards</button>
|
||||
</div>
|
||||
</div>
|
||||
73
templates/shortcodes/featured_stories.html
Normal file
@ -0,0 +1,73 @@
|
||||
<style>
|
||||
.bg_earning {
|
||||
background-color: #F2F2F2;
|
||||
}
|
||||
|
||||
.bg_fflow_twin {
|
||||
background-color: #EAF3F7;
|
||||
}
|
||||
|
||||
.bg_CHi_green {
|
||||
background-color: #EBFFED;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="relative px-4 sm:px-6 lg:pb-28 lg:px-8 bg-white">
|
||||
<div class="absolute inset-0">
|
||||
<div class="bg-white h-1/3 sm:h-2/3"></div>
|
||||
</div>
|
||||
<div class="relative max-w-7xl mx-auto">
|
||||
<div class="grid gap-5 max-w-lg mx-auto lg:grid-cols-3 lg:max-w-none">
|
||||
|
||||
<div class="flex flex-col p-6 rounded-lg shadow-lg overflow-hidden bg_earning">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-full w-full object-cover" src="/images/get_earn.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h3 class="mt-2 text-4xl leading-9 font-normal uppercase text-gray-900">
|
||||
get a node and <br /><b class="font-bold">start earning</b>
|
||||
</h3>
|
||||
<div class="mt-3 leading-6 text-gray-800 text-lg max-w-sm">Get a FreeFlow Node and add capacity to
|
||||
the FreeFlow Network.</div>
|
||||
<button class="uppercase font-bold" onclick="window.location='/node'">know more</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col p-6 rounded-lg shadow-lg overflow-hidden bg_fflow_twin">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-full w-full object-cover" src="/images/ff_twin.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h3 class="mt-2 text-4xl leading-9 font-normal uppercase text-gray-900">
|
||||
GET THE <br /><b class="font-bold">FREEFLOW TWIN</b>
|
||||
</h3>
|
||||
<div class="mt-3 leading-6 text-gray-800 text-lg max-w-sm">Reserve your sovereign digital twin. <br>Take control over your digital life.</div>
|
||||
<button class="uppercase font-bold" onclick="window.location='/twin'">know more</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex flex-col p-6 rounded-lg shadow-lg overflow-hidden bg_CHi_green">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-full w-full object-cover" src="/images/chi.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h3 class="mt-2 text-4xl leading-9 font-normal uppercase text-gray-900">
|
||||
ACQUIRE <br /><b class="font-bold">CHI</b>
|
||||
</h3>
|
||||
<div class="mt-3 leading-6 text-gray-800 text-lg max-w-sm">The digital energy currency
|
||||
of <br>the FreeFlow network `CHI token`</div>
|
||||
<button class="uppercase font-bold"
|
||||
onclick="window.open('https://threefoldfoundation.github.io/books/freeflow/network/buy/buy_my_chi.html', '_blank')">know
|
||||
more</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
52
templates/shortcodes/fflow_experiences.html
Normal file
@ -0,0 +1,52 @@
|
||||
<style>
|
||||
.bg_earn3 {
|
||||
background-color: #F9F8F6;
|
||||
}
|
||||
|
||||
.bg-boxs3 {
|
||||
background-color: #EFEDEB;
|
||||
}
|
||||
</style>
|
||||
<div class="relative px-4 sm:px-6 lg:pb-28 lg:px-8 bg_earn3">
|
||||
<div class="relative max-w-7xl mx-auto">
|
||||
<div class="grid gap-5 max-w-lg mx-auto lg:grid-cols-3 lg:max-w-none">
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs3">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/education.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">FREEFLOWING<br> EDUCATION</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">All citizens can now acquire information and learn skills.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/empowerment.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">FREEFLOWING<br> EMPOWERMENT</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">All citizens can now attain the opportunity to participate in the digital economy.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/collaboration.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">FREEFLOWING<br> COLLABORATION</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">All citizens can now work together to achieve goals and growth.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
52
templates/shortcodes/fflow_grid.html
Normal file
@ -0,0 +1,52 @@
|
||||
<style>
|
||||
.bg_earn2 {
|
||||
background-color: #f0ece8;
|
||||
}
|
||||
|
||||
.bg-boxs {
|
||||
background-color: #F7F4F1;
|
||||
}
|
||||
</style>
|
||||
<div class="relative px-4 sm:px-6 lg:pb-28 lg:px-8 bg_earn2">
|
||||
<div class="relative max-w-7xl mx-auto">
|
||||
<div class="grid gap-5 max-w-lg mx-auto lg:grid-cols-3 lg:max-w-none">
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/own_data.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">fully own<br> your data</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">The entirety of your data belogs to you instead of company or service-provider.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/own_identy.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">unbeatable<br> privacy</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Only you have control of your data and decide who has access to it. Forever.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/endless.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">zero<br> manipulation</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Your data can never be used for financial or commercial gains by anyone.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
95
templates/shortcodes/fflow_skills.html
Normal file
@ -0,0 +1,95 @@
|
||||
<div class="container px-4 sm:px-6 lg:pb-28 lg:px-8 mx-auto">
|
||||
|
||||
<div class="grid gap-3 max-w-lg mx-auto lg:grid-cols-2 lg:max-w-none">
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/meet.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Meet & Communicate</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Chat with your friends, hold meetings and and have video conferencing.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/exchange.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Exchange & Store Money</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Transact or manage your assets using the wallet features available with the Twin.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/create.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Create</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Create videos, documents or anything else you require for your daily needs.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/organize.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Organize</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Archive and organize all your data in one place without worrying about security.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/share.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Share</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Send your data and files to anyone of your choice directly without central servers.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/publish.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Publish</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Build websites, librariies or whatever else you require with the FreeFlow Twin.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/discover.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Discover</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">FInd and browse any information without being tracked or logged.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/collaborate.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Collaborate</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Work with your friends, family or collegues or projects or tasks together.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row flex-wrap mx-4 sm:mx-0 py-2">
|
||||
<div class="w-full md:w-2/6 mx-auto sm:mx-0">
|
||||
<img class="mx-auto" src="/images/develop.png" alt="" />
|
||||
</div>
|
||||
<div class="w-full md:w-4/6 text-center md:text-left md:pl-2 justify-center">
|
||||
<h2 class="uppercase text-5xl">Develop & Expand</h2>
|
||||
<p class="leading-6 text-gray-900 text-xl max-w-sm">Develop more tools or decentralized applications for the FreeFlow Grid.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
53
templates/shortcodes/fflow_twin.html
Normal file
@ -0,0 +1,53 @@
|
||||
<style>
|
||||
.bg_earn {
|
||||
background-color: #D9E7DF;
|
||||
}
|
||||
|
||||
.bg-boxs {
|
||||
background-color: #F7F4F1;
|
||||
}
|
||||
</style>
|
||||
<div class="relative px-4 sm:px-6 lg:pb-28 lg:px-8 bg_earn">
|
||||
<div class="relative max-w-7xl mx-auto">
|
||||
<div class="grid gap-5 max-w-lg mx-auto lg:grid-cols-3 lg:max-w-none">
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/key.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">EVERYONE<br> HAS ACCESS</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Every member of society has access and there are no barriers to entry,.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/partake.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">ANYONE<br> CAN PARTAKE</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Only you have control of your data and decide who has access to it.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex flex-col pb-10 rounded-lg shadow-lg overflow-hidden bg-boxs">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="mx-auto object-cover" src="/images/succeed.png" alt="" />
|
||||
</div>
|
||||
<div class="flex-1 p-6 flex flex-col justify-between text-center">
|
||||
<div class="flex-1">
|
||||
<h2 class="uppercase">ANYONE<br> CAN SUCCEED</h2>
|
||||
<div class="mt-3 leading-6 text-gray-900 text-2xl max-w-sm">Anyone can attain the opportunity to earn and to better their lives.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@ -1,87 +1,78 @@
|
||||
{% set styles = "background-image: url('images/grid_map.png');" %}
|
||||
{% set data = load_data(url="https://explorer.threefold.io/api/stats", required=false, format="json") %}
|
||||
{% set capacity = data.hru + data.sru / 1000 %}
|
||||
{% set nodes = data.onlinenodes %}
|
||||
{% set styles = "background-image: url('/images/ston_bg.png');" %}
|
||||
{% set data = load_data(url="https://gridproxy.grid.tf/stats?status=up", required=false, format="json") %}
|
||||
{% if data %}
|
||||
{% set capacity = data.totalHru + data.totalSru / (1024 * 1024 * 1024 * 1024) %}
|
||||
{% set nodes = data.nodes %}
|
||||
{% set countries = data.countries %}
|
||||
{% set cores = data.cru %}
|
||||
|
||||
<section class="px-2 h-auto bg-center bg-cover bg-no-repeat" style="{{styles}}">
|
||||
<div class="flex flex-wrap lg:p-12 text-center -mx-auto">
|
||||
<div class="text-center rounded lg:px-6 mt-10 lg:mt-0 mx-auto">
|
||||
{{body | markdown | safe }}
|
||||
|
||||
<div class="my-10 grid lg:grid-cols-3 lg:gap-8">
|
||||
<div class="..."></div>
|
||||
|
||||
<!-- capacity -->
|
||||
<div class="leading-none font-extrabold text-5xl">
|
||||
{{ capacity / 1000000 | round(precision=2) }}PB
|
||||
<span class="block text-3xl uppercase">capacity</span>
|
||||
</div>
|
||||
<div class="..."></div>
|
||||
|
||||
<!-- Nodes -->
|
||||
<div class="
|
||||
mx-auto
|
||||
rounded-full
|
||||
h-32
|
||||
w-32
|
||||
lg:h-60 lg:w-60
|
||||
inline-flex
|
||||
items-center
|
||||
justify-center
|
||||
bg-green
|
||||
my-4
|
||||
">
|
||||
<div class="leading-none font-extrabold md:text-6xl">
|
||||
{{ nodes }}
|
||||
<span class="block md:text-2xl uppercase">nodes</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hidden md:block"></div>
|
||||
|
||||
<!-- countries -->
|
||||
<div class="
|
||||
mx-auto
|
||||
rounded-full
|
||||
h-32
|
||||
w-32
|
||||
lg:h-60 lg:w-60
|
||||
inline-flex
|
||||
items-center
|
||||
justify-center
|
||||
bg-pink
|
||||
">
|
||||
<div class="leading-none font-extrabold md:text-6xl">
|
||||
{{ countries }}
|
||||
<span class="block md:text-2xl uppercase">countries</span>
|
||||
{% endif %}
|
||||
<style>
|
||||
.bg-map {
|
||||
background-color: #EAE8E3;
|
||||
}
|
||||
</style>
|
||||
<div class="bg-map pb-24">
|
||||
<div class="relative max-w-7xl mx-auto">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 ">
|
||||
<div class=" overflow-hidden">
|
||||
<div class="px-2 py-16">
|
||||
<div class="flex items-start">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="/images/node_icon.png" width="65" alt="">
|
||||
</div>
|
||||
<div class="ml-5 w-0 flex-1 pt-3">
|
||||
<dl>
|
||||
<dd class="flex items-baseline mb-5 ">
|
||||
<div class="text-6xl advance leading-8 font-extrabold text-gray-900">
|
||||
{{ nodes }}
|
||||
</div>
|
||||
</dd>
|
||||
<dt class="text-2xl leading-8 uppercase font-medium text-gray-900 truncate">
|
||||
freeflow nodes <br />deployed
|
||||
</dt>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="..."></div>
|
||||
|
||||
<!-- cores -->
|
||||
<div class="leading-none font-extrabold text-5xl">
|
||||
{{ cores | num_format }}
|
||||
<span class="block text-2xl uppercase">cores</span>
|
||||
<div class=" overflow-hidden bg-no-repeat bg-center bg-contain text-center" style="{{styles}}">
|
||||
<div class="px-2 py-16">
|
||||
<div class="flex items-start">
|
||||
<div class="ml-5 w-0 flex-1 pt-3">
|
||||
<dl>
|
||||
<dd class="flex items-baseline mb-5 ">
|
||||
<div class="text-6xl advance leading-8 mx-auto font-extrabold text-gray-900">
|
||||
{{ countries }}
|
||||
</div>
|
||||
</dd>
|
||||
<dt class="text-2xl leading-8 uppercase font-medium text-gray-900 truncate">
|
||||
countries <br />involved
|
||||
</dt>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class=" overflow-hidden">
|
||||
<div class="px-2 py-16">
|
||||
<div class="flex items-start">
|
||||
<div class="flex-shrink-0">
|
||||
<img src="/images/capacity_icon.png" width="65" alt="">
|
||||
</div>
|
||||
<div class="ml-5 w-0 flex-1 pt-3">
|
||||
<dl>
|
||||
<dd class="flex items-baseline mb-5 ">
|
||||
<div class="text-6xl advance leading-8 font-extrabold text-gray-900">
|
||||
{{ capacity | round() }}TB
|
||||
</div>
|
||||
</dd>
|
||||
<dt class="text-2xl leading-8 uppercase font-medium text-gray-900 truncate">
|
||||
capacity <br />generated
|
||||
</dt>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<style>
|
||||
dd {
|
||||
display: inline-block;
|
||||
margin: auto;
|
||||
border-radius: 50%;
|
||||
line-height: 100px;
|
||||
}
|
||||
|
||||
.bg-green {
|
||||
background-color: #70dfc9;
|
||||
}
|
||||
|
||||
.bg-pink {
|
||||
background-color: #ea1ff7;
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
@ -35,7 +35,7 @@ Parameters:
|
||||
|
||||
{% set columns = body | safe | markdown | split(pat="<p>|||</p>") %}
|
||||
|
||||
{% set row_class = "relative py-12 flex flex-col sm:grid sm:grid-cols-2 sm:gap-10 md:flex md:flex-row flex-wrap max-w-fit "%}
|
||||
{% set row_class = "relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden"%}
|
||||
|
||||
<!-- aligns columns depending on col number-->
|
||||
{% if 2 < columns | length %}
|
||||
@ -44,66 +44,94 @@ Parameters:
|
||||
{% set row_class = row_class ~ " lg:items-center" %}
|
||||
{% endif %}
|
||||
|
||||
{% set col_class = "flex-1 mb-4 md:mb-12 lg:mb-0 " %}
|
||||
{% set col_class = col_class ~ " lg:mx-8 " %}
|
||||
{% set col_class = "flex-1 mb-4 md:mb-12 lg:mb-0 lg:mx-2 xl:mx-4" %}
|
||||
|
||||
|
||||
{% set row_id = '' %}
|
||||
|
||||
{% if id %}
|
||||
{% set row_id = id %}
|
||||
|
||||
{% endif %}
|
||||
|
||||
<!-- Padding -->
|
||||
|
||||
{% set padding_class = " py-8 md:py-8 lg:py-28" %}
|
||||
|
||||
{% if padding %}
|
||||
{% if "none" in padding %}
|
||||
{% set padding_class = " py-0" %}
|
||||
{% elif "top" in padding %}
|
||||
{% set padding_class = " py-2 md:py-4 lg:pt-28" %}
|
||||
{% elif "bottom" in padding %}
|
||||
{% set padding_class = " py-2 md:py-4 lg:pb-28" %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% if css %}
|
||||
{% set padding_class = padding_class ~ " " ~ css %}
|
||||
{% endif %}
|
||||
|
||||
{% set row_class = row_class ~ padding_class %}
|
||||
|
||||
|
||||
<!-- Margins -->
|
||||
|
||||
{% set margin_class = " mx-4 md:mx-16 lg:mx-24 " %}
|
||||
{% set margin_class = " mx-4 md:mx-16 lg:mx-24" %}
|
||||
|
||||
{% if margin %}
|
||||
{% if "none" in margin %}
|
||||
{% set margin_class = " mx-0 " %}
|
||||
{% set margin_class = " mx-0" %}
|
||||
{% elif "wide" in margin %}
|
||||
{% set margin_class = " mx-4 sm:mx-8 md:mx-12 lg:mx-16 xl:mx-20 " %}
|
||||
{% set margin_class = " mx-4 sm:mx-8 md:mx-12 lg:mx-16 xl:mx-20" %}
|
||||
{% elif "moderate" in margin %}
|
||||
{% set margin_class = " mx-8 sm:mx-16 md:mx-24 lg:mx-28 " %}
|
||||
{% set margin_class = " mx-8 sm:mx-16 md:mx-20 lg:mx-28" %}
|
||||
{% elif "narrow" in margin %}
|
||||
{% set margin_class = " mx-10 sm:mx-10 md:mx-24 my-10 lg:mx-24 xl:mx-24 2xl:mx-56 " %}
|
||||
{% set margin_class = " mx-12 sm:mx-20 md:mx-28 lg:mx-40" %}
|
||||
{% elif "tight" in margin %}
|
||||
{% set margin_class = " mx-20 sm:mx-32 md:mx-60 lg:mx-80 xl:mx-96 " %}
|
||||
{% set margin_class = " mx-20 sm:mx-32 md:mx-40 lg:mx-80 xl:mx-96" %}
|
||||
{% elif "header" in margin %}
|
||||
{% set margin_class = " mx-12 sm:mx-20 md:mx-28 lg:mx-40 my-10" %}
|
||||
{% endif %}
|
||||
{% if "lean-left" in margin %}
|
||||
{% set col_class = col_class ~ " lg:last:px-20 lg:max-w-[50%] lg:mx-0 " %}
|
||||
{% set row_class = row_class ~ " !ml-0 sm:gap-0 " %}
|
||||
{% set margin = margin_class | replace(from=" ", to=" first:")%}
|
||||
{% set margin_left = margin | replace(from="mx", to="-ml") %}
|
||||
{% set margin_right = margin | replace(from="mx", to="mr") %}
|
||||
{% set col_class = col_class ~ " md:last:px-8 lg:last:px-20 lg:max-w-[50%] lg:mx-0 " ~ margin_left ~ margin_right %}
|
||||
{% set row_class = row_class ~ " sm:gap-0 " %}
|
||||
{% elif "lean-right" in margin %}
|
||||
{% set col_class = col_class ~ " lg:first:px-20 lg:max-w-[50%] lg:mx-0 " %}
|
||||
{% set row_class = row_class ~ " !mr-0 sm:gap-0 " %}
|
||||
{% set margin = margin_class | replace(from=" ", to=" last:")%}
|
||||
{% set margin_left = margin | replace(from="mx", to="ml") %}
|
||||
{% set margin_right = margin | replace(from="mx", to="-mr") %}
|
||||
{% set col_class = col_class ~ " md:first:px-8 lg:first:px-20 lg:max-w-[50%] lg:mx-0 " ~ margin_left ~ margin_right %}
|
||||
{% set row_class = row_class ~ " sm:gap-0 " %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% if css %}
|
||||
{% set margin_class = margin_class ~ " " ~ css %}
|
||||
{% endif %}
|
||||
|
||||
{% set row_class = row_class ~ margin_class %}
|
||||
|
||||
{% if style %}
|
||||
|
||||
{% if "center" in style %}
|
||||
{% set row_class = row_class ~ " text-center items-center mx-auto justify-center " %}
|
||||
{% set row_class = row_class ~ " text-center items-center mx-auto " %}
|
||||
{% set col_class = col_class ~ " flex-1 " %}
|
||||
{% endif %}
|
||||
|
||||
<!-- makes row full screen width, strips margins -->
|
||||
{% if "lean" in style %}
|
||||
{% if "lean-left" in style %}
|
||||
{% set col_class = col_class ~ " last:px-20 lg:max-w-[50%] " %}
|
||||
{% set row_class = row_class ~ " sm:gap-0 " %}
|
||||
{% elif "lean-right" in style %}
|
||||
{% set col_class = col_class ~ " first:px-20 lg:max-w-[50%] -mr-8 md:-mr-12 lg:-mr-16 xl:-mr-20 " %}
|
||||
{% set row_class = row_class ~ " sm:gap-0 " %}
|
||||
{% else %}
|
||||
{% set row_class = row_class ~ " md:py-0 " %}
|
||||
{% set col_class = col_class ~ " lg:m-0" %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
{% set row_class = row_class ~ " w-screen " %}
|
||||
{% if "items-end" in style %}
|
||||
{% set row_class = row_class ~ " lg:items-end" %}
|
||||
{% set col_class = col_class ~ " flex-1 " %}
|
||||
{% endif %}
|
||||
|
||||
<!-- makes row semi-full screen width, strips margins -->
|
||||
{% if "between" in style %}
|
||||
{% set row_class = row_class ~ " lg:max-w-6xl " %}
|
||||
{% elif "moderate" in style %}
|
||||
{% set row_class = row_class ~ " " %}
|
||||
{% endif %}
|
||||
{% if "between" in style %}
|
||||
{% set row_class = row_class ~ " lg:max-w-6xl " %}
|
||||
{% elif "moderate" in style %}
|
||||
{% set row_class = row_class ~ " " %}
|
||||
{% endif %}
|
||||
|
||||
<!-- makes row full screen width, strips margins -->
|
||||
{% if "narrow" in style %}
|
||||
@ -150,20 +178,25 @@ Parameters:
|
||||
{% if "full" in bgStyle %}
|
||||
{% set styles = styles ~ "height: -webkit-fill-available; height: 100vh;" %}
|
||||
{% elif "hero" in bgStyle %}
|
||||
{% set div_class = div_class ~ " -mt-24 pt-24 " %}
|
||||
{% set div_class = div_class ~ " -mt-24 pt-12 " %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% if bgColor %}
|
||||
{% set styles = "background-color: " ~ bgColor ~ "; background-size: cover" %}
|
||||
{% set row_class = row_class ~ " py-0 " %}
|
||||
{% set row_class = row_class %}
|
||||
{% endif %}
|
||||
|
||||
{% if class %}
|
||||
{% set styles = "background-color: " ~ bgColor ~ "; background-size: cover" %}
|
||||
{% set row_class = row_class %}
|
||||
{% endif %}
|
||||
|
||||
<!-- Cancels page margins so that rows can have separate margins -->
|
||||
{% set no_margins = " -mx-8 md:-mx-12 lg:-mx-16 xl:-mx-20" %}
|
||||
|
||||
|
||||
<div id="{{anchor_link}}" class="{{'w-screen relative justify-center flex ' ~ div_class ~ no_margins}}" style="{{styles}}">
|
||||
<div class="{{row_class}}" style="min-width: -webkit-fill-available; min-width: -moz-available">
|
||||
<div id="{{anchor_link}}" class="{{'relative justify-center flex overflow-hidden ' ~ div_class }}" style="{{styles}}">
|
||||
<div id="{{row_id}}" class="{{row_class}}" style="min-width: -webkit-fill-available; min-width: -moz-available">
|
||||
|
||||
{% for column in columns%}
|
||||
|
||||
|
||||