@extends('frontend::layouts.master')
@php
    $blog = !empty($data['blog']) ? $data['blog'] : null;
@endphp

@section('meta')
    <meta property="og:url" content="{{ url()->current() }}" />
    <meta property="og:type" content="website" />
    <meta property="og:title" content="{{ $blog['name'] ?? '' }}" />
    <meta property="og:image" content="{{ !empty($blog['image']) ? asset($blog['image']) : '' }}" />
    <meta property="og:image:source" content="{{ !empty($blog['image']) ? asset($blog['image']) : '' }}" />
@endsection

@section('content')
    <div class="container pt-6 xl:pt-10 relative">
        <img class="w-full" src="{{ $blog['image'] ?? '' }}">
        <div class="flex flex-col md:flex-row -mx-4">
            <div class="hidden md:w-[150px] md:block p-4 ">
                <div class="sticky top-3 flex flex-col gap-3 blog-share-group">
                    <p class="text-center text-18 font-semibold">{{ __('frontend::frontend.share') }}</p>
                    @php
                        $socials = [
                            'facebook' => ['url' => 'https://www.facebook.com/sharer/sharer.php?u=', 'img' => 'sh1.svg'],
                            'twitter' => ['url' => 'https://twitter.com/intent/tweet?url=', 'img' => 'sh2.svg'],
                            'line' => ['url' => 'https://social-plugins.line.me/lineit/share?url=', 'img' => 'sh3.svg'],
                        ];
                    @endphp
                    @foreach ($socials as $social => $v)
                        <a class="{{ $v['class'] ?? '' }}" href="{{ $v['url'] . url()->current() }}" target="{{ $v['target'] ?? '_blank' }}">
                            <img src="{{ Module::asset('frontend:img/icon/' . $v['img']) }}" alt="{{ $social }}">
                        </a>
                    @endforeach
                </div>
            </div>
            <div class="pb-6 xl:pb-8 px-4">
                <div class="py-4">
                    <p class="text-12 font-normal text-gray-400">{{ !empty($blog['publish_at']) ? str_date($blog['publish_at'], 'd M Y') : '' }}</p>
                    <p class="text-16 md:text-20 font-bold">{{ $blog['name'] ?? '' }}</p>
                </div>
                <div class="text-editor">
                    {!! mwz_getTextString($blog['detail'] ?? '') !!}
                </div>
                <p class="md:hidden text-center text-18 font-semibold mt-6">Share</p>
                <div class="flex items-center justify-center flex-wrap w-full md:hidden gap-3 p-4 sticky top-0 blog-share-group">
                    @php
                        $socials = [
                            'facebook' => ['url' => 'https://www.facebook.com/sharer/sharer.php?u=', 'img' => 'sh1.svg'],
                            'twitter' => ['url' => 'https://twitter.com/intent/tweet?url=', 'img' => 'sh2.svg'],
                            'line' => ['url' => 'https://social-plugins.line.me/lineit/share?url=', 'img' => 'sh3.svg'],
                        ];
                    @endphp
                    @foreach ($socials as $social => $v)
                        <a class="{{ $v['class'] ?? '' }}" href="{{ $v['url'] . url()->current() }}" target="{{ $v['target'] ?? '_blank' }}">
                            <img src="{{ Module::asset('frontend:img/icon/' . $v['img']) }}" alt="{{ $social }}">
                        </a>
                    @endforeach
                </div>
            </div>
        </div>


    </div>
@endsection