@section('title', __('site.menu_item_6_sub_5'))

@section('head')
    <link rel="stylesheet" href="/assets/js/plugins/dropzone/min/dropzone.min.css">
    <link rel="stylesheet" href="{{ assetv('/assets/css/pages/siteconfig.css') }}">
    <link rel="stylesheet" href="{{ assetv('/assets/css/pages/sitelook.css') }}">
@endsection

@php
    $breadcrumb = [
        ['label' => __('general.top_menu_item_site')],
        ['label' => __('site.menu_item_6')],
        ['label' => __('site.menu_item_6_sub_5')],
    ];

    $current = $icon ? 'https://' . $serverData->name . '/contents/' . session('siteID') . '/icon/' . $icon : null;
@endphp

@include('includes/header-novo')

<main class="app-main">

    @include('includes.breadcrumb')

    @include('includes.flash')

    <header class="page-head">
        <div>
            <h1 class="page-title">{{ __('site.menu_item_6_sub_5') }}</h1>
            <p class="page-sub">{{ __('site.page_icon_sub') }}</p>
        </div>
    </header>

    @if($apiError)
        <div class="apierr">
            <span class="apierr__ico"><i class="fa-solid fa-plug-circle-xmark"></i></span>
            <p class="apierr__text">{{ $apiError }}</p>
        </div>
    @else
        <div class="lookgrid">
            <section class="sec">
                <div class="sec__head">
                    <h2 class="sec__title"><i class="fa-solid fa-star"></i> {{ __('site.page_icon_block') }}</h2>
                </div>

                <div class="sec__body">
                    @include('includes.asset-upload', [
                        'url' => route('site.theme.u.icon.do'),
                        'field' => 'icon',
                        'current' => $current,
                        'ratio' => '1 / 1',
                        'frame' => 'assbox--icon',
                        'hint' => __('site.page_icon_hint'),
                    ])
                </div>
            </section>

            <section class="sec">
                <div class="sec__head">
                    <h2 class="sec__title"><i class="fa-solid fa-eye"></i> {{ __('site.page_bg_preview') }}</h2>
                    <p class="sec__desc">{{ __('site.page_icon_preview_help') }}</p>
                </div>

                <div class="sec__body">
                    <div class="tabdemo">
                        <span class="tabdemo__tab">
                            <img class="tabdemo__ico assvia" src="{{ $current }}" alt="" {{ $current ? '' : 'hidden' }}>
                            <i class="fa-solid fa-globe tabdemo__ph"></i>
                            <span class="tabdemo__name">{{ $siteData->name }}</span>
                            <i class="fa-solid fa-xmark tabdemo__x"></i>
                        </span>

                        <span class="tabdemo__url">{{ $siteData->domain }}</span>
                    </div>
                </div>
            </section>
        </div>
    @endif

</main>

@section('scripts')
    <script src="/assets/js/plugins/dropzone/min/dropzone.min.js"></script>
    <script src="{{ assetv('/assets/js/site-look.js') }}"></script>
@endsection

@include('includes/footer-novo')