Merge remote-tracking branch 'template/master' into development_template
This commit is contained in:
timurgordon
commit
368fb13a06
21
.github/workflows/tf_update.yml
vendored
21
.github/workflows/tf_update.yml
vendored
@ -1,22 +1,43 @@
|
||||
<<<<<<< HEAD
|
||||
name: Ourworld.tf
|
||||
on:
|
||||
push:
|
||||
branch: [ master ]
|
||||
=======
|
||||
name: freeflow.life
|
||||
on:
|
||||
push:
|
||||
branch: [ development ]
|
||||
>>>>>>> template/master
|
||||
|
||||
jobs:
|
||||
job_one:
|
||||
name: Deploy
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
<<<<<<< HEAD
|
||||
- name: pushing latest change on www.ourworld.tf
|
||||
uses: appleboy/ssh-action@master
|
||||
with:
|
||||
host: www.ourworld.tf
|
||||
=======
|
||||
- name: pushing latest change on www2.freeflow.life
|
||||
uses: appleboy/ssh-action@master
|
||||
with:
|
||||
host: www2.freeflow.life
|
||||
>>>>>>> template/master
|
||||
username: root
|
||||
key: ${{ secrets.TF_SECRET }}
|
||||
port: 22
|
||||
script: |
|
||||
<<<<<<< HEAD
|
||||
cd /opt/www_ourworld_tf/
|
||||
git log -1
|
||||
git pull
|
||||
npm run build
|
||||
=======
|
||||
cd /opt/www_freeflow_life
|
||||
git log -1
|
||||
git pull
|
||||
bash build.sh
|
||||
>>>>>>> template/master
|
||||
|
||||
6
.gitignore
vendored
6
.gitignore
vendored
@ -1,6 +0,0 @@
|
||||
/public
|
||||
/.vscode
|
||||
# Local Netlify folder
|
||||
/.netlify
|
||||
/node_modules
|
||||
/static/css
|
||||
7
.gitpod.yml
Normal file
7
.gitpod.yml
Normal file
@ -0,0 +1,7 @@
|
||||
# This configuration file was automatically generated by Gitpod.
|
||||
# Please adjust to your needs (see https://www.gitpod.io/docs/config-gitpod-file)
|
||||
# and commit this file to your remote git repository to share the goodness with others.
|
||||
|
||||
tasks:
|
||||
- init: sh build
|
||||
command: sh build
|
||||
44
build.sh
Normal file
44
build.sh
Normal file
@ -0,0 +1,44 @@
|
||||
echo "Starting build..."
|
||||
|
||||
# TODO: Check if current version is latest to avoid redundant installation
|
||||
if [[ -f "tailwindcss" ]]
|
||||
then
|
||||
rm tailwindcss
|
||||
fi
|
||||
|
||||
# checks os and architecture for correct release
|
||||
# https://stackoverflow.com/a/8597411
|
||||
echo "Installing & building tailwind..."
|
||||
ASSET="tailwindcss"
|
||||
|
||||
if [[ "$OSTYPE" == "linux-gnu"* ]]; then
|
||||
ASSET="$ASSET-linux"
|
||||
elif [[ "$OSTYPE" == "darwin"* ]]; then
|
||||
ASSET="$ASSET-macos"
|
||||
fi
|
||||
if [[ "$(uname -m)" == "x86_64"* ]]; then
|
||||
ASSET="$ASSET-x64"
|
||||
elif [[ "$(uname -m)" == "arm64"* ]]; then
|
||||
ASSET="$ASSET-arm64"
|
||||
fi
|
||||
|
||||
curl -sLO "https://github.com/tailwindlabs/tailwindcss/releases/latest/download/${ASSET}"
|
||||
chmod +x $ASSET
|
||||
mv $ASSET tailwindcss
|
||||
|
||||
|
||||
# initialized and configures tailwind if not configured
|
||||
echo "Initializing tailwind..."
|
||||
if [[ ! -f "tailwind.config.js" ]]
|
||||
then
|
||||
./tailwindcss init
|
||||
sed -i '' "s| content: \\[\\],| content: \\['./templates/**/*.html'\\],|g" tailwind.config.js
|
||||
fi
|
||||
|
||||
# compiles tailwind css for prod & builds project
|
||||
echo "Compiling tailwindcss and building zola project..."
|
||||
rm -rf public static/css
|
||||
./tailwindcss -i css/index.css -o ./static/css/index.css --minify
|
||||
zola build
|
||||
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
# The URL the site will be built for
|
||||
base_url = "https://liquiditypool.threefold.io"
|
||||
base_url = "https://ourworld.tf"
|
||||
# Change this to your own URL! Please note this variable **must** be uncommented.
|
||||
|
||||
title = "ThreeFold"
|
||||
|
||||
@ -2,6 +2,18 @@ main {
|
||||
@apply pt-0;
|
||||
}
|
||||
|
||||
<<<<<<< HEAD
|
||||
=======
|
||||
#text-1xl { @apply text-xl }
|
||||
#text-2xl { @apply text-2xl }
|
||||
#text-3xl { @apply text-3xl }
|
||||
#text-4xl { @apply text-4xl }
|
||||
#text-5xl { @apply text-5xl }
|
||||
#text-6xl { @apply text-6xl }
|
||||
#text-7xl { @apply text-7xl }
|
||||
#text-8xl { @apply text-8xl }
|
||||
|
||||
>>>>>>> template/master
|
||||
/*
|
||||
html, body {
|
||||
@apply dark:bg-black;
|
||||
@ -120,6 +132,7 @@ h5,
|
||||
.h5,
|
||||
h6,
|
||||
.h6 {
|
||||
<<<<<<< HEAD
|
||||
@apply font-sans leading-none tracking-tight;
|
||||
}
|
||||
|
||||
@ -137,6 +150,11 @@ h6,
|
||||
.h6,
|
||||
|
||||
h1,
|
||||
=======
|
||||
}
|
||||
|
||||
h1,
|
||||
>>>>>>> template/master
|
||||
.h1 {
|
||||
@apply text-4xl font-extrabold;
|
||||
}
|
||||
|
||||
25
start.sh
Normal file
25
start.sh
Normal file
@ -0,0 +1,25 @@
|
||||
# builds if executable isn't foound
|
||||
if [[ ! -f "tailwindcss" ]]
|
||||
then
|
||||
sh build.sh
|
||||
fi
|
||||
|
||||
# initialized and configures tailwind if not configured
|
||||
if [[ ! -f "tailwind.config.js" ]]
|
||||
then
|
||||
./tailwindcss init
|
||||
sed -i '' "s| content: \\[\\],| content: \\['./templates/**/*.html'\\],|g" tailwind.config.js
|
||||
fi
|
||||
|
||||
# compiles tailwind css & launches locally
|
||||
rm -rf public static/css
|
||||
./tailwindcss -i css/index.css -o ./static/css/index.css --watch & zola serve &
|
||||
|
||||
# compiles tailwind css for prod & builds project
|
||||
./tailwindcss -i css/index.css -o ./static/css/index.css --minify
|
||||
zola build
|
||||
|
||||
# kills zola and tw bg processes on interrupt
|
||||
trap 'kill $(jobs -p); exit 1' INT
|
||||
wait
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" charset="utf-8">
|
||||
<<<<<<< HEAD
|
||||
{% include "partials/head.html" %}
|
||||
|
||||
<body>
|
||||
@ -9,4 +10,16 @@
|
||||
</div>
|
||||
|
||||
</body>
|
||||
=======
|
||||
|
||||
{% 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">
|
||||
{% block content %}{% endblock %}
|
||||
</div>
|
||||
{% include "partials/footer.html" %}
|
||||
</body>
|
||||
>>>>>>> template/master
|
||||
</html>
|
||||
@ -1,8 +1,16 @@
|
||||
{% extends "_default/base.html" %}
|
||||
{% block content %}
|
||||
|
||||
<<<<<<< HEAD
|
||||
<!-- Landing page template, has a banner and rows of page summaries -->
|
||||
<main>
|
||||
{{section.content | safe}}
|
||||
</main>
|
||||
=======
|
||||
<!-- home page template, has a banner and rows of page summaries -->
|
||||
<div>
|
||||
{% set page = get_page(path="home/index.md") %}
|
||||
{{page.content | safe}}
|
||||
</div>
|
||||
>>>>>>> template/master
|
||||
{% endblock content %}
|
||||
@ -5,6 +5,16 @@
|
||||
<main>
|
||||
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
|
||||
<script>mermaid.initialize({startOnLoad:true});</script>
|
||||
<<<<<<< HEAD
|
||||
{{page.content | safe}}
|
||||
=======
|
||||
<div>
|
||||
{% if page %}
|
||||
{{page.content | safe}}
|
||||
{% else %}
|
||||
{{section.content | safe}}
|
||||
{% endif %}
|
||||
</div>
|
||||
>>>>>>> template/master
|
||||
|
||||
</main> {% endblock content %}
|
||||
|
||||
@ -3,6 +3,7 @@
|
||||
Read the documentation to get started: https://tailwindui.com/documentation
|
||||
-->
|
||||
|
||||
<<<<<<< HEAD
|
||||
{%- set section = get_section(path="footer/_index.md") %}
|
||||
{%- set logoPath = section.extra.logoPath %}
|
||||
|
||||
@ -31,3 +32,21 @@
|
||||
</body>
|
||||
</html>
|
||||
|
||||
=======
|
||||
{%- set section = get_section(path="_index.md") %}
|
||||
|
||||
{% set subsections_str = section.subsections | join(sep=" ") %}
|
||||
|
||||
<footer class="bottom-0 mx-20">
|
||||
{% if "footer/_index.md" in subsections_str %}
|
||||
{%- set section = get_section(path="footer/_index.md") %}
|
||||
{{ 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>
|
||||
{% endif %}
|
||||
</footer>
|
||||
>>>>>>> template/master
|
||||
|
||||
@ -84,6 +84,7 @@
|
||||
|
||||
</script>
|
||||
|
||||
<<<<<<< HEAD
|
||||
{%- set section = get_section(path="header/_index.md") %}
|
||||
{% set header_items = section.content | safe | split(pat="<li>") %}
|
||||
|
||||
@ -224,3 +225,144 @@
|
||||
|
||||
|
||||
</header>
|
||||
=======
|
||||
|
||||
<!-- set variables used for header template -->
|
||||
{% set section = get_section(path="_index.md") %}
|
||||
{% set subsections_str = section.subsections | join(sep=" ") %}
|
||||
{% set logo_path = get_url(path=section.extra.logo_path | default(value='')) %}
|
||||
|
||||
{% if "header/_index.md" in subsections_str %}
|
||||
{% set section = get_section(path="header/_index.md") %}
|
||||
{% set header_items = section.content | safe | split(pat="<li>") %}
|
||||
{% include "partials/header_custom.html" %}
|
||||
{% else %}
|
||||
<header id="header-container">
|
||||
{% set header_class = config.extra.header_class | default(value='') %}
|
||||
<div class="{{'z-10 bg-white fixed w-screen ' ~ header_class}}">
|
||||
<div class="relative z-50 shadow">
|
||||
<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" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="-mr-2 -my-2 lg:hidden">
|
||||
<button id="hamburger-btn" type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2">
|
||||
<!-- Heroicon name: menu -->
|
||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
|
||||
</svg>
|
||||
</button>
|
||||
<button id="close-hamburger-btn" type="button" class="hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2">
|
||||
<!-- Heroicon name: x -->
|
||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<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 %}
|
||||
<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>
|
||||
<div class="relative">
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% for subsection in section.subsections %}
|
||||
{% if subsection == "footer/_index.md" %} {% continue %} {% endif %}
|
||||
{% set button_id = subsection ~ "-menu-btn" | slugify %}
|
||||
<div class="relative">
|
||||
<button type="button" id="{{button_id}}" class="nav_btn text-gray-900 group inline-flex items-center space-x-2 text-lg leading-6 hover:text-blue-300 focus:outline-none transition ease-in-out duration-150">
|
||||
<span>{{ subsection }}</span>
|
||||
<div class="-rotate-90 transition-transform"><svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0z" fill="none"/><path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"/></svg></div>
|
||||
</button>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% for subsection in section.subsections %}
|
||||
{% if subsection == "footer/_index.md" %} {% continue %} {% endif %}
|
||||
{% set submenu_id = subsection ~ "-menu" | slugify %}
|
||||
<nav>
|
||||
<div id="{{submenu_id}}" class="mt-16 sm:mt-0 md:mt-0 lg:mt-0 xl:mt-0 2xl:mt-0 z-30 absolute inset-x-0 transform shadow-lg lg:backdrop-blur xl:backdrop-blur transition duration-200 ease-in opacity-0 -translate-y-1 hidden">
|
||||
<div class="bg-white lg:bg-semi-white md:bg-semi-white xl:bg-semi-white">
|
||||
<div class="mx-8 lg:mx-20 xl:mx-20 px-6 py-4 sm:p-6 md:p-8 lg:p-12 xl:p-12">
|
||||
{{subsection | safe }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
{% endfor %}
|
||||
|
||||
|
||||
<!--
|
||||
Mobile menu, show/hide based on mobile menu state.
|
||||
|
||||
Entering: "duration-200 ease-out"
|
||||
From: "opacity-0 scale-95"
|
||||
To: "opacity-100 scale-100"
|
||||
Leaving: "duration-100 ease-in"
|
||||
From: "opacity-100 scale-100"
|
||||
To: "opacity-0 scale-95"
|
||||
-->
|
||||
<div id="hamburger" class="hidden fixed mt-16 z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden">
|
||||
<div>
|
||||
<div class="shadow-xs h-screen bg-white divide-y-2 divide-gray-50">
|
||||
<div class="pb-6 sm:px-12 md:px-16 lg:px-20 space-y-6 sm:space-y-8 sm:pb-8 max-h-screen overflow-y-auto">
|
||||
|
||||
<nav class="flex flex-col justify-around pb-12">
|
||||
{% for page in section.pages %}
|
||||
{% if page.relative_path == "home/index.md" %} {% 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>
|
||||
<hr/>
|
||||
{% endfor %}
|
||||
{% for subsection in section.subsections %}
|
||||
{% if subsection == "footer/_index.md" %} {% continue %} {% endif %}
|
||||
{% set button_id = subsection ~ "-mobile-menu-btn" | slugify %}
|
||||
{% set menu_id = subsection ~ "-mobile-menu" | slugify %}
|
||||
|
||||
<button type="button" id="{{button_id}}" class="flex flex px-8 py-3 items-start text-left text-gray-900 group inline-flex space-x-2 text-lg leading-6 font-normal hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
||||
<span>{{ subsection }}</span>
|
||||
<div class="-rotate-90 transition-transform"><svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0z" fill="none"/><path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"/></svg></div>
|
||||
</button>
|
||||
|
||||
<div id="{{menu_id}}" class="z-50 leading-3 pl-12 pt-6 pb-4 inset-x-0 text-sm transform duration-200 ease-in opacity-0 -translate-y-1 hidden">
|
||||
{{ subsection | safe }}
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
{% endfor %}
|
||||
{% if "footer/_index.md" in subsections_str %}
|
||||
{% set section = get_section(path="footer/_index.md")%}
|
||||
<div class="mx-8 mt-8">
|
||||
<div class="space-y-8 lg:max-w-lg xl:max-w-lg lg:mr-8 lg:mb-8 xl:col-span-1">
|
||||
<img class="w-48 h-auto" src="{{logo_path}}" alt="Company name" />
|
||||
<p class="text-gray-500 text-base leading-6 ">
|
||||
{{section.description}}
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</header>
|
||||
|
||||
{% endif %}
|
||||
|
||||
|
||||
>>>>>>> template/master
|
||||
|
||||
228
templates/partials/header_custom.html
Normal file
228
templates/partials/header_custom.html
Normal file
@ -0,0 +1,228 @@
|
||||
<!--
|
||||
Tailwind UI components require Tailwind CSS v1.8 and the @tailwindcss/ui plugin.
|
||||
Read the documentation to get started: https://tailwindui.com/documentation
|
||||
--><!-- This example requires Tailwind CSS v1.4.0+ -->
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
var displayedMenu = "";
|
||||
var hamburgerShown = false;
|
||||
let width = screen.width;
|
||||
var isMobile = width < 1024;
|
||||
|
||||
function toggleMenu(button) {
|
||||
if (displayedMenu === button.id.split("-")[0]) {
|
||||
button.className = button.className.replace(" text-blue-500 bg-stone-200 sm:bg-transparent", " text-gray-900");
|
||||
hideMenu(button.id.split("-")[0]);
|
||||
button.lastElementChild.className = button.lastElementChild.className.replace("rotate-0", "-rotate-90")
|
||||
displayedMenu = "";
|
||||
}
|
||||
else {
|
||||
showMenu(button.id.split("-")[0]);
|
||||
button.lastElementChild.className = button.lastElementChild.className.replace("-rotate-90", "rotate-0")
|
||||
button.className = button.className.replace(" text-gray-900", " text-blue-500 bg-stone-200 sm:bg-transparent");
|
||||
displayedMenu = button.id.split("-")[0]
|
||||
}
|
||||
}
|
||||
|
||||
function handleClick(button) {
|
||||
if (button.id === "hamburger-btn" || button.id === "close-hamburger-btn") { toggleHamburger() }
|
||||
if (button.id.indexOf("menu") !== -1 ) {
|
||||
toggleMenu(button)
|
||||
}
|
||||
}
|
||||
|
||||
function toggleHamburger() {
|
||||
if (hamburgerShown) {
|
||||
hideHamburger();
|
||||
hamburgerShown = false;
|
||||
}
|
||||
else {
|
||||
showHamburger();
|
||||
hamburgerShown = true;
|
||||
}
|
||||
}
|
||||
|
||||
function showMenu(menuName) {
|
||||
var menuId = menuName + (isMobile ? '-mobile-menu' : '-menu');
|
||||
var menuBtnId = menuName + (isMobile ? '-mobile-menu' : '-menu');
|
||||
var menuElement = document.getElementById(menuId)
|
||||
menuElement.className = menuElement.className.replace(" hidden" , "");
|
||||
setTimeout(function() { menuElement.className = menuElement.className.replace("duration-200 ease-in opacity-0 -translate-y-1", "duration-150 ease-out opacity-1 -translate-y-0"); }, 10);
|
||||
}
|
||||
|
||||
function hideMenu(menuName) {
|
||||
var menuId = menuName + (isMobile ? '-mobile-menu' : '-menu');
|
||||
var menuElement = document.getElementById(menuId)
|
||||
menuElement.className = menuElement.className.replace("duration-150 ease-out opacity-1 -translate-y-0", "duration-200 ease-in opacity-0 -translate-y-1");
|
||||
setTimeout(function() { menuElement.className = menuElement.className + " hidden" }, 300);
|
||||
}
|
||||
|
||||
function showHamburger() {
|
||||
document.getElementById('header-container').className = "overflow-hidden";
|
||||
document.getElementById('hamburger').className = "fixed mt-16 z-20 top-0 inset-x-0 transition transform origin-top-right";
|
||||
document.getElementById('hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
|
||||
document.getElementById('close-hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
|
||||
}
|
||||
|
||||
function hideHamburger() {
|
||||
document.getElementById('header-container').className = "";
|
||||
document.getElementById('hamburger').className = "hidden absolute z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden";
|
||||
document.getElementById('hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
|
||||
document.getElementById('close-hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
|
||||
if (displayedMenu !== "") { hideMenu(displayedMenu); }
|
||||
}
|
||||
|
||||
window.onload = function(){
|
||||
let elements = document.getElementsByTagName("button");
|
||||
let buttons = [...elements]
|
||||
buttons.forEach((button) => {
|
||||
button.addEventListener( 'click', function() { handleClick(button) });
|
||||
})
|
||||
document.getElementById("mobile-learn-btn").addEventListener( 'click', toggleMenu);
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
{%- set section = get_section(path="header/_index.md") %}
|
||||
{% set header_items = section.content | safe | split(pat="<li>") %}
|
||||
|
||||
<header id="header-container">
|
||||
<div class="z-10 bg-white fixed w-screen">
|
||||
<div class="relative z-50 shadow">
|
||||
<div class="mx-auto flex z-50 shadow justify-between items-center pl-6 pr-2 md:pl-0 md:pr-0 lg:py-5 sm:px-8 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="{{section.extra.logoPath}}" alt="Ourworld Logo" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="-mr-2 -my-2 lg:hidden">
|
||||
<button id="hamburger-btn" type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2">
|
||||
<!-- Heroicon name: menu -->
|
||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
|
||||
</svg>
|
||||
</button>
|
||||
<button id="close-hamburger-btn" type="button" class="hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2">
|
||||
<!-- Heroicon name: x -->
|
||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<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 header_item in header_items %}
|
||||
{% if not loop.first %}
|
||||
{% set header_arr = header_item | split(pat="</li>") %}
|
||||
{% set header_label = header_arr[0] %}
|
||||
{% if '<a' in header_label %}
|
||||
{% set link_label = header_label | striptags %}
|
||||
{% set link_path = header_label | split(pat="%22") | safe%}
|
||||
<a href="{{link_path[1]}}" class="text-lg leading-6 font-medium text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
|
||||
{{link_label}}
|
||||
</a>
|
||||
{% else %}
|
||||
<div class="relative">
|
||||
{% set button_id = header_label ~ "-menu-btn" | slugify %}
|
||||
<button type="button" id="{{button_id}}" class="nav_btn font-medium text-gray-900 group inline-flex items-center space-x-2 text-lg leading-6 font-normal hover:text-blue-300 focus:outline-none transition ease-in-out duration-150">
|
||||
<span>{{ header_label }}</span>
|
||||
<div class="-rotate-90 transition-transform"><svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0z" fill="none"/><path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"/></svg></div>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</nav>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% for header_item in header_items %}
|
||||
{% if not loop.first %}
|
||||
{% set header_arr = header_item | split(pat="</li>") %}
|
||||
{% set header_label = header_arr[0] %}
|
||||
{% set header_menu = header_arr[1] %}
|
||||
{% set menu_id = header_label ~ "-menu" | slugify %}
|
||||
|
||||
<nav>
|
||||
<div id="{{menu_id}}" class="mt-16 sm:mt-0 md:mt-0 lg:mt-0 xl:mt-0 2xl:mt-0 z-30 absolute inset-x-0 transform shadow-lg lg:backdrop-blur xl:backdrop-blur transition duration-200 ease-in opacity-0 -translate-y-1 hidden">
|
||||
<div class="bg-white lg:bg-semi-white md:bg-semi-white xl:bg-semi-white">
|
||||
<div class="mx-8 lg:mx-20 xl:mx-20 px-6 py-4 sm:p-6 md:p-8 lg:p-12 xl:p-12">
|
||||
{{header_menu | safe }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
|
||||
<!--
|
||||
Mobile menu, show/hide based on mobile menu state.
|
||||
|
||||
Entering: "duration-200 ease-out"
|
||||
From: "opacity-0 scale-95"
|
||||
To: "opacity-100 scale-100"
|
||||
Leaving: "duration-100 ease-in"
|
||||
From: "opacity-100 scale-100"
|
||||
To: "opacity-0 scale-95"
|
||||
-->
|
||||
<div id="hamburger" class="hidden fixed mt-16 z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden">
|
||||
<div>
|
||||
<div class="shadow-xs h-screen bg-white divide-y-2 divide-gray-50">
|
||||
<div class="pb-6 sm:px-12 md:px-16 lg:px-20 space-y-6 sm:space-y-8 sm:pb-8 max-h-screen overflow-y-auto">
|
||||
|
||||
<nav class="flex flex-col justify-around pb-12">
|
||||
{% for header_item in header_items %}
|
||||
|
||||
{% if not loop.first %}
|
||||
{% set header_arr = header_item | split(pat="</li>") %}
|
||||
{% set header_label = header_arr[0] %}
|
||||
{% if '<a' in header_label %}
|
||||
{% set link_label = header_label | striptags %}
|
||||
{% set link_path = header_label | split(pat="%22") | safe%}
|
||||
<a href="{{link_path[1]}}" 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">
|
||||
{{link_label}}
|
||||
</a>
|
||||
{% else %}
|
||||
{% set button_id = header_label ~ "-mobile-menu-btn" | slugify %}
|
||||
<button type="button" id="{{button_id}}" class="flex flex px-8 py-3 items-start text-left text-gray-900 group inline-flex space-x-2 text-lg leading-6 font-normal hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
||||
<span>{{ header_label }}</span>
|
||||
<div class="-rotate-90 transition-transform"><svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0z" fill="none"/><path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"/></svg></div>
|
||||
</button>
|
||||
{% set menu_id = header_label ~ "-mobile-menu" | slugify %}
|
||||
<div id="{{menu_id}}" class="z-50 leading-3 pl-12 pt-6 pb-4 inset-x-0 text-sm transform duration-200 ease-in opacity-0 -translate-y-1 hidden">
|
||||
{{ header_arr[1] | safe }}
|
||||
</div>
|
||||
|
||||
{% endif %}
|
||||
<hr/>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% if "footer/_index.md" in subsections_str %}
|
||||
{% set section = get_section(path="footer/_index.md")%}
|
||||
{% set logoPath = section.extra.logoPath %}
|
||||
<div class="mx-8 mt-8">
|
||||
<div class="space-y-8 lg:max-w-lg xl:max-w-lg lg:mr-8 lg:mb-8 xl:col-span-1">
|
||||
<img class="w-48 h-auto" src="{{logoPath}}" alt="Company name" />
|
||||
<p class="text-gray-500 text-base leading-6 ">
|
||||
{{section.description}}
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</header>
|
||||
@ -9,8 +9,38 @@ Parameters:
|
||||
- bgPath: if bgPath is passed, the row has a full width background
|
||||
-->
|
||||
|
||||
<<<<<<< HEAD
|
||||
{% set columns = body | safe | markdown | split(pat="|||") %}
|
||||
{% set row_class = "relative pt-12 flex flex-col sm:grid sm:grid-cols-2 sm:gap-10 md:flex md:flex-row md:py-4 lg:py-8"%}
|
||||
=======
|
||||
|
||||
<!-- This fixes link & img paths in local, prod, and wth prefix -->
|
||||
{% if page %}
|
||||
{% if "](" in body %}
|
||||
{% set body_arr = body | split(pat="](") %}
|
||||
{% set body = body_arr[0] %}
|
||||
{% for i in body_arr %}
|
||||
{% set prev_index = loop.index0 - 1 %}
|
||||
{% if not loop.first %}
|
||||
{% if "![" in body_arr[prev_index] %}
|
||||
{% set_global body = body ~ '](' ~ page.permalink ~ i %}
|
||||
{% else %}
|
||||
{% if i is not starting_with("http") %}
|
||||
{% set base_url = get_url(path="") %}
|
||||
{% set_global body = body ~ '](' ~ base_url ~ i %}
|
||||
{% else %}
|
||||
{% set_global body = body ~ '](' ~ i %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% 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 "%}
|
||||
>>>>>>> template/master
|
||||
|
||||
<!-- aligns columns depending on col number-->
|
||||
{% if 2 < columns | length %}
|
||||
@ -19,7 +49,40 @@ Parameters:
|
||||
{% set row_class = row_class ~ " lg:items-center" %}
|
||||
{% endif %}
|
||||
|
||||
<<<<<<< HEAD
|
||||
{% set col_class = "flex-1 mb-20 lg:mb-0 " %}
|
||||
=======
|
||||
{% set col_class = "flex-1 mb-4 md:mb-12 lg:mb-0 " %}
|
||||
{% set col_class = col_class ~ " lg:mx-8 " %}
|
||||
|
||||
|
||||
<!-- Margins -->
|
||||
|
||||
{% set margin_class = " mx-4 md:mx-16 lg:mx-24 " %}
|
||||
|
||||
{% if margin %}
|
||||
{% if "none" in margin %}
|
||||
{% 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 " %}
|
||||
{% elif "moderate" in margin %}
|
||||
{% set margin_class = " mx-8 sm:mx-16 md:mx-24 lg:mx-28 " %}
|
||||
{% elif "narrow" in margin %}
|
||||
{% set margin_class = " mx-12 sm:mx-20 md:mx-28 lg:mx-32 " %}
|
||||
{% elif "tight" in margin %}
|
||||
{% set margin_class = " mx-20 sm:mx-32 md:mx-60 lg:mx-80 xl:mx-96 " %}
|
||||
{% 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 " %}
|
||||
{% 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 " %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% set row_class = row_class ~ margin_class %}
|
||||
>>>>>>> template/master
|
||||
|
||||
{% if style %}
|
||||
|
||||
@ -34,22 +97,34 @@ Parameters:
|
||||
{% 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 %}
|
||||
<<<<<<< HEAD
|
||||
{% set col_class = col_class ~ " first:px-20 lg:max-w-[50%] " %}
|
||||
=======
|
||||
{% set col_class = col_class ~ " first:px-20 lg:max-w-[50%] -mr-8 md:-mr-12 lg:-mr-16 xl:-mr-20 " %}
|
||||
>>>>>>> template/master
|
||||
{% 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 %}
|
||||
<<<<<<< HEAD
|
||||
{% set row_class = row_class ~ " mx-8" %}
|
||||
{% set col_class = col_class ~ " lg:mx-8 " %}
|
||||
=======
|
||||
{% set row_class = row_class ~ " w-screen " %}
|
||||
>>>>>>> template/master
|
||||
{% 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 %}
|
||||
<<<<<<< HEAD
|
||||
{% set row_class = row_class ~ " lg:mx-20 " %}
|
||||
=======
|
||||
{% set row_class = row_class ~ " " %}
|
||||
>>>>>>> template/master
|
||||
{% endif %}
|
||||
|
||||
<!-- makes row full screen width, strips margins -->
|
||||
@ -58,7 +133,11 @@ Parameters:
|
||||
{% elif "tight" in style %}
|
||||
{% set row_class = row_class ~ " lg:max-w-sm " %}
|
||||
{% elif "moderate" in style %}
|
||||
<<<<<<< HEAD
|
||||
{% set row_class = row_class ~ " lg:mx-20 " %}
|
||||
=======
|
||||
{% set row_class = row_class ~ " mx-20 " %}
|
||||
>>>>>>> template/master
|
||||
{% endif %}
|
||||
|
||||
{% if "invert-color" in style %}
|
||||
@ -66,9 +145,14 @@ Parameters:
|
||||
{% set row_class = row_class ~ " text-white lg:text-white " %}
|
||||
|
||||
{% endif %}
|
||||
<<<<<<< HEAD
|
||||
|
||||
{% else %}
|
||||
{% set row_class = row_class ~ " mx-12 " %}
|
||||
=======
|
||||
{% else %}
|
||||
{% set row_class = row_class ~ " " %}
|
||||
>>>>>>> template/master
|
||||
{% endif %}
|
||||
|
||||
{% set anchor_link = ""%}
|
||||
@ -81,8 +165,15 @@ Parameters:
|
||||
{% set styles = "" %}
|
||||
{% set div_class = " " %}
|
||||
{% if bgPath %}
|
||||
<<<<<<< HEAD
|
||||
{% set styles = "background: url('" ~ bgPath ~ "'); background-size: cover; background-position: center;" %}
|
||||
{% if "#desktop" in bgPath %}
|
||||
=======
|
||||
{% set background_url = page.permalink ~ bgPath %}
|
||||
{% set styles = "background: url('" ~ background_url ~ "'); background-size: cover; background-position: center;" %}
|
||||
{% if "#desktop" in bgPath %}
|
||||
{% set bgStyle = false %}
|
||||
>>>>>>> template/master
|
||||
{% set div_class = " !bg-[length:0px_0px] !bg-no-repeat lg:!bg-cover " %}
|
||||
{% set row_class = row_class | replace(from='text-white', to='text-black') %}
|
||||
{% if "invert-color" in style %}
|
||||
@ -95,6 +186,11 @@ Parameters:
|
||||
{% if bgStyle %}
|
||||
{% if "full" in bgStyle %}
|
||||
{% set styles = styles ~ "height: -webkit-fill-available; height: 100vh;" %}
|
||||
<<<<<<< HEAD
|
||||
=======
|
||||
{% elif "hero" in bgStyle %}
|
||||
{% set div_class = div_class ~ " -mt-24 pt-24 " %}
|
||||
>>>>>>> template/master
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% if bgColor %}
|
||||
@ -102,9 +198,19 @@ Parameters:
|
||||
{% set row_class = row_class ~ " py-0 " %}
|
||||
{% endif %}
|
||||
|
||||
<<<<<<< HEAD
|
||||
|
||||
<div id="{{anchor_link}}" class="{{'w-screen justify-center flex ' ~ div_class}}" style="{{styles}}">
|
||||
<div class="{{row_class}}" style="width: -webkit-fill-available">
|
||||
=======
|
||||
<!-- 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">
|
||||
|
||||
>>>>>>> template/master
|
||||
{% for column in columns%}
|
||||
|
||||
<!-- Hides empty columns if displayed vertically in small screen -->
|
||||
|
||||
@ -1 +1,12 @@
|
||||
<<<<<<< HEAD
|
||||
<div class="h-20 lg:h-52"></div>
|
||||
=======
|
||||
|
||||
{% set height = 52 %}
|
||||
{% if size %}
|
||||
{% if size == "small" %}
|
||||
{% set height = 28 %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
<div class="h-20 lg:h-{{height}}"></div>
|
||||
>>>>>>> template/master
|
||||
|
||||
Loading…
Reference in New Issue
Block a user