@extends('layout/template')

@section('content')
    <div class="row" style="margin-top: 20px;">
        <div class="col-md-12" style="margin-bottom: 10px;">
            <h1>Themes</h1>
            <p>With the Themes you can decide how your overview Page and your Gallery Page looks like.</p>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <h2>Tenant Overview</h2>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            @foreach($themes as $theme)
            <div class="card" style="max-width: 400px; float: left;margin-right: 20px;">
                <img class="card-img-top" src="/s/theme/tenant/{{ $theme["name"] }}.png" alt="Card image cap">
                <div class="card-body">
                    <h5 class="card-title">{{ $theme["name"] }}</h5>
                    <a href="/s/theme/set?name={{ $theme->name }}" class="btn btn-primary">Activate</a>
                    <a href="/{{ $current_tenant->url }}?theme={{ $theme->name }}" target="_blank" class="btn btn-outline-primary">Preview</a>
                </div>
            </div>
            @endforeach
        </div>
    </div>

    <div class="row">
        <div class="col-md-12">
            <h2>Gallery Overview</h2>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            @foreach($gallery_themes as $theme)
                <div class="card" style="max-width: 400px; float: left;margin-right: 20px;">
                    <img class="card-img-top" src="/s/theme/gallery/{{ $theme["name"] }}.png" alt="Card image cap">
                    <div class="card-body">
                        <h5 class="card-title">{{ $theme["name"] }}</h5>
                        <a href="/s/theme/set?name={{ $theme->name }}" class="btn btn-primary">Activate</a>
                        @if(!is_null($gallery))
                            <a href="/{{ $current_tenant->url }}/{{ $gallery->url }}?theme={{ $theme->name }}" target="_blank" class="btn btn-outline-primary">Preview</a>
                        @endif
                    </div>
                </div>
            @endforeach
        </div>
    </div>

@endsection