@extends('layouts.front-end.app')

@section('title', $article['name'])

@push('css_or_js')
    @include('web-views.partials.article_seo', ['article' => $article])
@endpush

@section('content')
    <div class="__inline-23">
        <div class="container mt-4 rtl text-align-direction">
            <div class="row {{Session::get('direction') === "rtl" ? '__dir-rtl' : ''}}">
                <a href="{{route('home')}}" class="custom_link">{{translate('home')}}</a>/
                <a href="{{route('article.index')}}" class="custom_link">{{translate('Articles')}}</a>/
                <span class="product_name">
                            {{$article->name}}
                        </span>
            </div>
            <div class="row">
                <div class="col-lg-9 col-12">

                    <h1 class="article_title">
                        {{$article->name}}
                    </h1>

                    <img src="{{ getStorageImages(path: $article->image_full_url, type: 'backend-brand') }}"
                         alt="article_img" class="article_img">

                    <div class="card mt-4 p-4">
                        <div class="article_description">
                            {!! $article->description !!}
                        </div>
                    </div>
                </div>

                <div class="col-lg-3 col-12">
                    <h3 class="article_title">
                        {{translate('Other Articles')}}
                    </h3>
                    @foreach($other_articles as $other_article)
                        <div class="card mb-2 p-3">
                            <div class="row">
                                <div class="col-lg-4">

                                    <a href="{{route('article.show',$other_article->slug)}}">
                                        <img
                                            src="{{ getStorageImages(path: $other_article->cover_full_url, type: 'backend-brand') }}"
                                            alt="article_img" class="article_cover">                                    </a>
                                </div>
                                <div class="col-lg-8">


                                    <a href="{{route('article.show',$other_article->slug)}}" class="text-capitalize fw-semibold">
                                        {{ $other_article['name'] }}
                                    </a>
                                    <h6 class="fs-13 fw-normal mb-0">
                                        {{ Str::limit($other_article->short_description, 75, '...') }}
                                    </h6>
                                    <p class="text-left article_date">{{\Carbon\Carbon::parse($article->created_at)->locale('ar')->translatedFormat('j F، Y')}}</p>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>
        </div>
    </div>
@endsection

@push('script')
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>


@endpush