@extends('website.layouts.layouts')
@section('customized_meta')
    <!------ page meta tag ------->
    <meta name="description" content="{{$og->description?$og->description:$mainOpenGraph->description}}">
    <meta name="keywords" content="{{$og->key_words?$og->key_words:$mainOpenGraph->key_words}}">
    <!--------------------------->
    <!------ open graph meta tag ------->

    <meta property="og:type"content="{{$og->openGraph->og_type?$og->openGraph->og_type:$mainOpenGraph->openGraph->og_type}}">
    <meta property="og:title"content="{{$og->openGraph->og_title?$og->openGraph->og_title:$mainOpenGraph->openGraph->og_title}}">
    <meta property="og:description"content="{{$og->openGraph->og_description?$og->openGraph->og_description:$mainOpenGraph->openGraph->og_description}}">
    <meta property="og:url"content="{{$og->openGraph->og_url?$og->openGraph->og_url:$mainOpenGraph->openGraph->og_url}}">
    <meta property="og:site_name"content="{{$og->openGraph->og_site_name?$og->openGraph->og_site_name:$mainOpenGraph->openGraph->og_site_name}}">


    @if($og->openGraph->image_url)
        <meta property="og:image"content="{{$og->openGraph->image_url}}">
    @elseif($mainOpenGraph->openGraph->image_url)
        <meta property="og:image"content="{{$mainOpenGraph->openGraph->image_url}}">
    @elseif($og->openGraph->og_image_id)
        <meta property="og:image"content="{{asset("/storage/uploads/".$og->openGraph->image->dir_name.'/'.$og->openGraph->image->name)}}">
    @elseif($mainOpenGraph->openGraph->og_image_id)
        <meta property="og:image"content="{{asset("/storage/uploads/".$mainOpenGraph->openGraph->image->dir_name.'/'.$mainOpenGraph->openGraph->image->name)}}">
    @endif

    <!------------->
@endsection
@section('content')
    <!-- products page -->
    <div class="products-page">
        <div class="page-body">
            <!-- division one section -->
            @if($categories)
            @foreach($categories as $category)
                    <div class="division-section">
                        <div class="section-heading">
                            <p>
                                {{$category->{'category_'.HelperClass::currentLang()}->name}}  {{--Products--}}{{trans("trans.product_product")}}
                            </p>
                        </div>
                        <div class="section-body">
                            <ul class="main-section-ul">
                                @if($category->products)
                                    @foreach($category->products as $product)
                                        <li>
                                            <a href="/products/details/{{$product->url}}">
                                                <div class="text-btn-wrapper">
                                                    <div class="text">
                                                        <div class="heading">
                                                            <p>
                                                                {{$product->{'product_'.HelperClass::currentLang()}->title}} {{$category->{'category_'.HelperClass::currentLang()}->name}}
                                                            </p>
                                                        </div>
                                                        <div class="brief-description">
                                                            <p>
                                                               {{$product->{'product_'.HelperClass::currentLang()}->description}}
                                                            </p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="img-div">
                                                    <img src="/storage/uploads/product/{{$product->main_image}}" alt="img">
                                                </div>
                                            </a>
                                        </li>

                                    @endforeach

                                @else

                                 @endif
                            </ul>
                        </div>
                    </div>
            @endforeach
            @else

            @endif

        </div>
    </div>
    <!-- products page -->
@endsection