@extends('frontend.layouts.main', array('body_class' => 'projects-list header-over', 'hasMaps' => true))
@section('content')

<div
    data-controller="pages/projects-list"
    data-countries="{{ json_encode($countries) }}"
    data-topics="{{ json_encode($sustainabilityTopics) }}"
    data-sdgs="{{ json_encode($cobenefits) }}"
>
    @include('frontend.templates.blocks.header-map')
    <div role="content-area">
        <div class="projects-list__overlay" data-role="overlay">
            <div class="projects-list__overlay-container">
                <h1 class="projects-list__overlay-pretitle">
                    {{ $templateData->project_count }}<sup>+</sup>
                </h1>
                <h2 class="projects-list__overlay-title">
                    {{ $templateData->hero_title }}
                </h2>
                <p class="projects-list__overlay-subtitle">
                    {{ $templateData->hero_content }}
                </p>
                <div class="projects-list__button-filter" data-role="open-box" data-action="collapse">
                    <div class="projects-list__search-icon">
                        @include('frontend.svg.search')
                    </div>
                    <span class="projects-list__filter-message">@lang('frontend.use_the_filters_to_search')</span>
                </div>
            </div>
            <a href="#" data-action="toggle" class="projects-list__overlay-open">@lang('frontend.use_the_filters_to_search')</a>
            <a href="#" data-action="toggle" class="projects-list__overlay-toggle" title="Toggle"></a>
        </div>
        <div class="projects-list__results" data-role="results">
            @include('frontend.templates.blocks.projects-search-list')
        </div>
        <div class="projects-list__no-results">
            <span>
                @lang('frontend.project_no_results')
            </span>
            <br><br>
            <a href="{{ lang_url('contact-us') }}">@lang('frontend.get_in_touch_with_our_experts')</a> @lang('frontend.to_find_out_more_and_take_climate_action_today')
        </div>
        <div class="projects-list__featured-list" data-role="featured">
            @include('frontend.templates.components.blocks_section', ['blocks' => $object->blocks])
        </div>
    </div>
</div>

@stop