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

@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_3')],
    ];

    $current = $share ? 'https://' . $serverData->name . '/contents/' . session('siteID') . '/share/' . $share : 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_3') }}</h1>
            <p class="page-sub">{{ __('site.page_share_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-share-nodes"></i> {{ __('site.page_share_block_title') }}</h2>
                </div>

                <div class="sec__body">
                    @include('includes.asset-upload', [
                        'url' => route('site.theme.u.share.do'),
                        'field' => 'share',
                        'current' => $current,
                        'ratio' => '600 / 315',
                        'frame' => '',
                        'hint' => __('site.page_share_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_share_about') }}</p>
                </div>

                <div class="sec__body">
                    <div class="cardemo">
                        <span class="cardemo__shot">
                            <img class="cardemo__img assvia" src="{{ $current }}" alt="" {{ $current ? '' : 'hidden' }}>
                            <i class="fa-solid fa-image cardemo__ph"></i>
                        </span>

                        <span class="cardemo__text">
                            <small class="cardemo__host">{{ $siteData->domain }}</small>
                            <strong class="cardemo__title">{{ $siteData->name }}</strong>
                        </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')