Files
karudhaas/resources/views/articles/show.blade.php
2020-08-23 00:53:15 +05:00

97 lines
4.6 KiB
PHP

@extends('layouts.app')
@section('meta')
<title>{{$article->meta['title']}} | Karudhaas</title>
<meta name="description" content="Discover Stories,Daily news and inspiration for maldivian readers." />
<meta name=" twitter:title" content="{{$article->meta['title']}}" />
<meta name="twitter:description" content="Discover Stories,Daily news and inspiration for maldivian readers." />
<meta name="twitter:site" content="https://baraveli-news.baraveli.xyz/" />
<meta name="twitter:image" content="{{$article->featured_image}}">
<meta property="og:locale" content="mv" />
<meta property="og:type" content="website" />
<meta property="og:title" content="{{$article->meta['title']}}">
<meta property="og:description" content="Discover Stories,Daily news and inspiration for maldivian readers." />
<meta property="og:url" content="https://karudhaas.net/" />
<meta property="og:site_name" content="karudhaas.net" />
<meta property="og:image" content="{{$article->featured_image}}">
@endsection
@section('content')
<div>
<div class="mb-4 md:mb-0 w-full max-w-screen-md mx-auto relative" style="height: 24em;">
<div class="absolute left-0 bottom-0 w-full h-full z-10"
style="background-image: url({{$article->featured_image}}); filter: brightness(50%);"></div>
<div class="p-4 absolute bottom-0 right-0 z-20">
<h2 class="text-3xl text-gray-100 leading-relaxed text-right MvAamu" style="direction:rtl; font-weight: 100;">
{{$article->title}}</h2>
<div class="flex justify-end mt-3">
<img src="{{$article->source->logo}}" class="h-10 w-10 rounded-full mr-2 object-cover" />
<div>
<p class="font-semibold text-gray-200 text-md MvTyper">{{$article->source->name}}</p>
<p class="font-semibold text-gray-400 text-xs MvTyper" style="direction: rtl;">
{{$article->published_date->locale('dv')->isoFormat('Do MMMM YYYY | dddd | h:mm')}}</p>
</div>
</div>
</div>
</div>
<div class="px-4 lg:px-0 mt-5 text-gray-700 max-w-screen-md mx-auto text-lg leading-relaxed">
<div class="flex justify-end mb-5 border-b">
<form action="{{route('mylist.store', $article->id)}}" method="POST">
@csrf
<button type="submit"
class="flex items-center justify-center mb-2 shadow p-1 rounded hover:shadow-lg cursor-pointer">
<p class="text-gray-700 text-sm MvTyper text-right mr-2">
ރައްކާކުރޭ
</p>
<svg class="h-5 w-5 text-gray-800" fill="currentcolor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<g data-name="Froppy disk">
<path
d="M61.707 10.293l-8-8A1 1 0 0053 2H7a5.006 5.006 0 00-5 5v50a5.006 5.006 0 005 5h50a5.006 5.006 0 005-5V11a1 1 0 00-.293-.707zM48 4v16a1 1 0 01-1 1H17a1 1 0 01-1-1V4zM10 60V35a3 3 0 013-3h38a3 3 0 013 3v25zm50-3a3 3 0 01-3 3h-1V35a5.006 5.006 0 00-5-5H13a5.006 5.006 0 00-5 5v25H7a3 3 0 01-3-3V7a3 3 0 013-3h7v16a3 3 0 003 3h30a3 3 0 003-3V4h2.586L60 11.414z" />
<path
d="M39 19h6a1 1 0 001-1V7a1 1 0 00-1-1h-6a1 1 0 00-1 1v11a1 1 0 001 1zm1-11h4v9h-4zM47 45H17a1 1 0 000 2h30a1 1 0 000-2zM47 39H17a1 1 0 000 2h30a1 1 0 000-2zM47 51H17a1 1 0 000 2h30a1 1 0 000-2z" />
</g>
</svg>
</button>
</form>
</div>
@foreach ($article->body as $key => $block)
<p class="MvTyper text-right" style="direction:rtl;">
{{$block}}
<br>
<br>
@break($key == 2)
</p>
@endforeach
<div class="flex justify-center mb-4">
<div class="flex flex-col items-center">
<svg class="animate-bounce w-6 h-6 text-gray-900" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor">
<path d="M19 14l-7 7m0 0l-7-7m7 7V3"></path>
</svg>
<a href="{{$article->url}}" target="_blank" class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-normal py-2 px-4 rounded inline-flex items-center mb-2">
<span class="text-gray-700">View the full article on {{ucfirst($article->source->slug)}}</span>
</a>
</div>
</div>
<div class="border-b"></div>
<h5 class="MvTyper text-md font-bold text-center mb-2 mt-2">މައުޟޫޢުތަށް</h5>
<div class="flex flex-wrap items-center justify-center">
@foreach ($article->topics as $topic)
<a href="{{route('topics.show', $topic->slug)}}"
class="mt-4 mr-2 no-underline hover:border-gray-900 hover:text-gray-900 hover:bg-white border text-sm font-bold topics px-3 py-2 rounded MvTyper">
{{$topic->name}}
</a>
@endforeach
</div>
</div>
</div>
</div>
@endsection