@extends('frontend.layouts.app')
@if($data['post']->meta_title != '')
    @section('title', $data['post']->meta_title)
@else
    @section('title', $data['post']->heading_content . ' - Blog - ' . app_name())
@endif
@section('meta_keywords', $data['post']->meta_keywords)
@section('meta_description', $data['post']->meta_description)

@section('meta_url', URL::Current())
@section('page_title', $data['post']->meta_title)
@section('product_description',$data['post']->meta_description)
@section('image', URL::to('/'). '/up_data/blog/'. $data['post']->image )
@section('image:width', "1200")
@section('image:height', "630")
@php
    $url = URL::current();
@endphp
@push('head-area')
    <link rel="canonical" href="{{ $url }}" />
    <meta property="og:title" content="{{ $data['post']->heading_content }}">
    <meta property="og:image" content="{{ URL::to('/') }}/up_data/blog/{{ $data['post']->image }}">
    <style>
        h1{
            font-weight: bold;
            font-size: 38px !important;
        }

        h2 { font-size: 28px !important; }
        h3 { font-size: 22px !important; }
        h4 { font-size: 18px !important; }
        h5 { font-size: 16px !important;}
        h6 { font-size: 15px !important;}
       ul{
            margin-left: 35px;
            margin-bottom: 5px;
            line-height: 21px;
       }
    </style>
@endpush
@section('content')
<div class="row">
    <div class="col-md-12 mb-2">
        <div id="main-banner-after-header"  class="bg-buttery-white align-items-center d-flex banner-3 justify-content-center">
        <h1 class="h1-tag category_detail_heading lh-1 title equal-padding" style="font-weight: bold;">
            {{ $data['post']->heading_content }}
        </h1>
        </div>
    </div>
</div>


    @if(isset($data['breadcrumb']))
        <nav aria-label="breadcrumb" class="breadcrumb-nav mt-4 py-3" id="frontend-breadcrumb">
            <div class="container-fluid">
                <ol class="breadcrumb bg-ivory p-2">
                    <li class="breadcrumb-item"><a href="/">Home</a></li>
                    @foreach($data['breadcrumbs'] as $breadcrumb)
                        <li @if($loop->last) class="breadcrumb-item active" aria-current="page" @else class="breadcrumb-item" @endif>@if($data['breadcrumbs'][0] == $breadcrumb)<a href="/blog">{!! $breadcrumb !!}</a> @else {!! $breadcrumb !!} @endif</li>
                    @endforeach
                </ol>
            </div>
        </nav>
        <input type="hidden" id="show_menu" value="no" />
    @else
        <input type="hidden" id="show_menu" value="yes" />
    @endif
