ui alternative using shortcodes

This commit is contained in:
timurgordon 2022-03-22 19:04:04 +03:00
parent 785e5f25d7
commit c7abe17090
8 changed files with 70 additions and 61 deletions

View File

@ -9,86 +9,85 @@ extra:
imgPath: /images/threefold_globe.png
---
{% row() %}
{% row(style="center narrow") %}
# Reimagine your world
## WELCOME TO THE <br> **PEOPLES INTERNET**
<br/>
### Join the peer-to-peer revolution
Through simple, secure, and scalable technology,
OurWorld empowers millions to invent and explore
new experiences. Business, creativity, and
community are being reimagined for a more
sustainable and inclusive future.
|||
![Image](/images/ourworld_mycellium.png#large)
Powered by the ThreeFold blockchain the Peoples Internet is the layer 0 infrastructure for an open source P2P Internet owned by humanity.
{% end %}
{% row(style="lean") %}
![Image](/images/threefold_img2.png)
![Image](/images/threefold_img.jpg)
{% end %}
{% row() %}
{% row(style="center") %}
## Foundation for Creation
### EXPAND THE PEOPLES INTERNET <br> AND EARN TFT
<br>
By connecting hardware at your home or office, support the growth of a decentralized Internet and earn a new digital currency, TFT.
The Creator Economy requires robust infrastructure
including a set of intuitive developer tools, and an
engaged, decentralized community.
<button>[Become a farmer](/become-farmer)</button>
<br>
[Learn about the Creator Economy on OurWorld]("/")
![Image](/images/become_farmer_new.jpg)
|||
![Image](/images/threefold_globe.png#large)
### DECENTRALIZE YOUR
### DATA AND WORKLOADS
Companies and developers have already started using ThreeFold for its autonomous, decentralization and privacy features.
<button>[Deploy](/deploy)</button>
![Image](/images/network_new.jpg)
{% end %}
{% row() %}
{% row(style="center") %}
## Solutions for Scaling
<br>
OurWorld is eliminating the barriers to Web 3
adoption. With high speeds, low fees, and
progressive UX, OurWord climate-neutral
blockchain is ready for explosive growth.
<br>
[Link to something]("/")
![Image](/images/p4p_new.png#medium)
|||
![Image](/images/landing_img2.jpg#large)
## BUILT BY <br> THE PEOPLE <br> FOR HUMANITY
The Peoples Internet is formed by independent people from all around the world who connect Internet capacity to a new Planetary Network. Together they form a collective that brings a new paradigm an open-source peer-to-peer Internet owned by humanity.
<button>[Learn More](/learn-more)</button>
{% end %}
{% row() %}
{% row(style="center") %}
## For a multi-chain future
## POWERED BY A
<br>
## DECENTRALIZED OS
OurWorld runs in concert with Ethereum, Polkadot, Cosmos, and more, allowing for the free flow of assets and communication between networks for the betterment of all.
Zero-OS is a stateless and lightweight operating system designed to host anything that runs on Linux in a decentralized way. Once installed, Zero-OS locks the hardware and dedicates its capacity to the Peoples Internet via the ThreeFold Blockchain.
<br>
[Link to something]("/")
<button>[Learn More](/learn-more)</button>
|||
![Image](/images/threefold_technology_home.jpg)
![Image](/images/zero_os.jpg#large)
{% end %}
{% row(style="center moderate") %}
## OUR GREATEST STRENGTH <br> COMES FROM OUR PARTNERS
We are truly proud to be trusted by some of the biggest names in the industry.
![Image](/images/ourpartners.png)
<button>[Check All Partners](/learn-more)</button>
{% end %}

View File

@ -30,7 +30,7 @@ img[src*="#small"] {
}
img[src*="#medium"] {
width: 150px;
width: 250px;
margin: auto;
}
@ -75,6 +75,9 @@ img[src*="#large"] {
li li {
@apply text-sm lg:text-sm font-light;
}
button a {
@apply inline-block lg:text-lg hover:bg-gray-400 px-12 py-1 mr-5 my-10 border-2 shadow border-black capitalize;
}
}
button:hover :is(:where(a)) {

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

BIN
static/images/p4p_new.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

BIN
static/images/zero_os.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

View File

@ -10,40 +10,48 @@ Parameters:
-->
{% set columns = body | safe | markdown | split(pat="|||") %}
{% set classes = "relative pt-12 flex flex-col sm:grid sm:grid-cols-2 sm:gap-10 xl:flex xl:flex-row md:py-12 lg:py-16"%}
{% set row_class = "relative pt-12 flex flex-col sm:grid sm:grid-cols-2 sm:gap-10 xl:flex xl:flex-row md:py-12 lg:py-16"%}
<!-- aligns columns depending on col number-->
{% if 2 < columns | length %}
{% set classes = classes ~ " lg:items-start" %}
{% set row_class = row_class ~ " lg:items-start" %}
{% else %}
{% set classes = classes ~ " lg:items-center" %}
{% set row_class = row_class ~ " lg:items-center" %}
{% endif %}
{% set column_classes = "flex-1 mb-8 md:mb-0 md:mx-8" %}
{% set col_class = "flex-1 mb-8 md:mb-0 md:mx-8" %}
{% if style %}
<!-- makes row full screen width, strips margins -->
{% if "lean" in style %}
{% set classes = "relative flex flex-col lg:flex-row items-baseline -mx-8 sm:-mx-12 md:-mx-16 lg:-mx-20" %}
{% set column_classes = "flex-1 m-4 lg:m-0" %}
{% if "center" in style %}
{% set row_class = row_class ~ " text-center mx-auto justify-center" %}
{% set col_class = col_class ~ " flex-1 m-4 lg:m-0" %}
{% endif %}
{% if "center" in style %}
{% set classes = classes ~ " text-center" %}
<!-- makes row full screen width, strips margins -->
{% if "lean" in style %}
{% set row_class = "relative flex flex-col lg:flex-row items-baseline -mx-8 sm:-mx-12 md:-mx-16 lg:-mx-20" %}
{% set col_class = "flex-1 m-4 lg:m-0" %}
{% endif %}
<!-- makes row full screen width, strips margins -->
{% if "narrow" in style %}
{% set row_class = row_class ~ " lg:max-w-3xl" %}
{% elif "moderate" in style %}
{% set row_class = row_class ~ " lg:m-20" %}
{% endif %}
{% endif %}
<!-- makes row full screen width and adds background img -->
{% set styles = "" %}
{% if bgPath %}
{% set styles = "background: url('" ~ bgPath ~ "'); background-size: cover" %}
{% set classes = classes ~ "w-screen -mx-8 sm:-mx-12 md:-mx-16 lg:-mx-20 lg:py-40 p-8 sm:p-12 md:p-16 lg:p-20" %}
{% set row_class = row_class ~ "w-screen -mx-8 sm:-mx-12 md:-mx-16 lg:-mx-20 lg:py-40 p-8 sm:p-12 md:p-16 lg:p-20" %}
{% endif %}
<div class="{{classes}}" style="{{styles}}">
<div class="{{row_class}}" style="{{styles}}">
{% for column in columns%}
<!-- Hides empty columns if displayed vertically in small screen -->
@ -53,7 +61,7 @@ Parameters:
</div>
{% else %}
<div class="{{column_classes}}">
<div class="{{col_class}}">
<!-- handles mermaid markdown content display -->
{% if "{% mermaid() %}" in column %}
{% set mermaid_section = column | safe | markdown | split(pat="{% mermaid() %}") %}
@ -65,7 +73,6 @@ Parameters:
{{ column | safe }}
{% endif %}
</div>
{% endif %}
{% endfor %}
</div>