thebola-cms/resources/views/home.antlers.html

<section>
    <div class="d-flex px-5" style="min-height: 90vh;background-image: url(./assets/image/2.jpg);background-size: cover;">
        <div data-aos="zoom-in" class="text-light text-lg-center m-auto">
            {{ grid_field }}
                {{ home_section_1 }}
                    {{ highlight_text }}
                    <p class="hero-text-description pb-5 pt-3 py-lg-5">{{ description_text }} </p>
                    <a href="{{ button_link }}" class="nav-link db-btn mx-0 mx-lg-auto">Explore</a>
                {{ /home_section_1 }}
            {{ /grid_field }}
        </div>
    </div>
</section>
<section>
    <div class="text-md-center text-light section2" style="background-image: url(./assets/image/3.png);background-size: cover;padding-top: 10rem;padding-bottom: 5rem; background-position: top center;">
        <div class="container-fluid p-0 m-0" data-aos="zoom-in" >

            {{ grid_field }}
                {{ home_section_2 }}

                    <p class="db-h3 text-highlight">{{ highlight_text }}</p>
                    <p class="mx-auto my-5 p-0 about-paragraph db-h5">{{ description_text }}</p>
                    <a href="{{ button_link }}" class="nav-link db-btn mx-auto">Read More</a>

                {{ /home_section_2 }}
            {{ /grid_field }}

        </div>
    </div>
</section>
<section>

    {{ grid_field }}
        {{ home_section_3 }}
            <div class="section3-img" style="background-image: url('.{{ background_image }}');"></div>
        {{ /home_section_3 }}
    {{ /grid_field }}
</section>
<section>
    <div class="text-center text-light p-7">
        <p class="db-h3 text-highlight">Features</p>
        <p class="mx-auto p-0 db-h5">Stay tuned for more latest news and articles brought exclusively by our team</p>
    </div>
    <div class="container-fluid p-0">

        <div class="row text g-0">

            {{ grid_field }}
                {{ firstEntry = 1 }}
                {{ home_section_4 }}
                    {{ features }}
                        {{ partial:partials/feature }}
                        {{ firstEntry = 0 }}
                    {{ /features }}
                {{ /home_section_4 }}
            {{ /grid_field }}


        </div>
    </div>
</section>
<section>
    <div class="text-light section-5 py-7">
        <div class="text-center px-5 py-3">
            <p class="db-h3 text-highlight">Recent News</p>
            <p class="mx-auto p-0 db-h5 mb-5">Stay tuned for more latest news and articles brought exclusively by our team</p>
        </div>
        <div class="row g-0 article-container">

            {{ collection:article limit="3" sort="article_date:desc" }}
                {{ partial:partials/articlecard }}
            {{ /collection:article }}

        </div>
        <a href="/news" class="nav-link db-btn mx-auto d-none d-lg-block" style="font-size: clamp(18px,1vw,23px);font-weight: 500;padding: 0.5rem 3rem;text-decoration: none;">See More</a>
    </div>
</section>
<section>
    <div class="text-light">
        <div class="text-center px-5">
            <p class="db-h3 text-highlight">Contact Us</p>
            <p class="mx-auto p-0 db-h5 mb-5">If you have any questios or feedback, drop them <br/> here and we'll get back to you!</p>
        </div>
        <div class="row g-0">
            <div class="col-lg-5 my-5 my-lg-0 container-contactus">
                {{ partial:partials/contactusform }}
            </div>
            <div class="col-lg-7 px-5 py-5" style="background-image: url(./assets/image/8.jpg);background-size: cover; background-position: center center;">

                <p class="p-0 db-h5" style="line-height: clamp(1.7rem,2.5vw,3rem);">
                    <a class="db-link" href="tel:{{ company_profile:phone_no }}">{{ company_profile:phone_no }}</a>
                    <br/>
                    <a class="db-link" href="{{ company_profile:site_url }}">{{ company_profile:site_url }}</a>
                </p>
                <p class="p-0 db-h5" style="line-height: clamp(1.7rem,2.5vw,3rem);">{{ company_profile:address }}</p>
            </div>
        </div>
    </div>
</section>
<section>
    <div class="text-light section-8" style="background-image: url(./assets/image/dbparticle3.png);">
        <div data-aos="zoom-in" class="text-center ">
            <p class="db-h3 text-highlight" style="line-height: clamp(3rem,2.5vw,4rem);">Our Mobile Apps Is Now Available!</p>
            <p class="mx-auto p-0 db-h5 mb-5" style="line-height: clamp(1.7rem,2.5vw,3rem);">Download the app for bookings and other important notifications in<br/> an exclusive app for both android and iOS.</p>
        </div>
        {{ partial:partials/appsdownload }}
    </div>
</section>