<!--  -->
    <section class="blog-page-section with-sidebar">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-8 col-xl-10 left-slide-margin">
                    <div class="blog-post post-details single-block">
                        <div class="blog-content">
                            
                            @if($data['post']->image != '')
                                <img data-src="/up_data/blog/{{ $data['post']->image }}" width="90%" height="auto" class="m-2 img-fluid" alt="{{ $data['post']->heading_content }}">
                            @endif
                            <header class="mb-4 mt-2">
                                {{-- <h1 class="blog-title h2">{{ $data['post']->heading_content }}</h1> --}}
                                <div class="post-meta">
                                    {{-- <span class="post-author">
                                        <i class="fas fa-user"></i>
                                        <span class="text-gray">Posted by : </span>
                                        admin
                                    </span>
                                    <span class="post-separator">|</span> --}}
                                    <span class="post-date post_date_content" style="margin-left: 8px;">
                                        <i class="zmdi zmdi-calendar"></i>
                                        <span class="text-gray ">On : </span>
                                        {{ date('M d, Y', strtotime($data['post']->publish_date)) }}
                                    </span>
                                </div>
                            </header>
                            <article style="width: 90%; margin-left: 8px;" class="blog_detail_article">
                                @php
                                    $size = str_replace("<img","<img width='600' height='600'",$data['post']->full_content);
                                    $size = str_replace("<tr","<tr style='border:1px solid black;'",$data['post']->full_content);
                                    echo $size;
                                @endphp
                                {{-- {!! $data['post']->full_content !!} --}}
                            </article>
                            <div class="addthis_inline_share_toolbox"></div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-xl-2" style=" left: -1%; position: relative;">
                    <div class="sidebar-widget">
                        @if($data['recent_posts'])
                            <div class="single-sidebar">
                                <h3 class="sidebar-title h2 mt-2">Recent Posts</h3>
                                <div class="recent_post_section" style="margin-top: 57px;">
                                    @foreach($data['recent_posts'] as $rp)
                                        <div class="text-center recent_post_detail">
                                            <a href="/blog/{{ $rp->slug }}"><img data-src="/up_data/blog/{{ $rp->image_thumbnail }}" title="{{ $rp->name }}" alt="{{ $rp->name }}" width="263" height="146" class="img-fluid img-thumbnail" /></a>
                                            <a href="/blog/{{ $rp->slug }}" class="recent_post_title">{{ $rp->name }}</a>
                                        </div>
                                        <hr>
                                    @endforeach
                                </div>
                            </div>
                        @endif
                        <div class="single-sidebar">
                            {!! \App\Models\Banner::showBanner(8) !!}
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="social-link" style="padding-left: 35px;">
            <span style="padding-left: 35px;">                
                Share on
            </span>
            <ul class="d-flex gap-4">
                <li class="facebook">
                    <a href="https://www.facebook.com/sharer/sharer.php?u={{ urlencode('https://www.germedusa.com/blog/'.$data['post']->slug) }}" data-bs-toggle="tooltip" style="background: #3b579d;" class="d-flex justify-content-center px-1 py-1 rounded-5" target="_blank" style="max-width:22px;" title="Facebook">
                        <i class="icon-social-facebook text-white"></i>
                        <!-- <img src="{{asset('design/assets/images/icons/facebook.svg')}}" alt="facebook-icon" width="30"> -->
                    </a>
                </li>
                <li class="twitter" style="">
                    <a href="https://twitter.com/intent/tweet?url={{ urlencode('https://www.germedusa.com/blog/'.$data['post']->slug) }}&text={{ urlencode($data['post']->slugle) }}" style="max-width: 30px; width: 30px; max-height: 30px; height: 30px;" class="d-flex justify-content-center px-1 py-1 rounded-5 bg-black" data-bs-toggle="tooltip" target="_blank" style="max-width:22px;" title="Twitter">
                        
                    <svg xmlns="http://www.w3.org/2000/svg" style="width: 17px;  height: 20px;margin-bottom: 6px;" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 512 462.799"><path fill="#fff" fill-rule="nonzero" d="M403.229 0h78.506L310.219 196.04 512 462.799H354.002L230.261 301.007 88.669 462.799h-78.56l183.455-209.683L0 0h161.999l111.856 147.88L403.229 0zm-27.556 415.805h43.505L138.363 44.527h-46.68l283.99 371.278z"/></svg>
                       {{-- <img src="{{asset('design/assets/images/icons/social_Twitter.png')}}" alt="twitter-icon" width="30"> --}}
                    </a>
                </li>
                <li class="linkedin" style="margin-top: 6px;">
                    <a href="https://www.linkedin.com/shareArticle?url={{ urlencode('https://www.germedusa.com/blog/'.$data['post']->slug) }}&title={{ urlencode($data['post']->slugle) }}" style="max-width: 30px; width: 30px; max-height: 20px; height: 20px;" data-bs-toggle="tooltip" target="_blank" style="max-width:22px;" title="Linkedin">
                        <i class="icon-social-linkedin px-1 py-1 rounded-5 text-white" style="background: #0077b7; width: 17px;  height: 19px;margin-bottom: 6px;" ></i>
                        <!-- <img src="{{asset('design/assets/images/icons/social_Linkedin.png')}}" alt="linkedin-icon" width="30"> -->
                    </a>
                </li>
            </ul>
        </div>
    </section>
    @push('before-scripts')
        <input type="hidden" value="blog" id="page_id">
    @endpush
    @push('after-scripts')
        <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ariez81"></script>
    @endpush
@endsection