@extends('themes.base.layout')
@section('title', 'Welcome')

@section('content')
    <div class="container">
        <div class="row">
            @if (count($albums) > 0)
                @foreach ($albums as $album)
                <div class="col-xs-12 col-sm-4">
                    <div class="panel panel-default">
                        <div class="panel-heading"><a href="{{ $album->url() }}">{{ $album->name }}</a></div>
                        <div class="panel-body">
                            <p class="text-center">
                                @php($albumUrl = $album->thumbnailUrl('preview'))
                                @if (strlen($albumUrl) > 0)
                                    <a href="{{ $album->url() }}"><img class="img-responsive img-rounded" src="{{ $albumUrl }}"/></a>
                                @endif
                            </p>
                            <p>{{ $album->description }}</p>
                        </div>
                        <div class="panel-footer">
                            <span class="text-left"><b>{{ $album->photos_count }}</b> photos</span>
                            <span class="pull-right"><a href="{{ $album->url() }}" class="btn btn-sm btn-default">Open album</a></span>
                            <span class="clearfix"></span>
                        </div>
                    </div>
                </div>
                @endforeach
            @else
                <div class="col-xs-12 text-center">
                    <img src="{{ $theme_url }}/images/empty-fuel-gauge.jpg" style="width: 300px;" />

                    <h1>@lang('gallery.index_no_results_heading')</h1>
                    <p>@lang('gallery.index_no_results_text', ['admin_link' => sprintf('<a href="%s">%s</a>', route('admin'), trans('admin.title'))])</p>
                </div>
            @endif
        </div>

        <div class="row" style="margin-top: 15px;">
            <div class="col-xs-12 text-center">
                {{ $albums->links() }}
            </div>
        </div>
    </div>
@endsection