This commit is contained in:
Ehab Hassan 2022-11-15 16:43:55 +02:00
parent bcbdbb38c1
commit 14eb9f2aa8
18 changed files with 73 additions and 37 deletions

View File

@ -9,7 +9,7 @@ A website created using Zola, a static site generator.
## Getting Started
This repository is meant to use as a template for static sites.
This repository is template to build a new Zola website.
To use this repository as a template, simply:

View File

@ -7,9 +7,12 @@ draft: false
weight: 1
---
<!-- section 1 (header) -->
{% row(margin="header") %}
{% row(margin="header" padding="both") %}
# TITLE {#text-8xl}

View File

@ -7,9 +7,11 @@ draft: false
weight: 2
---
<br>
<!-- section 1 (co-found) -->
{% row(style="center" margin="narrow" padding="both") %}
{% row(style="center" margin="header" padding="both") %}
# TITLE {#text-8xl}

View File

@ -7,9 +7,11 @@ draft: false
weight: 2
---
<br>
<!-- section 1 (co-found) -->
{% row(style="center" margin="narrow" padding="both") %}
{% row(style="center" margin="header" padding="both") %}
# TITLE {#text-8xl}

View File

@ -179,12 +179,13 @@ header .customize {
}
footer .customize {
width: 100vw;
/* width: 100vw; */
background-color: #d7d7d7;
display: flex;
flex-direction: column;
align-items: center;
padding: 40px;
padding-top: 40px;
padding-bottom: 40px;
}
footer .customize img {

File diff suppressed because one or more lines are too long

View File

@ -36,7 +36,7 @@
<!-- **** CONCLUSION, favicons **** -->
<!-- CSS/SCSS -->
<link rel="stylesheet" href="https://examplezola.tf/css/index.css?h=241c4886080bf8daf3ce48d39d27a62e1dd2217a3943e80ffa0e9ea80bd73d8b" /> <style>@-moz-document url-prefix() {.lazy:-moz-loading {visibility:hidden;}}.ieOnly {display: none;}@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {.ieOnly {display: block;}}</style>
<link rel="stylesheet" href="https://examplezola.tf/css/index.css?h=8ea8a615d5a5a9339423096c45329cf61cd2193f52db4447f8ae0248efacaed8" /> <style>@-moz-document url-prefix() {.lazy:-moz-loading {visibility:hidden;}}.ieOnly {display: none;}@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {.ieOnly {display: block;}}</style>
</head>
@ -364,9 +364,9 @@ Parameters:
<!-- handles mermaid markdown content display -->
<h1 id="title">TITLE</h1>
<h1 id="text-8xl">TITLE</h1>
<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.<br> Quas, aliquid ab blanditiis omnis odio repellat?</p>
<p><button><a href="https://examplezola.tf/">KNOW MORE</a></button></p>
<p><button><a href="https://examplezola.tf/">BUTTON</a></button></p>
</div>
@ -517,7 +517,7 @@ Parameters:
<div id="" class="relative justify-center flex overflow-hidden " style="">
<div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-start py-2 md:py-4 lg:pb-28 mx-12 sm:mx-20 md:mx-28 lg:mx-40 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available">
<div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-start py-2 md:py-4 lg:py-28 mx-12 sm:mx-20 md:mx-28 lg:mx-40 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available">
@ -568,7 +568,9 @@ Parameters:
</div>
</div><!-- section 3 -->
</div><br>
<br>
<!-- section 3 -->
<!-- row shortcode
Shortcode used in markdown for the creation of mobile compatible vertical rows
Divides markdown into columns by splitting content using column identifier "|||"
@ -692,7 +694,7 @@ Parameters:
<div id="" class="relative justify-center flex overflow-hidden " style="">
<div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-center py-0 mx-12 sm:mx-20 md:mx-28 lg:mx-40 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available">
<div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-center py-2 md:py-4 lg:py-28 mx-12 sm:mx-20 md:mx-28 lg:mx-40 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available">
@ -1175,7 +1177,7 @@ Parameters:
<div id="" class="relative justify-center flex overflow-hidden " style="">
<div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-center py-0 mx-12 sm:mx-20 md:mx-28 lg:mx-40 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available">
<div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-center py-2 md:py-4 lg:py-28 mx-12 sm:mx-20 md:mx-28 lg:mx-40 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available">
@ -1472,10 +1474,10 @@ Parameters:
<footer class="bottom-0 mx-20">
<footer class="bottom-0">
<div class="customize -mx-20">
<div class="customize">
<p class="text-center">ALL RIGHTS RESERVED 2022</p>
</div>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.1 KiB

View File

@ -36,7 +36,7 @@
<!-- **** CONCLUSION, favicons **** -->
<!-- CSS/SCSS -->
<link rel="stylesheet" href="https://examplezola.tf/css/index.css?h=241c4886080bf8daf3ce48d39d27a62e1dd2217a3943e80ffa0e9ea80bd73d8b" /> <style>@-moz-document url-prefix() {.lazy:-moz-loading {visibility:hidden;}}.ieOnly {display: none;}@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {.ieOnly {display: block;}}</style>
<link rel="stylesheet" href="https://examplezola.tf/css/index.css?h=8ea8a615d5a5a9339423096c45329cf61cd2193f52db4447f8ae0248efacaed8" /> <style>@-moz-document url-prefix() {.lazy:-moz-loading {visibility:hidden;}}.ieOnly {display: none;}@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {.ieOnly {display: block;}}</style>
</head>
@ -362,9 +362,9 @@ Parameters:
<!-- handles mermaid markdown content display -->
<h1 id="title">TITLE</h1>
<h1 id="text-8xl">TITLE</h1>
<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.<br> Quas, aliquid ab blanditiis omnis odio repellat?</p>
<p><button><a href="https://examplezola.tf/">KNOW MORE</a></button></p>
<p><button><a href="https://examplezola.tf/">BUTTON</a></button></p>
</div>
@ -515,7 +515,7 @@ Parameters:
<div id="" class="relative justify-center flex overflow-hidden " style="">
<div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-start py-2 md:py-4 lg:pb-28 mx-12 sm:mx-20 md:mx-28 lg:mx-40 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available">
<div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-start py-2 md:py-4 lg:py-28 mx-12 sm:mx-20 md:mx-28 lg:mx-40 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available">
@ -566,7 +566,9 @@ Parameters:
</div>
</div><!-- section 3 -->
</div><br>
<br>
<!-- section 3 -->
<!-- row shortcode
Shortcode used in markdown for the creation of mobile compatible vertical rows
Divides markdown into columns by splitting content using column identifier "|||"
@ -690,7 +692,7 @@ Parameters:
<div id="" class="relative justify-center flex overflow-hidden " style="">
<div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-center py-0 mx-12 sm:mx-20 md:mx-28 lg:mx-40 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available">
<div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-center py-2 md:py-4 lg:py-28 mx-12 sm:mx-20 md:mx-28 lg:mx-40 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available">
@ -1173,7 +1175,7 @@ Parameters:
<div id="" class="relative justify-center flex overflow-hidden " style="">
<div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-center py-0 mx-12 sm:mx-20 md:mx-28 lg:mx-40 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available">
<div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-center py-2 md:py-4 lg:py-28 mx-12 sm:mx-20 md:mx-28 lg:mx-40 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available">
@ -1468,10 +1470,10 @@ Parameters:
<footer class="bottom-0 mx-20">
<footer class="bottom-0">
<div class="customize -mx-20">
<div class="customize">
<p class="text-center">ALL RIGHTS RESERVED 2022</p>
</div>

View File

@ -36,7 +36,7 @@
<!-- **** CONCLUSION, favicons **** -->
<!-- CSS/SCSS -->
<link rel="stylesheet" href="https://examplezola.tf/css/index.css?h=241c4886080bf8daf3ce48d39d27a62e1dd2217a3943e80ffa0e9ea80bd73d8b" /> <style>@-moz-document url-prefix() {.lazy:-moz-loading {visibility:hidden;}}.ieOnly {display: none;}@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {.ieOnly {display: block;}}</style>
<link rel="stylesheet" href="https://examplezola.tf/css/index.css?h=8ea8a615d5a5a9339423096c45329cf61cd2193f52db4447f8ae0248efacaed8" /> <style>@-moz-document url-prefix() {.lazy:-moz-loading {visibility:hidden;}}.ieOnly {display: none;}@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {.ieOnly {display: block;}}</style>
</head>
@ -394,10 +394,10 @@ Parameters:
<footer class="bottom-0 mx-20">
<footer class="bottom-0">
<div class="customize -mx-20">
<div class="customize">
<p class="text-center">ALL RIGHTS RESERVED 2022</p>
</div>

View File

@ -36,7 +36,7 @@
<!-- **** CONCLUSION, favicons **** -->
<!-- CSS/SCSS -->
<link rel="stylesheet" href="https://examplezola.tf/css/index.css?h=241c4886080bf8daf3ce48d39d27a62e1dd2217a3943e80ffa0e9ea80bd73d8b" /> <style>@-moz-document url-prefix() {.lazy:-moz-loading {visibility:hidden;}}.ieOnly {display: none;}@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {.ieOnly {display: block;}}</style>
<link rel="stylesheet" href="https://examplezola.tf/css/index.css?h=8ea8a615d5a5a9339423096c45329cf61cd2193f52db4447f8ae0248efacaed8" /> <style>@-moz-document url-prefix() {.lazy:-moz-loading {visibility:hidden;}}.ieOnly {display: none;}@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {.ieOnly {display: block;}}</style>
</head>
@ -273,6 +273,16 @@ Parameters:
@ -374,6 +384,20 @@ Parameters:
<h1 id="text-8xl">TITLE</h1>
<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</p>
<p><button><a href="https://examplezola.tf/">BUTTON</a></button></p>
</div>
<!-- Hides empty columns if displayed vertically in small screen -->
<div class="flex-1 mb-4 md:mb-12 lg:mb-0 lg:mx-2 xl:mx-4 flex-1 ">
<!-- handles mermaid markdown content display -->
<p><img src="https://examplezola.tf/page3/placeholder.jpg#medium#mx-auto" alt="Image" /></p>
@ -394,10 +418,10 @@ Parameters:
<footer class="bottom-0 mx-20">
<footer class="bottom-0">
<div class="customize -mx-20">
<div class="customize">
<p class="text-center">ALL RIGHTS RESERVED 2022</p>
</div>

File diff suppressed because one or more lines are too long

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.1 KiB

View File

@ -7,13 +7,13 @@
{% set subsections_str = section.subsections | join(sep=" ") %}
<footer class="bottom-0 mx-20">
<footer class="bottom-0">
{% 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'}}">
<div class="{{ footer_class }}">
{# <img src="{{get_url(path='images/')}}" class="w-60" alt=""> #}
<p class="text-center">ALL RIGHTS RESERVED 2022</p>
</div>

View File

@ -97,7 +97,7 @@
{% 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="{{'z-10 bg-white fixed w-screen max-w-full ' ~ 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>
@ -173,7 +173,7 @@
<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">
<div class="pt-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 %}

View File

@ -66,7 +66,7 @@ Parameters:
{% elif "bottom" in padding %}
{% set padding_class = " py-2 md:py-4 lg:pb-28" %}
{% elif "both" in padding %}
{% set padding_class = " py-2 md:py-4 lg:py-28" %}
{% set padding_class = " py-8 md:py-4 lg:py-28" %}
{% endif %}
{% endif %}