{{-- Top Header Row: Title with Icon Avatar & Subtitle on Left, Top Quick Actions on Right --}}

{{ __('labels.hb_live_preview') }}

Changes you make will reflect in the live preview based on the selected date, zone and device.
{{-- Filter Rows Container (Side by Side in Same Row) --}}
{{-- Filter 1: DateTime Simulation --}}
Select Date
{{-- Filter 2: Delivery Zone Simulation --}}
Select Zone
{{-- Bottom Controls Row: Device Selectors on Left & Zoom/Status/Preview Mode on Right --}}
@if (($platform ?? 'app') === 'app')
@else
@endif
@if (($platform ?? 'app') === 'app')
@endif {{-- Status Indicator (Live / Preview animated pulse dot) --}}
Live
{{-- Light / Dark Theme Toggle --}}
{{-- Preview / Back to Edit Mode Toggle --}}
@php $homeGeneralSettings = app(\App\Services\SettingService::class) ->getSettingByVariable(\App\Enums\SettingTypeEnum::HOME_GENERAL_SETTINGS()) ?->toArray(request())['value'] ?? []; $allTitle = !empty($homeGeneralSettings['title']) ? $homeGeneralSettings['title'] : 'All'; $allIcon = $homeGeneralSettings['icon'] ?? ''; $allActiveIcon = $homeGeneralSettings['activeIcon'] ?? ($homeGeneralSettings['icon'] ?? ''); $bgType = $homeGeneralSettings['backgroundType'] ?? ''; $fontColor = $homeGeneralSettings['fontColor'] ?? ''; $appBgColor = $homeGeneralSettings['backgroundColorApp'] ?? ($homeGeneralSettings['backgroundColor'] ?? '#0066cc'); $appBgImage = $homeGeneralSettings['backgroundImageApp'] ?? ($homeGeneralSettings['backgroundImage'] ?? ''); $appBgAnim = $homeGeneralSettings['backgroundAnimationApp'] ?? ($homeGeneralSettings['backgroundAnimation'] ?? ''); $webBgColor = $homeGeneralSettings['backgroundColorWeb'] ?? ($homeGeneralSettings['backgroundColor'] ?? '#ffffff'); $webBgImage = $homeGeneralSettings['backgroundImageWeb'] ?? ($homeGeneralSettings['backgroundImage'] ?? ''); $webBgAnim = $homeGeneralSettings['backgroundAnimationWeb'] ?? ($homeGeneralSettings['backgroundAnimation'] ?? ''); @endphp
@if (($platform ?? 'app') === 'app') {{-- Phone Mockup (App Layout using Devices.css v0.2.0) --}}
@if ($bgType === 'animation' && !empty($appBgAnim)) @endif
1:17
Selected location
Your current location, ...
@if (!empty($allActiveIcon)) {{ $allTitle }} @elseif (!empty($allIcon)) {{ $allTitle }} @else @endif
{{ Str::limit($allTitle, 11) }}
@if (!empty($categories) && count($categories) > 0) @foreach ($categories->take(10) as $cat) @php $catTitle = $cat instanceof \App\Models\Category ? $cat->getTranslation('title', 'en', false) : $cat->title; $catIcon = $cat->icon ?: null; $catActiveIcon = $cat->active_icon ?: ($cat->icon ?: null); $bgType = is_object($cat->background_type) ? $cat->background_type->value : $cat->background_type ?? 'none'; @endphp
@if (!empty($catIcon)) {{ $catTitle }} @elseif (!empty($cat->image) && !str_contains($cat->image, 'category-placeholder.png')) {{ $catTitle }} @else @endif
{{ Str::limit($catTitle, 11) }}
@endforeach @else
Grocery
@endif
{{ __('labels.loading') }}
Home
Categories
Cart
Account
@else @php $webSettingRecord = \App\Models\Setting::find('web'); $webValues = is_array($webSettingRecord?->value) ? $webSettingRecord->value : []; $customerWebUrl = !empty($webValues['customerWebUrl']) ? $webValues['customerWebUrl'] : 'https://yourstore.com'; @endphp {{-- Browser Mockup (Web Layout) --}}
{{ $customerWebUrl }}
@if ($bgType === 'animation' && !empty($webBgAnim)) @endif
@if (!empty($allActiveIcon)) {{ $allTitle }} @elseif (!empty($allIcon)) {{ $allTitle }} @else @endif
{{ Str::limit($allTitle, 12) }}
@if (!empty($categories) && count($categories) > 0) @foreach ($categories->take(10) as $cat) @php $catTitle = $cat instanceof \App\Models\Category ? $cat->getTranslation('title', 'en', false) : $cat->title; $catIcon = $cat->icon ?: null; $catActiveIcon = $cat->active_icon ?: ($cat->icon ?: null); $bgType = is_object($cat->background_type) ? $cat->background_type->value : $cat->background_type ?? 'none'; @endphp
@if (!empty($catIcon)) {{ $catTitle }} @elseif (!empty($cat->image) && !str_contains($cat->image, 'category-placeholder.png')) {{ $catTitle }} @else @endif
{{ Str::limit($catTitle, 12) }}
@endforeach @else
Beauty
@endif
{{ __('labels.loading') }}
@endif