@extends('frontend.layouts.app')

@section('title')
Downloadable Forms | Philippine Green Building Initiative (PGBI)
@endsection

@section('seo')
<meta property="og:locale" content="en_US" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Downloadable Forms | Philippine Green Building Initiative (PGBI)" />
<meta property="og:url" content="{{ url('downloadable-forms') }}" />
<meta property="og:site_name" content="Downloadable Forms | Philippine Green Building Initiative (PGBI)" />
<meta property="og:image" content="{{ asset('images/meta-thumbnail.jpg') }}" />
<meta property="og:thumbnail" content="{{ asset('images/meta-thumbnail.jpg') }}" />
@endsection

@section('content')
<div class="container py-5">
  <div class="mb-4"></div>

  <h2 class="fw-bold mb-5">Downloadable Forms</h2>

  <div class="row mb-5">
    <div class="col-12 col-md-3">
      <form action="{{ url('filter-forms') }}" method="GET">
        <div class="input-group">
          <button class="border-0 bg-white border-bottom" type="submit">
            <span class="input-group-text border-0 bg-white rounded-0" id="basic-addon1">
              <i class="fa-solid fa-magnifying-glass fa-flip-horizontal"></i>
            </span>
          </button>
          <input type="text" name="query" class="form-control form-search border-0 border-bottom rounded-0" placeholder="Search" aria-describedby="basic-addon1">
        </div>
      </form>
    </div>
    @if ($query != null)
      <div class="col d-flex align-items-center">
        <div class="border-bottom border-danger py-1">
          <a href="{{ url('downloadable-forms') }}" class="text-danger text-decoration-none"><i class="fa-solid fa-trash"></i> Clear Filter</a>
        </div>
      </div>
    @endif
  </div>

  @foreach ($forms->unique('category') as $categoryItem)
    <div class="mb-4">
        <h4 class="fw-semibold mb-4">{{ $categoryItem->category }}</h4>
        
        <div class="row">
            @foreach ($forms->where('category', $categoryItem->category) as $items)
                <div class="col-12 col-md-8 mb-3">
                    <div class="row mb-3">
                        <div class="col-12 col-md-8">
                            <div class="p-3 download-label w-100">
                                <span class="fw-bold">{{ $items->name }}</span>
                            </div>
                        </div>
                        <div class="col-12 col-md">
                            <a href="{{ asset('forms/' . $items->file) }}" download class="bg-light-green py-3 d-flex border-light-green justify-content-center text-white text-decoration-none w-100">
                                <div>
                                    <span>Download</span> <i class="fa-solid fa-download"></i>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="border-top"></div>
                </div>
            @endforeach
        </div>
    </div>
  @endforeach

</div>
@endsection