@extends('front.layouts.main')

@section('title'){{$news->title}} | Empower @endsection

@section('img-url'){{asset(config('custom.download.url').config('custom.upload.blog.cover_image') .'/'.$news->image)}}@endsection

@section('description'){{ strip_tags(substr($news->long_description, 0,  160)) }}@endsection

@section('content')
<main class="blog-detail-page pt-0">
	<section class="section">
		<div class="container">
			<div class="row">
				<div class="col-lg-9 col-md-8">
					<div class="main-content blog-detail">
						<h1 class="mt-2 mt-sm-0 bold">{{$news->title}}</h1>
						<p class="name small-font-size gray semibold mb-2">By @if($news->author_name) {{$news->author_name}} @else anonymous @endif on {{$news->posted_date_front_formatted}}<span class="gray em-badge ml-2">{{$news->news_category->name}}</span></p>
						<img src="{{asset(config('custom.download.url').config('custom.upload.blog.cover_image') .'/'.$news->image)}}" alt="Empower" class="mb-3" />
						{!! $news->long_description !!}
						<div class="d-flex align-items-center justify-content-between flex-wrap border-top pt-4 mt-4">
							<span class="gray"></span>
							<div class="follow-us d-flex align-items-center justify-content-between flex-wrap">
								<h3 class="mr-3 mb-0">Share this on</h3>
								<ul class="m-0 p-0">
									<li><a href="{{config('laravel-share.services.whatsapp.uri').route('home.newsdetail',['slug' => $news->slug])}}" target="_blank"><img src="{{asset('img/whatsapp-gray.svg')}}" alt="youtube"></a></li>
									<li><a href="{{config('laravel-share.services.facebook.uri').route('home.newsdetail',['slug' => $news->slug])}}" target="_blank"><img src="{{asset('img/facebook.svg')}}" alt="facebook"></a></li>
									<li><a href="{{config('laravel-share.services.twitter.uri').route('home.newsdetail',['slug' => $news->slug])}}" target="_blank"><img src="{{asset('img/twitter.svg')}}" alt="twitter"></a></li>
									<li><a href="{{config('laravel-share.services.linkedin.uri').route('home.newsdetail',['slug' => $news->slug])}}" target="_blank"><img src="{{asset('img/linkedin.svg')}}" alt="linkedin"></a></li>
								</ul>
							</div>
						</div>
					</div>
				</div>

				<div class="col-lg-3 col-md-4 mt-4 mt-md-0">
					<div class="sidebar right" style="top: 105px;">
						<div class="sidebar-menu">
							<div class="title-wrapper">
								<h3 class="h3-title h3">News Categories</h3>
							</div>
							<ul class="m-0 p-0 d-none d-md-block">
								@foreach($newsCategories as $key => $category)
								@if($category->news_count > 0)
								<li><a href="{{route('home.newsOnCategory', ['category' => lcfirst($category->name)])}}">{{ucfirst($category->name)}}</a></li>
								@endif
								@endforeach
							</ul>
							<div class="form-group btm-arrow select d-md-none without-label">
								<select onchange="this.options[this.selectedIndex].value && (window.location = this.options[this.selectedIndex].value);" class="form-control">
									<option value="" hidden>Select</option>
									@foreach($newsCategories as $key => $category)
									@if($category->news_count > 0)
									<option value="{{route('home.newsOnCategory', ['category' => lcfirst($category->name)])}}">{{ucfirst($category->name)}}</option>
									@endif
									@endforeach
								</select>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
	@if(count($similarNews) > 0)
	<section class="section similar-blog">
		<div class="container">
			<div class="row">
				<div class="col-md-12 text-center">
					<h2>Similar News Posts</h2>
				</div>
				@foreach($similarNews as $news)
				<div class="col-md-4 wow zoomIn fast" data-wow-delay="0.1s">
					<div class="blog-img-wrapper">
						<a href="{{route('home.newsdetail',['slug' => $news->slug])}}"><img src="{{asset(config('custom.download.url').config('custom.upload.blog.cover_image') .'/'.$news->image)}}" alt="{{$news->title}}"></a>
					</div>
					<a href="{{route('home.newsdetail',['slug' => $news->slug])}}">
						<p class="gray bold">{{$news->title}}</p>
					</a>
					<p class="name gray small-font-size semibold mb-2">By @if($news->author_name){{$news->author_name}} @else anonymous @endif on {{$news->posted_date_front_formatted}}</p>
					<span class="gray em-badge">{{$news->news_category->name}}</span>
					<a href="{{route('home.newsdetail',['slug' => $news->slug])}}" class="btn btn-transparent float-right mr-2 mb-2">{{ @trans('client_welcome.read_now') }}</a>
				</div>
				@endforeach
			</div>
		</div>
	</section>
	@endif
</main>
@endsection