@extends('frontend.layouts.app')

@section('title')
    Photo Albums
@stop

@section('content')
<div id="banner" style="background-image: url({{ asset('images/inside_banner_touse_1.jpg') }}); position: relative; margin-top: -50px; height: 180px;">
  <h1 class="text-center text-white mt-5" style="font-weight: bold;">PHOTO & VIDEO</h1>
</div>

  <div class="container my-5">
    <div class="row">
      <div class="col-md-12">
        <h1>Photo Albums</h1>
      </div>
    </div>
    <div class="row">
      <div class="col-lg-12">
        <div class="row">

          @foreach ($albums as $album)
          <div class="col-lg-6 my-4">
            <div class="card">
              <div class="card-body">
                
                <a href="{{ route('media.show', $album->id) }}">
                  <img class="img-fluid" src="/uploads/albums/{{ $album->cover_img }}" alt="image-{{ $album->id }}" style="width: 100%;" />
                  <h3 class="mt-4 text-center">{{ $album->name }}</h3>
                </a>
                {{-- <h3>
                  <a href="{{ route('articles.show', $album->id) }}">{{ $album->name }}</a>
                  @if (app()->getLocale() == 'en')                      
                    <a href="en/articles/{{ $album->id }}">{{ $album->translate(app()->getLocale())->title }}</a>
                  @else
                    <a href="my/articles/{{ $album->id }}">{{ $album->translate(app()->getLocale())->title }}</a>
                  @endif
                </h3> --}}
                {{-- <p>
                 {{ Str::of($album->name)->limit(300) }}
                </p> --}}
              </div>
            </div>
          </div>
          @endforeach

        </div>
      </div>
      {{-- <div class="col-lg-4 mt-4">
        <h2 class="text-center">Categories</h2>
      </div> --}}

    </div>
  </div>
@stop