@extends('components.view')


@section('themeStylesheet')
    <style>
        {{ $themeStylesheet }}
    </style>
@endsection


@section('brandThemeOverrideSettings')
    <style>
        {{ $brandThemeOverrideSettings }}
    </style>
@endsection


@section('brandBackground')
    @if($brandBackground!=='' && !empty($brandBackground))
        style="background-image:url('{{ $brandBackground }}');"
    @endif
@endsection



@section('header')
    @php echo \App\Http\Controllers\Header::index($themeDirectory,$brandLogoSmall) @endphp
    @php echo \App\Http\Controllers\Navigation::index($themeDirectory) @endphp
@endsection


@section('content')
    <div class="scrollable-content"
         x-data=""
         x-init="resizeForScrollableContent(true),resizeForScrollableContentOnChange(true)">

        <div class="row m-0 mb-4">
            <div class="col-12 text-center font-weight-bold mt-4 mb-2 view-heading">
                {!! $icon !!} {{ $heading }}
            </div>
            <div class="col-12 text-center font-weight-bold mt-2 mb-0 view-subheading">
                {{ $subheading }}
            </div>
        </div>

        <div class="px-2">
            @foreach($events as $event)
                <livewire:EventItem
                    :eventItem="$event"
                    :menuItemsHaveImages="$menuItemsHaveImages"
                />
            @endforeach
        </div>


    </div>
@endsection