+++
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"
) }}



## 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") 
}}