diff --git a/content/_index.md b/content/_index.md index 98f330c..7a05f5e 100644 --- a/content/_index.md +++ b/content/_index.md @@ -12,35 +12,51 @@ extra: {% row(style="invert-color" bgPath="/images/ow_lp1.jpg" bgStyle="full") %} +![TF Logo](/images/ow_lp_logo.png#small) + +
+
+

-## Be at the source of WEB4 Movement +## Power the WEB4 Movement

-#### Shaping the future internet +#### The Internet of Internets -#### open, green, resilient, inclusive +#### Open, regenerative & inclusive
-
+ + {% end %} -{% row(style="lean") %} +{% row(style="moderate center") %} -![Image](images/ow_lp.png) - -{% end %} - -{% row(style="invert-color" bgPath="/images/ow_lp2.jpg" bgStyle="full") %} +## SPRING CAMPAIGN
-## The Foundation for a +![Image](images/ow_lp40.jpg) -## Decentralized World. +
+ +**4 MILLION € ALREADY RAISED** + +{% end %} + +![Tech image](/images/ow_lp2.jpg#mobile) + +{% row(style="invert-color" bgPath="/images/ow_lp2.jpg#desktop" bgStyle="full") %} + +
+ +## The Foundation for + +## a Decentralized World.

@@ -49,7 +65,7 @@ Power to change everything. Discover a sovereign, secure and regenerative Intern
-The Internet of Internets is bringing a new paradigm for people, enterprises and governements. +The Internet of Internets is bringing a new paradigm for people, enterprises and governments. ||| @@ -63,7 +79,7 @@ The Internet of Internets is bringing a new paradigm for people, enterprises and {% row(style="moderate")%} -![Image](/images/ow_lp3.jpg) +![Image](/images/ow_lp3.jpg#desktop)
diff --git a/css/index.css b/css/index.css index e7b4a1e..319cc1a 100644 --- a/css/index.css +++ b/css/index.css @@ -8,15 +8,14 @@ @import "tailwindcss/components"; @import "admonition.css"; @import "tailwindcss/utilities"; -@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"); -@import url("https://fonts.googleapis.com/css2?family=Exo:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"); +@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"); /* Custom CSS for header partial */ .backdrop-blur { -webkit-backdrop-filter: blur(40px); } * { - font-family: "Exo", sans-serif; + font-family: "Montserrat", sans-serif; } a { @@ -33,7 +32,7 @@ img[src*="#mx-auto"] { } img[src*="#small"] { - width: 68px; + width: 60px; } @@ -47,6 +46,22 @@ img[src*="#medium"] { margin: auto; } +img[src*="#mobile"] { + display: none; +} + +@media (max-width: 440px) { + img[src*="#mobile"] { + display: block; + } +} + +@media (max-width: 440px) { + img[src*="#desktop"] { + display: none; + } +} + img[src*="#logo"] { max-width: min(250px, 100%); margin: auto; @@ -74,7 +89,7 @@ img[src*="#tft_img"] { @apply font-semibold; } h2 { - @apply text-4xl md:text-4xl lg:text-5xl xl:text-6xl font-semibold leading-none; + @apply text-2xl md:text-4xl lg:text-5xl font-semibold leading-none; } h2 strong { @apply font-medium; @@ -95,7 +110,7 @@ img[src*="#tft_img"] { @apply text-md not-italic font-normal my-1; } p { - @apply text-md lg:text-md font-normal tracking-wide leading-normal; + @apply text-sm lg:text-md font-normal tracking-wide leading-normal; font-family: "Lato", sans-serif; } blockquote { @@ -109,17 +124,27 @@ img[src*="#tft_img"] { } button { @apply inline-block - lg:text-lg - px-12 + font-sans + text-sm + lg:text-xl + px-6 + lg:px-16 py-1 mr-5 my-10 border-2 + rounded-3xl shadow + font-bold capitalize; } } +button.dark { + background-color: #1a1a1a; +} + + button:hover :is(:where(a)) { color: #c6f8ff; } @@ -129,6 +154,7 @@ button :is(:where(p)) { font-weight: 400; } +/* button { background-color: #1a1a1a; border-radius: 20px; @@ -136,6 +162,7 @@ button { box-shadow: none; font-size: 20px; } +*/ button a { color: white; diff --git a/css/layout.css b/css/layout.css index ff59c95..a8e08b5 100644 --- a/css/layout.css +++ b/css/layout.css @@ -128,19 +128,13 @@ h1, h2, .h2, h3, -.h3 { - font-family: "Exo", sans-serif; -} - +.h3, h4, .h4, h5, .h5, h6, -.h6 { - @apply font-sans leading-none tracking-tight; - font-family: "Lato", sans-serif; -} +.h6, h1, .h1 { diff --git a/static/images/ow_lp40.jpg b/static/images/ow_lp40.jpg new file mode 100644 index 0000000..3f1c034 Binary files /dev/null and b/static/images/ow_lp40.jpg differ diff --git a/static/images/ow_lp_logo.png b/static/images/ow_lp_logo.png index 5712c49..0225730 100644 Binary files a/static/images/ow_lp_logo.png and b/static/images/ow_lp_logo.png differ diff --git a/tailwind.config.js b/tailwind.config.js index fe54011..e2edb12 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -1,6 +1,7 @@ const colors = require('tailwindcss/colors') module.exports = { + important: '#content', content: [ './templates/**/*.html' ], @@ -12,6 +13,13 @@ module.exports = { } }, theme: { + fontFamily: { + 'sans': ['Montserrat', 'system-ui'], + 'serif': ['ui-serif', 'Georgia'], + 'mono': ['ui-monospace', 'SFMono-Regular'], + 'display': ['Montserrat'], + 'body': ['"Montserrat"'] + }, fontSize: { 'xs': '.75rem', 'sm': '.875rem', diff --git a/templates/_default/base.html b/templates/_default/base.html index 7888bf9..1e64aa0 100644 --- a/templates/_default/base.html +++ b/templates/_default/base.html @@ -2,11 +2,9 @@ {% include "partials/head.html" %} - {% include "partials/header.html" %} - -
+
{% block content %}{% endblock %}
diff --git a/templates/shortcodes/row.html b/templates/shortcodes/row.html index 0ff6392..81d76f4 100644 --- a/templates/shortcodes/row.html +++ b/templates/shortcodes/row.html @@ -31,10 +31,10 @@ Parameters: {% if "lean" in style %} {% if "lean-left" in style %} - {% set col_class = col_class ~ " last:px-20 max-w-[50%] " %} + {% 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 max-w-[50%] " %} + {% set col_class = col_class ~ " first:px-20 lg:max-w-[50%] " %} {% set row_class = row_class ~ " sm:gap-0 " %} {% else %} {% set row_class = row_class ~ " md:py-0 " %} @@ -74,32 +74,47 @@ Parameters: {% set anchor_link = anchor %} {% endif %} - {% set styles = "" %} +{% set div_class = " " %} {% if bgPath %} - {% set styles = "background: url('" ~ bgPath ~ "'); background-size: cover;" %} + {% set styles = "background: url('" ~ bgPath ~ "'); background-size: cover; background-position: center;" %} + {% if "#desktop" in bgPath %} + {% set div_class = " !bg-[length:0px_0px] !bg-no-repeat lg:!bg-cover " %} + {% set row_class = row_class | replace(from='text-white', to='') %} + {% endif %} {% endif %} {% if bgStyle %} - {% set styles = "background: url('" ~ bgPath ~ "'); background-size: cover; height: -webkit-fill-available" %} + {% if "full" in bgStyle %} + {% set styles = styles ~ "height: -webkit-fill-available; height: 100vh;" %} + {% endif %} {% endif %} {% if bgColor %} {% set styles = "background-color: " ~ bgColor ~ "; background-size: cover" %} {% set row_class = row_class ~ " py-0 " %} {% endif %} -
+ +
{% for column in columns%} {% if column | as_str | length < 10 %} -