ubdate base

This commit is contained in:
Ehab Hassan 2025-08-04 17:30:12 +03:00
parent bdc0cd9ebf
commit 7839dfe9c0
6 changed files with 127 additions and 154 deletions

5
.gitignore vendored
View File

@ -7,5 +7,8 @@ yarn.lock
package-lock.json
dist
.temp
public/
public
public/*
public/home/index.html
static/css
tailwindcss

View File

@ -4,114 +4,3 @@ sort_by = "date"
template = "index.html"
+++
{{ hero3(
announcement='<a href="#" class="font-semibold text-gray-300 hover:text-white">Read more &rarr;</a>',
subheader="SUBHEADER",
title="This is Hero1.htmll",
subtitle="This is smaller title h2",
description="Anim aute id magna aliqua ad ad non deserunt sunt. Qui irure qui lorem cupidatat commodo. Elit sunt amet fugiat veniam occaecat.",
button1_text="Get started",
button1_link="#",
button2_text="Learn more",
button2_link="#"
) }}
{{
hero2(
title="Welcome to Your Zola Site",
subtitle="A modern, responsive website built with Zola and styled with Tailwind CSS",
button_text="Learn More",
button_link="/blog", bg_color="bg-blue-700"
) }}
<div class="container mx-auto relative isolate overflow-hidden lg:py-24 py-12">
<div class="mx-auto max-w-7xl px-6 py-12">
<div class="mx-auto max-w-2xl lg:mx-0">
##### TECHNOLOGY
## Compute, Data, and Network
<br>
Our cloud platform harnesses the latest innovations in compute, data, and network technologies to deliver exceptional performance and efficiency.
</div>
<br>
<div class="pb-10 grid grid-cols-1 gap-8 mt-6 lg:grid-cols-3">
{{ features_card(
title="Zero-OS",
description="The Bare Metal Operating System can be hosted by everyone on any computer hardware and doesnt need human intervention."
) }}
{{ features_card(
title="QSS",
description="The Quantum Safe Storage system is upto 10x more efficient, allows data to be stored with full control over locality, data can not be lost nor corrupted."
) }}
{{ features_card(
title="Mycelium",
description="Mycelium Network is compatible with any Internet and is capable to find the shortest path between participants (apps and people)."
) }}
</div>
<div class="justify-center items-center flex">
<a href="/technology" class="rounded-md mt-8 bg-indigo-400 px-3 py-2 font-semibold text-white shadow-sm hover:bg-indigo-600 hover:text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-400">Technologies</a>
</div>
</div>
</div>
## About This Site
This is a modern, responsive website built with [Zola](https://www.getzola.org/) and styled with [Tailwind CSS](https://tailwindcss.com/). It demonstrates the use of shortcodes and markdown together to create beautiful, reusable components.
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 my-12">
{{
feature_card(
title="Fast and Lightweight",
description="Zola generates static HTML files that load quickly",
icon="⚡"
)
}}
{{ feature_card(title="Modern Design", description="Tailwind CSS provides utility classes for rapid UI development", icon="🎨") }}
{{ feature_card(title="Responsive Layout", description="Looks great on all devices, from mobile to desktop", icon="📱") }}
{{ feature_card(title="Markdown Content", description="Write your content in Markdown for easy formatting", icon="📝") }}
{{ feature_card(title="Syntax Highlighting", description="Code blocks are automatically highlighted", icon="💻") }}
{{ feature_card(title="Search Functionality", description="Built-in search for your content", icon="🔍") }}
</div>
### Getting Started
To add new content, create Markdown files in the `content` directory. Zola will automatically generate pages for each file.
For more information, check out the [Zola documentation](https://www.getzola.org/documentation/getting-started/overview/) and [Tailwind CSS documentation](https://tailwindcss.com/docs).
{{
cta(
title="Ready to Get Started?",
description="Create your own beautiful website with Zola and Tailwind CSS today.",
button_text="View Blog",
button_link="/blog")
}}

117
content/home/index.md Normal file
View File

@ -0,0 +1,117 @@
+++
title = "Home"
sort_by = "date"
template = "index.html"
+++
{{ hero3(
announcement='<a href="#" class="font-semibold text-gray-300 hover:text-white">Read more &rarr;</a>',
subheader="SUBHEADER",
title="This is Hero1.htmll",
subtitle="This is smaller title h2",
description="Anim aute id magna aliqua ad ad non deserunt sunt. Qui irure qui lorem cupidatat commodo. Elit sunt amet fugiat veniam occaecat.",
button1_text="Get started",
button1_link="#",
button2_text="Learn more",
button2_link="#"
) }}
{{
hero2(
title="Welcome to Your Zola Site",
subtitle="A modern, responsive website built with Zola and styled with Tailwind CSS",
button_text="Learn More",
button_link="/blog", bg_color="bg-blue-700"
) }}
<div class="container mx-auto relative isolate overflow-hidden lg:py-24 py-12">
<div class="mx-auto max-w-7xl px-6 py-12">
<div class="mx-auto max-w-2xl lg:mx-0">
##### TECHNOLOGY
## Compute, Data, and Network
<br>
Our cloud platform harnesses the latest innovations in compute, data, and network technologies to deliver exceptional performance and efficiency.
</div>
<br>
<div class="pb-10 grid grid-cols-1 gap-8 mt-6 lg:grid-cols-3">
{{ features_card(
title="Zero-OS",
description="The Bare Metal Operating System can be hosted by everyone on any computer hardware and doesnt need human intervention."
) }}
{{ features_card(
title="QSS",
description="The Quantum Safe Storage system is upto 10x more efficient, allows data to be stored with full control over locality, data can not be lost nor corrupted."
) }}
{{ features_card(
title="Mycelium",
description="Mycelium Network is compatible with any Internet and is capable to find the shortest path between participants (apps and people)."
) }}
</div>
<div class="justify-center items-center flex">
<a href="/technology" class="rounded-md mt-8 bg-indigo-400 px-3 py-2 font-semibold text-white shadow-sm hover:bg-indigo-600 hover:text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-400">Technologies</a>
</div>
</div>
</div>
## About This Site
This is a modern, responsive website built with [Zola](https://www.getzola.org/) and styled with [Tailwind CSS](https://tailwindcss.com/). It demonstrates the use of shortcodes and markdown together to create beautiful, reusable components.
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 my-12">
{{
feature_card(
title="Fast and Lightweight",
description="Zola generates static HTML files that load quickly",
icon="⚡"
)
}}
{{ feature_card(title="Modern Design", description="Tailwind CSS provides utility classes for rapid UI development", icon="🎨") }}
{{ feature_card(title="Responsive Layout", description="Looks great on all devices, from mobile to desktop", icon="📱") }}
{{ feature_card(title="Markdown Content", description="Write your content in Markdown for easy formatting", icon="📝") }}
{{ feature_card(title="Syntax Highlighting", description="Code blocks are automatically highlighted", icon="💻") }}
{{ feature_card(title="Search Functionality", description="Built-in search for your content", icon="🔍") }}
</div>
### Getting Started
To add new content, create Markdown files in the `content` directory. Zola will automatically generate pages for each file.
For more information, check out the [Zola documentation](https://www.getzola.org/documentation/getting-started/overview/) and [Tailwind CSS documentation](https://tailwindcss.com/docs).
{{
cta(
title="Ready to Get Started?",
description="Create your own beautiful website with Zola and Tailwind CSS today.",
button_text="View Blog",
button_link="/blog")
}}

File diff suppressed because one or more lines are too long

View File

@ -1,46 +1,10 @@
{% extends "base.html" %}
{% block content %}
<div class="overflow-hidden">
<!-- <div class="px-4 py-5 sm:px-6 text-center">
<h2 class="text-2xl font-bold text-gray-900">
Welcome to {{ config.title }}
</h2>
<p class="mt-1 max-w-2xl mx-auto text-sm text-gray-500">
A beautiful site built with Zola and Tailwind CSS.
</p>
</div> -->
<div>
<div class="px-4 py-5 sm:p-6">
<div class="">
{% if section is defined and section.content is defined %}
{{ section.content | safe }}
{% elif page is defined and page.content is defined %}
{{ page.content | safe }}
{% else %}
<p>This is a starter template for your Zola site with Tailwind CSS.</p>
<p>Edit the content in <code>content/_index.md</code> to customize this page.</p>
{% endif %}
</div>
</div>
</div>
<<!-- home page template, has a banner and rows of page summaries -->
<div>
{% set page = get_page(path="home/index.md") %}
{{page.content | safe}}
</div>
{% if section is defined and section.pages is defined %}
<!-- <div class="mt-8 grid gap-6 grid-cols-1 md:grid-cols-2 lg:grid-cols-3">
{% for page in section.pages %}
<a href="{{ page.permalink }}" class="bg-white overflow-hidden shadow rounded-lg hover:shadow-lg transition-shadow duration-300">
<div class="px-4 py-5 sm:p-6">
<h3 class="text-lg font-medium text-gray-900 truncate">{{ page.title }}</h3>
{% if page.description %}
<p class="mt-1 text-sm text-gray-500">{{ page.description }}</p>
{% endif %}
<div class="mt-4 flex items-center text-sm text-gray-500">
<span>{{ page.date | date(format="%B %e, %Y") }}</span>
</div>
</div>
</a>
{% endfor %}
</div> -->
{% endif %}
{% endblock %}
{% endblock content %}