fixes on updated template
This commit is contained in:
timurgordon
commit
90281b6545
8
.github/workflows/tf_update.yml
vendored
8
.github/workflows/tf_update.yml
vendored
@ -1,9 +1,9 @@
|
|||||||
name: ourverse.tf
|
name: ourverse.tf
|
||||||
on:
|
on:
|
||||||
push:
|
push:
|
||||||
branch: [ development ]
|
branch: [development]
|
||||||
|
|
||||||
jobs:
|
jobs:
|
||||||
job_one:
|
job_one:
|
||||||
name: Deploy
|
name: Deploy
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
|
|||||||
9
.gitignore
vendored
9
.gitignore
vendored
@ -1,10 +1,3 @@
|
|||||||
examples/builder
|
|
||||||
examples/docker
|
|
||||||
examples/publisher
|
|
||||||
examples/texttools
|
|
||||||
examples/gittools
|
|
||||||
examples/tmux
|
|
||||||
examples/vredis2
|
|
||||||
*dSYM/
|
*dSYM/
|
||||||
publisher/publish
|
publisher/publish
|
||||||
install_publisher
|
install_publisher
|
||||||
@ -20,7 +13,6 @@ src/.temp
|
|||||||
content/news
|
content/news
|
||||||
content/person
|
content/person
|
||||||
content/project
|
content/project
|
||||||
node_modules
|
|
||||||
!.env.example
|
!.env.example
|
||||||
.env
|
.env
|
||||||
.env.*
|
.env.*
|
||||||
@ -33,3 +25,4 @@ run*
|
|||||||
install*
|
install*
|
||||||
public
|
public
|
||||||
static/css
|
static/css
|
||||||
|
tailwindcss
|
||||||
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
|
||||||
@ -6,184 +6,4 @@ updated: 2021-02-20T14:40:00-06:00
|
|||||||
draft: false
|
draft: false
|
||||||
extra:
|
extra:
|
||||||
author:
|
author:
|
||||||
imgPath: blog/realizing_the_promise/
|
|
||||||
---
|
---
|
||||||
|
|
||||||
<!-- section 1 (header) -->
|
|
||||||
|
|
||||||
{% row(style="center lean-right") %}
|
|
||||||
|
|
||||||
### EXPERIENCE
|
|
||||||
|
|
||||||
## ABUNDANCE
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
A better world is one where we all have access to endless information and oppurtunities. OurVerse exists to achieve that dream.
|
|
||||||
|
|
||||||
<button>[Explore]("")</button>
|
|
||||||
|
|
||||||
|||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{% end %}
|
|
||||||
|
|
||||||
{{ space() }}
|
|
||||||
|
|
||||||
{% row(style="center narrow") %}
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### THE END OF
|
|
||||||
|
|
||||||
## SCARCITY.
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
Learn whatever your heart desires. Access any oppurtunity to earn. Enter any shop. Travel everywhere. In OurVerse, you are limited by only your own imagination.
|
|
||||||
|
|
||||||
{% end %}
|
|
||||||
|
|
||||||
{{ space() }}
|
|
||||||
|
|
||||||
{% row(style="center moderate") %}
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
#### ENDLESS KNOWLEDGE AND EDUCATION
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
Learn whatever your heart desires. Access any oppurtunity to earn. Enter any shop. Travel everywhere. In OurVerse, you are limited by only your own imagination.
|
|
||||||
|
|
||||||
|||
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
#### A BETTER EARNING MODEL
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
Learn whatever your heart desires. Access any oppurtunity to earn. Enter any shop. Travel everywhere. In OurVerse, you are limited by only your own imagination.
|
|
||||||
|
|
||||||
{% end %}
|
|
||||||
|
|
||||||
{% row(style="center moderate") %}
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
#### EVERY PRODUCT IS ACCESSIBLE
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
Learn whatever your heart desires. Access any oppurtunity to earn. Enter any shop. Travel everywhere. In OurVerse, you are limited by only your own imagination.
|
|
||||||
|
|
||||||
|||
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
#### THE WORLD IS YOUR OYSTER
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
Learn whatever your heart desires. Access any oppurtunity to earn. Enter any shop. Travel everywhere. In OurVerse, you are limited by only your own imagination.
|
|
||||||
|
|
||||||
{% end %}
|
|
||||||
|
|
||||||
{{ space() }}
|
|
||||||
|
|
||||||
{% row(style="center lean-left" bgColor="#c4ffeb") %}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|||
|
|
||||||
|
|
||||||
# WORK.
|
|
||||||
|
|
||||||
# PLAY.
|
|
||||||
|
|
||||||
# **LIVE.**
|
|
||||||
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
**Anything** you can do in the real world you can do in OurVerse. Only your own imagination limits you. Explore or start building experiences and start earning now!
|
|
||||||
|
|
||||||
<button>[USE CASES](/use-cases)</button>
|
|
||||||
|
|
||||||
{% end %}
|
|
||||||
|
|
||||||
{% row(style="center narrow") %}
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
### EVERY IDENTITY IS
|
|
||||||
|
|
||||||
## PROTECTED.
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
OurVerse users are protected through ThreeFold's digital twin. This allows everyone to communicate, network and collaborate without worrying about data breaches and identity theft.
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{% end %}
|
|
||||||
|
|
||||||
{{ space() }}
|
|
||||||
|
|
||||||
{% row(style="center lean-left" bgColor="#c6f8ff") %}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|||
|
|
||||||
|
|
||||||
#### BUILT BY
|
|
||||||
|
|
||||||
### TOGETHERNESS.
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
An OurVerse is created by utilizing the world's largest decentralized and peer-to-peer of storage and compute: The ThreeFold Grid.
|
|
||||||
|
|
||||||
<br>
|
|
||||||
<br>
|
|
||||||
|
|
||||||
This provides every OurVerse community with unparalleled security to each user and assures unprecedented sovereignty.
|
|
||||||
|
|
||||||
<button>[DISCOVER THE TECH]("")</button>
|
|
||||||
|
|
||||||
{% end %}
|
|
||||||
|
|
||||||
{% row(style="center narrow invert-color" bgColor="#4dc48f") %}
|
|
||||||
|
|
||||||
## WANNA GET **INVOLVED?**
|
|
||||||
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
Interested in partnering up? Or just wanna say hi?
|
|
||||||
|
|
||||||
Drop us a message!
|
|
||||||
|
|
||||||
<button>[Email](mailto:info@ourverse.tf)</button>
|
|
||||||
|
|
||||||
{% end %}
|
|
||||||
|
|||||||
189
content/home/index.md
Normal file
189
content/home/index.md
Normal file
@ -0,0 +1,189 @@
|
|||||||
|
---
|
||||||
|
title: "OurVerse"
|
||||||
|
description: "The only truly decentralized metaverse on the planet awaits you."
|
||||||
|
date: 2018-09-14T21:00:00-05:00
|
||||||
|
updated: 2021-02-20T14:40:00-06:00
|
||||||
|
draft: false
|
||||||
|
extra:
|
||||||
|
author:
|
||||||
|
imgPath: blog/realizing_the_promise/
|
||||||
|
---
|
||||||
|
|
||||||
|
<!-- section 1 (header) -->
|
||||||
|
|
||||||
|
{% row(style="center" margin="lean-right") %}
|
||||||
|
|
||||||
|
### EXPERIENCE
|
||||||
|
|
||||||
|
## ABUNDANCE
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
A better world is one where we all have access to endless information and oppurtunities. OurVerse exists to achieve that dream.
|
||||||
|
|
||||||
|
<button>[Explore]("")</button>
|
||||||
|
|
||||||
|
|||
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
{% end %}
|
||||||
|
|
||||||
|
{{ space() }}
|
||||||
|
|
||||||
|
{% row(style="center narrow") %}
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
### THE END OF
|
||||||
|
|
||||||
|
## SCARCITY.
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
Learn whatever your heart desires. Access any oppurtunity to earn. Enter any shop. Travel everywhere. In OurVerse, you are limited by only your own imagination.
|
||||||
|
|
||||||
|
{% end %}
|
||||||
|
|
||||||
|
{{ space() }}
|
||||||
|
|
||||||
|
{% row(style="center" margin="moderate") %}
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
#### ENDLESS KNOWLEDGE AND EDUCATION
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
Learn whatever your heart desires. Access any oppurtunity to earn. Enter any shop. Travel everywhere. In OurVerse, you are limited by only your own imagination.
|
||||||
|
|
||||||
|
|||
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
#### A BETTER EARNING MODEL
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
Learn whatever your heart desires. Access any oppurtunity to earn. Enter any shop. Travel everywhere. In OurVerse, you are limited by only your own imagination.
|
||||||
|
|
||||||
|
{% end %}
|
||||||
|
|
||||||
|
{% row(style="center moderate") %}
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
#### EVERY PRODUCT IS ACCESSIBLE
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
Learn whatever your heart desires. Access any oppurtunity to earn. Enter any shop. Travel everywhere. In OurVerse, you are limited by only your own imagination.
|
||||||
|
|
||||||
|
|||
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
#### THE WORLD IS YOUR OYSTER
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
Learn whatever your heart desires. Access any oppurtunity to earn. Enter any shop. Travel everywhere. In OurVerse, you are limited by only your own imagination.
|
||||||
|
|
||||||
|
{% end %}
|
||||||
|
|
||||||
|
{{ space() }}
|
||||||
|
|
||||||
|
{% row(style="center lean-left" bgColor="#c4ffeb") %}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||
|
||||||
|
|
||||||
|
# WORK.
|
||||||
|
|
||||||
|
# PLAY.
|
||||||
|
|
||||||
|
# **LIVE.**
|
||||||
|
|
||||||
|
<br/>
|
||||||
|
|
||||||
|
**Anything** you can do in the real world you can do in OurVerse. Only your own imagination limits you. Explore or start building experiences and start earning now!
|
||||||
|
|
||||||
|
<button>[USE CASES](/use-cases)</button>
|
||||||
|
|
||||||
|
{% end %}
|
||||||
|
|
||||||
|
{% row(style="center narrow") %}
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
### EVERY IDENTITY IS
|
||||||
|
|
||||||
|
## PROTECTED.
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
OurVerse users are protected through ThreeFold's digital twin. This allows everyone to communicate, network and collaborate without worrying about data breaches and identity theft.
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
{% end %}
|
||||||
|
|
||||||
|
{{ space() }}
|
||||||
|
|
||||||
|
{% row(style="center lean-left" bgColor="#c6f8ff") %}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||
|
||||||
|
|
||||||
|
#### BUILT BY
|
||||||
|
|
||||||
|
### TOGETHERNESS.
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
An OurVerse is created by utilizing the world's largest decentralized and peer-to-peer of storage and compute: The ThreeFold Grid.
|
||||||
|
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
|
||||||
|
This provides every OurVerse community with unparalleled security to each user and assures unprecedented sovereignty.
|
||||||
|
|
||||||
|
<button>[DISCOVER THE TECH]("")</button>
|
||||||
|
|
||||||
|
{% end %}
|
||||||
|
|
||||||
|
{% row(style="center invert-color" bgColor="#4dc48f" margin="narrow") %}
|
||||||
|
|
||||||
|
## WANNA GET **INVOLVED?**
|
||||||
|
|
||||||
|
<br/>
|
||||||
|
|
||||||
|
Interested in partnering up? Or just wanna say hi?
|
||||||
|
|
||||||
|
Drop us a message!
|
||||||
|
|
||||||
|
<button>[Email](mailto:info@ourverse.tf)</button>
|
||||||
|
|
||||||
|
{% end %}
|
||||||
@ -86,7 +86,7 @@ img[src*="#tft_img"] {
|
|||||||
@apply text-xl lg:text-3xl font-normal;
|
@apply text-xl lg:text-3xl font-normal;
|
||||||
}
|
}
|
||||||
h6 {
|
h6 {
|
||||||
@apply text-md not-italic font-normal my-1;
|
@apply text-base not-italic font-normal my-1;
|
||||||
}
|
}
|
||||||
p {
|
p {
|
||||||
@apply text-lg lg:text-2xl leading-tight;
|
@apply text-lg lg:text-2xl leading-tight;
|
||||||
|
|||||||
@ -1,58 +1,8 @@
|
|||||||
const colors = require('tailwindcss/colors')
|
/** @type {import('tailwindcss').Config} */
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
content: [
|
content: ['./templates/**/*.html'],
|
||||||
'./templates/**/*.html'
|
|
||||||
],
|
|
||||||
darkMode: false,
|
|
||||||
theme: {
|
theme: {
|
||||||
fontSize: {
|
extend: {},
|
||||||
'xs': '.75rem',
|
|
||||||
'sm': '.875rem',
|
|
||||||
'tiny': '.875rem',
|
|
||||||
'base': '1rem',
|
|
||||||
'md': '1.05rem',
|
|
||||||
'lg': '1.125rem',
|
|
||||||
'xl': '1.25rem',
|
|
||||||
'2xl': '1.5rem',
|
|
||||||
'3xl': '1.875rem',
|
|
||||||
'4xl': '2.25rem',
|
|
||||||
'5xl': '3rem',
|
|
||||||
'6xl': '4rem',
|
|
||||||
'7xl': '5rem',
|
|
||||||
'8xl': '5.75rem',
|
|
||||||
'9xl': '8rem'
|
|
||||||
},
|
},
|
||||||
colors: {
|
plugins: [],
|
||||||
transparent: 'transparent',
|
|
||||||
white: '#ffffff',
|
|
||||||
black: '#000000',
|
|
||||||
gray: colors.gray,
|
|
||||||
slate: colors.slate,
|
|
||||||
stone: colors.stone,
|
|
||||||
zinc: colors.zinc,
|
|
||||||
yellow: colors.yellow,
|
|
||||||
orange: colors.orange,
|
|
||||||
sky: colors.sky,
|
|
||||||
blue: {
|
|
||||||
'100': '#bbeeff',
|
|
||||||
'200': '#00aaff',
|
|
||||||
'300': '#0088ff',
|
|
||||||
'400': '#0033ff',
|
|
||||||
'500': '#0000ff',
|
|
||||||
'600': '#0000bb',
|
|
||||||
'700': '#0000aa',
|
|
||||||
'800': '#000088',
|
|
||||||
'900': '#000066',
|
|
||||||
},
|
|
||||||
|
|
||||||
},
|
|
||||||
extend: {
|
|
||||||
screens: {
|
|
||||||
'2xl': '1450px',
|
|
||||||
// => @media (min-width: 992px) { ... }
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
plugins: [], // if we add forms, do it here
|
|
||||||
}
|
}
|
||||||
|
|||||||
BIN
tailwindcss
BIN
tailwindcss
Binary file not shown.
@ -1,14 +1,13 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en" charset="utf-8">
|
<html lang="en" charset="utf-8">
|
||||||
|
|
||||||
{% include "partials/head.html" %}
|
{% include "partials/head.html" %}
|
||||||
|
|
||||||
{% include "partials/header.html" %}
|
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
{% include "partials/header.html" %}
|
||||||
<div id="content" class="p-8 pt-12 sm:p-12 md:p-16 lg:p-20">
|
<div id="content" class="mx-8 md:mx-12 lg:mx-16 xl:mx-20 pt-24">
|
||||||
{% block content %}{% endblock %}
|
{% block content %}{% endblock %}
|
||||||
</div>
|
</div>
|
||||||
|
{% include "partials/footer.html" %}
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@ -1,8 +1,9 @@
|
|||||||
{% extends "_default/base.html" %}
|
{% extends "_default/base.html" %}
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
|
||||||
<!-- Landing page template, has a banner and rows of page summaries -->
|
<!-- home page template, has a banner and rows of page summaries -->
|
||||||
<main>
|
<div>
|
||||||
{{section.content | safe}}
|
{% set page = get_page(path="home/index.md") %}
|
||||||
</main>
|
{{page.content | safe}}
|
||||||
|
</div>
|
||||||
{% endblock content %}
|
{% endblock content %}
|
||||||
@ -5,6 +5,12 @@
|
|||||||
<main>
|
<main>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
|
||||||
<script>mermaid.initialize({startOnLoad:true});</script>
|
<script>mermaid.initialize({startOnLoad:true});</script>
|
||||||
|
<div>
|
||||||
|
{% if page %}
|
||||||
{{page.content | safe}}
|
{{page.content | safe}}
|
||||||
|
{% else %}
|
||||||
|
{{section.content | safe}}
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
|
||||||
</main> {% endblock content %}
|
</main> {% endblock content %}
|
||||||
|
|||||||
@ -4,10 +4,13 @@
|
|||||||
<div class="relative lg:ml-8 my-8 w-full md:w-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>
|
<h3 class="text-base not-italic leading-6 text-gray-600">FEATURED POST</h3>
|
||||||
<a href={{featured.permalink}} class="">
|
<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-4 md:mb-10 ">
|
<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 }}
|
{{ featured.title }}
|
||||||
</h2>
|
</h2>
|
||||||
</a>
|
</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">
|
<h4 class="text-sm not-italic font-light leading-6 text-gray-600">
|
||||||
{{ featured.date | date(format="%B %e, %Y", timezone="America/Chicago")}} -
|
{{ featured.date | date(format="%B %e, %Y", timezone="America/Chicago")}} -
|
||||||
|
|||||||
@ -3,31 +3,19 @@
|
|||||||
Read the documentation to get started: https://tailwindui.com/documentation
|
Read the documentation to get started: https://tailwindui.com/documentation
|
||||||
-->
|
-->
|
||||||
|
|
||||||
{%- set section = get_section(path="footer/_index.md") %}
|
{%- set section = get_section(path="_index.md") %}
|
||||||
{%- set logoPath = section.extra.logoPath %}
|
|
||||||
|
|
||||||
<html>
|
{% set subsections_str = section.subsections | join(sep=" ") %}
|
||||||
<head /><body>
|
|
||||||
<div class="mt-12 border-t border-gray-200 pt-8"></div>
|
|
||||||
<footer class="bg-white">
|
|
||||||
<div class="max-w-screen-xl mx-auto py-12 px-4 sm:px-6 lg:py-16 lg:px-8">
|
|
||||||
<div class="xl:flex xl:gap-4">
|
|
||||||
<div class="space-y-8 lg:max-w-sm xl:max-w-sm lg:mr-8 lg:mb-8 xl:col-span-1">
|
|
||||||
<img class="w-20 h-auto sm:w-15" src="{{logoPath}}" alt="Company name" />
|
|
||||||
<p class="text-gray-500 text-base leading-6 ">
|
|
||||||
{{section.description}}
|
|
||||||
</p>
|
|
||||||
{% include "partials/socialLinks.html" %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mt-6 lg:mt-0 w-full px-8 sm:px-12 md:px-16 lg:px-20">
|
<footer class="bottom-0 mx-20">
|
||||||
|
{% if "footer/_index.md" in subsections_str %}
|
||||||
|
{%- set section = get_section(path="footer/_index.md") %}
|
||||||
{{ section.content | safe }}
|
{{ 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>
|
||||||
|
{% endif %}
|
||||||
</div>
|
</footer>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
||||||
@ -17,7 +17,7 @@
|
|||||||
{% endif %}
|
{% endif %}
|
||||||
{% endblock title %}
|
{% endblock title %}
|
||||||
|
|
||||||
<!-- Required meta tags -->
|
<!-- Required meta categories -->
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
|
||||||
|
|||||||
@ -84,16 +84,25 @@
|
|||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
{%- set section = get_section(path="header/_index.md") %}
|
|
||||||
{% set header_items = section.content | safe | split(pat="<li>") %}
|
|
||||||
|
|
||||||
<header id="header-container">
|
<!-- set variables used for header template -->
|
||||||
<div class="z-10 bg-white fixed w-screen">
|
{% 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="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 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>
|
<div>
|
||||||
<a href="/" class="flex">
|
<a href="/" class="flex">
|
||||||
<img class="w-32 h-auto sm:w-15" src="{{section.extra.logoPath}}" alt="Ourworld Logo" />
|
<img class="w-48 h-auto sm:w-15" src="{{logo_path}}" alt="FreeFlow Logo" />
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="-mr-2 -my-2 lg:hidden">
|
<div class="-mr-2 -my-2 lg:hidden">
|
||||||
@ -112,55 +121,43 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="hidden lg:flex-1 lg:flex lg:items-center lg:justify-end lg:space-x-12">
|
<div class="hidden lg:flex-1 lg:flex lg:items-center lg:justify-end lg:space-x-12">
|
||||||
<nav class="flex space-x-10">
|
<nav class="flex space-x-10">
|
||||||
|
{% for page in section.pages %}
|
||||||
{% for header_item in header_items %}
|
{% if page.relative_path == "home/index.md" %} {% continue %} {% endif %}
|
||||||
{% if not loop.first %}
|
<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">
|
||||||
{% set header_arr = header_item | split(pat="</li>") %}
|
{{page.title}}
|
||||||
{% 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>
|
</a>
|
||||||
{% else %}
|
|
||||||
<div class="relative">
|
<div class="relative">
|
||||||
{% set button_id = header_label ~ "-menu-btn" | slugify %}
|
</div>
|
||||||
<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">
|
{% endfor %}
|
||||||
<span>{{ header_label }}</span>
|
{% 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>
|
<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>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
{% endfor %}
|
||||||
{% endif %}
|
</nav>
|
||||||
{% endif %}
|
|
||||||
{% endfor %}
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% for header_item in header_items %}
|
{% for subsection in section.subsections %}
|
||||||
{% if not loop.first %}
|
{% if subsection == "footer/_index.md" %} {% continue %} {% endif %}
|
||||||
{% set header_arr = header_item | split(pat="</li>") %}
|
{% set submenu_id = subsection ~ "-menu" | slugify %}
|
||||||
{% set header_label = header_arr[0] %}
|
<nav>
|
||||||
{% set header_menu = header_arr[1] %}
|
<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">
|
||||||
{% 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="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">
|
<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 }}
|
{{subsection | safe }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
|
|
||||||
{% endif %}
|
{% endfor %}
|
||||||
{% endfor %}
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
@ -179,41 +176,39 @@
|
|||||||
<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">
|
<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">
|
<nav class="flex flex-col justify-around pb-12">
|
||||||
{% for header_item in header_items %}
|
{% for page in section.pages %}
|
||||||
|
{% if page.relative_path == "home/index.md" %} {% continue %} {% endif %}
|
||||||
{% if not loop.first %}
|
<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">
|
||||||
{% set header_arr = header_item | split(pat="</li>") %}
|
{{page.title}}
|
||||||
{% 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>
|
</a>
|
||||||
{% else %}
|
<hr/>
|
||||||
{% set button_id = header_label ~ "-mobile-menu-btn" | slugify %}
|
{% 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">
|
<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>
|
<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>
|
<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>
|
</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">
|
<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 }}
|
{{ subsection | safe }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{% endif %}
|
|
||||||
<hr/>
|
<hr/>
|
||||||
{% endif %}
|
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
{% if "footer/_index.md" in subsections_str %}
|
||||||
{% set section = get_section(path="footer/_index.md")%}
|
{% set section = get_section(path="footer/_index.md")%}
|
||||||
{%- set logoPath = section.extra.logoPath %}
|
|
||||||
<div class="mx-8 mt-8">
|
<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">
|
<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" />
|
<img class="w-48 h-auto" src="{{logo_path}}" alt="Company name" />
|
||||||
<p class="text-gray-500 text-base leading-6 ">
|
<p class="text-gray-500 text-base leading-6 ">
|
||||||
{{section.description}}
|
{{section.description}}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
{% endif %}
|
||||||
</nav>
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -223,4 +218,8 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
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>
|
||||||
@ -2,7 +2,7 @@
|
|||||||
<a href="{{page.permalink}}" class="text-lg font-medium cursor-pointer text-blue-400 py-4">
|
<a href="{{page.permalink}}" class="text-lg font-medium cursor-pointer text-blue-400 py-4">
|
||||||
{{page.title | safe}}
|
{{page.title | safe}}
|
||||||
</a>
|
</a>
|
||||||
{% include "partials/tags.html" %}
|
{% include "partials/categories.html" %}
|
||||||
<p>
|
<p>
|
||||||
{{page.description | safe}}
|
{{page.description | safe}}
|
||||||
</p>
|
</p>
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
<div class="flex mb-4">
|
<div class="flex mb-4">
|
||||||
{% for tag in page.taxonomies.tags %}
|
{% for tag in page.taxonomies.categories %}
|
||||||
<div class="bg-gray-200 rounded font-semibold text-xs w-auto px-2 py-1 mr-2">{{tag}}</div>
|
<div class="bg-gray-200 rounded font-semibold text-xs w-auto px-2 py-1 mr-2">{{tag}}</div>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
@ -16,7 +16,7 @@
|
|||||||
{{ page.title }}
|
{{ page.title }}
|
||||||
</h1>
|
</h1>
|
||||||
<p class="my-4">{{page.description}}</p>
|
<p class="my-4">{{page.description}}</p>
|
||||||
{% include "partials/tags.html" %}
|
{% include "partials/categories.html" %}
|
||||||
</div>
|
</div>
|
||||||
{{ page.content | safe }}
|
{{ page.content | safe }}
|
||||||
</article>
|
</article>
|
||||||
|
|||||||
@ -9,8 +9,33 @@ Parameters:
|
|||||||
- bgPath: if bgPath is passed, the row has a full width background
|
- bgPath: if bgPath is passed, the row has a full width background
|
||||||
-->
|
-->
|
||||||
|
|
||||||
{% 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 "%}
|
||||||
|
|
||||||
<!-- aligns columns depending on col number-->
|
<!-- aligns columns depending on col number-->
|
||||||
{% if 2 < columns | length %}
|
{% if 2 < columns | length %}
|
||||||
@ -19,7 +44,36 @@ Parameters:
|
|||||||
{% set row_class = row_class ~ " lg:items-center" %}
|
{% set row_class = row_class ~ " lg:items-center" %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
{% 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 %}
|
||||||
|
|
||||||
{% if style %}
|
{% if style %}
|
||||||
|
|
||||||
@ -31,24 +85,24 @@ Parameters:
|
|||||||
<!-- makes row full screen width, strips margins -->
|
<!-- makes row full screen width, strips margins -->
|
||||||
{% if "lean" in style %}
|
{% if "lean" in style %}
|
||||||
{% if "lean-left" in style %}
|
{% if "lean-left" in style %}
|
||||||
{% set col_class = col_class ~ "flex-1 lg:m-0 " %}
|
{% set col_class = col_class ~ " last:px-20 lg:max-w-[50%] " %}
|
||||||
{% set row_class = row_class ~ " lg:mr-20 " %}
|
{% set row_class = row_class ~ " sm:gap-0 " %}
|
||||||
{% elif "lean-right" in style %}
|
{% elif "lean-right" in style %}
|
||||||
{% set col_class = col_class ~ "flex-1 lg:m-0 " %}
|
{% 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 ~ " lg:ml-20 " %}
|
{% set row_class = row_class ~ " sm:gap-0 " %}
|
||||||
{% else %}
|
{% else %}
|
||||||
{% set col_class = col_class ~ "flex-1 lg:m-0 " %}
|
{% set row_class = row_class ~ " md:py-0 " %}
|
||||||
|
{% set col_class = col_class ~ " lg:m-0" %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% else %}
|
{% else %}
|
||||||
{% set row_class = row_class ~ " mx-8 " %}
|
{% set row_class = row_class ~ " w-screen " %}
|
||||||
{% set col_class = col_class ~ " lg:mx-8 " %}
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<!-- makes row semi-full screen width, strips margins -->
|
<!-- makes row semi-full screen width, strips margins -->
|
||||||
{% if "between" in style %}
|
{% if "between" in style %}
|
||||||
{% set row_class = row_class ~ " lg:max-w-6xl " %}
|
{% set row_class = row_class ~ " lg:max-w-6xl " %}
|
||||||
{% elif "moderate" in style %}
|
{% elif "moderate" in style %}
|
||||||
{% set row_class = row_class ~ " lg:m-20 " %}
|
{% set row_class = row_class ~ " " %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<!-- makes row full screen width, strips margins -->
|
<!-- makes row full screen width, strips margins -->
|
||||||
@ -57,15 +111,16 @@ Parameters:
|
|||||||
{% elif "tight" in style %}
|
{% elif "tight" in style %}
|
||||||
{% set row_class = row_class ~ " lg:max-w-sm " %}
|
{% set row_class = row_class ~ " lg:max-w-sm " %}
|
||||||
{% elif "moderate" in style %}
|
{% elif "moderate" in style %}
|
||||||
{% set row_class = row_class ~ " lg:m-20 " %}
|
{% set row_class = row_class ~ " mx-20 " %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
{% if "invert-color" in style %}
|
{% if "invert-color" in style %}
|
||||||
{% set row_class = row_class ~ " text-white " %}
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
|
{% set row_class = row_class ~ " text-white lg:text-white " %}
|
||||||
|
|
||||||
|
{% endif %}
|
||||||
{% else %}
|
{% else %}
|
||||||
{% set row_class = row_class ~ " mx-12 " %}
|
{% set row_class = row_class ~ " " %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
{% set anchor_link = ""%}
|
{% set anchor_link = ""%}
|
||||||
@ -76,25 +131,51 @@ Parameters:
|
|||||||
|
|
||||||
<!-- makes row full screen width and adds background img -->
|
<!-- makes row full screen width and adds background img -->
|
||||||
{% set styles = "" %}
|
{% set styles = "" %}
|
||||||
|
{% set div_class = " " %}
|
||||||
{% if bgPath %}
|
{% if bgPath %}
|
||||||
{% set styles = "background: url('" ~ bgPath ~ "'); background-size: cover" %}
|
{% 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 %}
|
||||||
|
{% 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 %}
|
||||||
|
{% if "#desktop" in bgPath %}
|
||||||
|
{% set row_class = row_class ~ " lg:text-white " %}
|
||||||
|
{% endif %}
|
||||||
|
{% endif %}
|
||||||
|
{% endif %}
|
||||||
|
{% endif %}
|
||||||
|
{% if bgStyle %}
|
||||||
|
{% 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 " %}
|
||||||
|
{% endif %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if bgColor %}
|
{% if bgColor %}
|
||||||
{% set styles = "background-color: " ~ bgColor ~ "; background-size: cover" %}
|
{% set styles = "background-color: " ~ bgColor ~ "; background-size: cover" %}
|
||||||
|
{% set row_class = row_class ~ " py-0 " %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<div id="{{anchor_link}}" class="w-screen -mx-8 sm:-mx-12 md:-mx-16 lg:-mx-20 justify-center flex" style="{{styles}}">
|
<!-- Cancels page margins so that rows can have separate margins -->
|
||||||
<div class="{{row_class}}">
|
{% 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">
|
||||||
|
|
||||||
{% for column in columns%}
|
{% for column in columns%}
|
||||||
|
|
||||||
<!-- Hides empty columns if displayed vertically in small screen -->
|
<!-- Hides empty columns if displayed vertically in small screen -->
|
||||||
{% if column | as_str | length < 10 %}
|
{% if column | as_str | length < 10 %}
|
||||||
<div class="hidden md:block flex-1 md:mb-0 md:mx-8 sm:flex-1">
|
<div class="hidden md:block flex-1 md:mb-0 md:mx-8 sm:flex-1 ">
|
||||||
{{ column | safe }}
|
{{ column | safe }}
|
||||||
</div>
|
</div>
|
||||||
{% else %}
|
{% else %}
|
||||||
<div class="{{col_class}}">
|
<div class="{{col_class}}">
|
||||||
<!-- handles mermaid markdown content display -->
|
<!-- handles mermaid markdown content display -->
|
||||||
|
|
||||||
{% if "{% mermaid() %}" in column %}
|
{% if "{% mermaid() %}" in column %}
|
||||||
{% set mermaid_section = column | safe | markdown | split(pat="{% mermaid() %}") %}
|
{% set mermaid_section = column | safe | markdown | split(pat="{% mermaid() %}") %}
|
||||||
{% set mermaid_content = mermaid_section[1] | striptags | replace(from="–", to="--")%}
|
{% set mermaid_content = mermaid_section[1] | striptags | replace(from="–", to="--")%}
|
||||||
|
|||||||
@ -1 +1,8 @@
|
|||||||
<div class="h-20 lg:h-60"></div>
|
|
||||||
|
{% set height = 52 %}
|
||||||
|
{% if size %}
|
||||||
|
{% if size == "small" %}
|
||||||
|
{% set height = 28 %}
|
||||||
|
{% endif %}
|
||||||
|
{% endif %}
|
||||||
|
<div class="h-20 lg:h-{{height}}"></div>
|
||||||
Loading…
Reference in New Issue
Block a user