@extends('layouts.admin') @section('content')

Hero Images

Upload background images for the fading slideshows. Up to {{ $max }} images per section.
@include('partials.alerts')
@foreach($sections as $key => $label) @php $list = $images[$key] ?? collect(); $open = $key === 'home'; @endphp
{{ $label }} {{ $list->count() }}/{{ $max }}
@if($list->count() > 0)
@foreach($list as $img)
{{ $img->caption }} @unless($img->is_active)Hidden@endunless
@csrf @method('PATCH')
@csrf @method('DELETE')
@if($img->caption)
{{ $img->caption }}
@endif
@endforeach
@else

No images yet — the section falls back to its brand gradient.

@endif @if($list->count() < $max)
@csrf
@endif
@endforeach
@push('rich_editor_assets') @endpush @push('rich_editor_inits') // Remember which section the admin had open across refreshes (one at a time). (function () { var KEY = 'gfcHeroOpenSection'; var acc = document.querySelector('[data-hero-accordion]'); if (!acc) return; var stored = null; try { stored = localStorage.getItem(KEY); } catch (e) {} // stored === null -> first visit, keep server default (home open) // stored === '' -> user closed everything, honor that // stored === 'key' -> open that section if (stored !== null) { acc.querySelectorAll('[data-hero-collapse]').forEach(function (el) { var isTarget = el.getAttribute('data-hero-collapse') === stored; var toggle = acc.querySelector('[data-hero-section="' + el.getAttribute('data-hero-collapse') + '"]'); el.classList.toggle('show', isTarget); if (toggle) { toggle.classList.toggle('collapsed', !isTarget); toggle.setAttribute('aria-expanded', isTarget ? 'true' : 'false'); } }); } acc.addEventListener('shown.bs.collapse', function (ev) { var key = ev.target.getAttribute('data-hero-collapse'); try { localStorage.setItem(KEY, key); } catch (e) {} }); acc.addEventListener('hidden.bs.collapse', function () { if (!acc.querySelector('.collapse.show')) { try { localStorage.setItem(KEY, ''); } catch (e) {} } }); })(); document.querySelectorAll('[data-hero-form]').forEach(function (form) { var zone = form.querySelector('[data-dropzone]'); var input = form.querySelector('[data-input]'); var previews = form.querySelector('[data-previews]'); var prompt = form.querySelector('[data-prompt]'); var submit = form.querySelector('[data-submit]'); function render() { previews.innerHTML = ''; var files = Array.prototype.slice.call(input.files); submit.disabled = files.length === 0; prompt.style.display = files.length ? 'none' : ''; files.forEach(function (f) { var d = document.createElement('div'); d.className = 'hero-preview'; var img = document.createElement('img'); img.src = URL.createObjectURL(f); d.appendChild(img); var n = document.createElement('span'); n.className = 'hp-name'; n.textContent = f.name; d.appendChild(n); previews.appendChild(d); }); } input.addEventListener('change', render); ['dragenter','dragover'].forEach(function (e) { zone.addEventListener(e, function (ev) { ev.preventDefault(); zone.classList.add('dragover'); }); }); ['dragleave','drop'].forEach(function (e) { zone.addEventListener(e, function (ev) { ev.preventDefault(); zone.classList.remove('dragover'); }); }); zone.addEventListener('drop', function (ev) { if (ev.dataTransfer && ev.dataTransfer.files.length) { input.files = ev.dataTransfer.files; render(); } }); }); @endpush @endsection