72 lines
		
	
	
		
			3.5 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
			
		
		
	
	
			72 lines
		
	
	
		
			3.5 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
<x-layout>
 | 
						|
 | 
						|
    <x-slot name="meta">
 | 
						|
        <title>Karudhaas | {{$topic->slug}}</title>
 | 
						|
 | 
						|
        <meta name="description" content="Discover Stories,Daily news and inspiration for maldivian readers." />
 | 
						|
        <meta name=" twitter:title" content="Karudhaas" />
 | 
						|
        <meta name="twitter:description" content="Discover Stories,Daily news and inspiration for maldivian readers." />
 | 
						|
        <meta name="twitter:site" content="https://karudhaas.net" />
 | 
						|
        <meta name="twitter:image" content="/images/ogi.jpg">
 | 
						|
        <meta property="og:locale" content="mv" />
 | 
						|
        <meta property="og:type" content="website" />
 | 
						|
        <meta property="og:title" content="Karudhaas">
 | 
						|
        <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="/images/og.jpg">
 | 
						|
    </x-slot>
 | 
						|
 | 
						|
 | 
						|
    <div>
 | 
						|
        <section class="mx-auto max-w-6xl py-5">
 | 
						|
            <div class="flex flex-col">
 | 
						|
                <div class="flex flex-col md:flex-row justify-center items-center">
 | 
						|
                    <div class="transition-all ease-in-out duration-1000 flex flex-col justify-center">
 | 
						|
                        <div slot="middle-right" class="max-w-xs">
 | 
						|
                            <div class="flex flex-col justify-center h-48 p-3">
 | 
						|
                                <div class="text-5xl text-gray-800 mb-2 text-center MvAamu" style="font-weight: 100;">
 | 
						|
                                    {{$topic->name}}</div>
 | 
						|
                                <div class="text-sm my-3 MvTyper text-center leading-6" style="direction:rtl;">
 | 
						|
                                    {{$topic->name}} އާއިބެހޭ މަޢުލޫމާތުތަށް އެއްތަންކުރެވިފައި</div>
 | 
						|
                            </div>
 | 
						|
                        </div>
 | 
						|
                    </div>
 | 
						|
                </div>
 | 
						|
                <div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-2 mb-10 mt-8">
 | 
						|
 | 
						|
                    @foreach ($articles as $article)
 | 
						|
                    <div class="transition-all ease-in-out duration-1000 flex flex-col justify-center mr-0 md:mr-2">
 | 
						|
 | 
						|
 | 
						|
                        <div slot="bottom-left" class="max-w-xs">
 | 
						|
                            <div class="p-5 shadow-md m-2 mt-4">
 | 
						|
 | 
						|
                                <a
 | 
						|
                                    href="{{route('articles.show',['source' => $article->source->slug, 'guid' => $article->guid])}}">
 | 
						|
                                    <img class="object-scale-down h-30" src="{{$article->featured_image}}"
 | 
						|
                                        alt="{{$article->meta['title']}}">
 | 
						|
                                </a>
 | 
						|
 | 
						|
                                <div class="text-xs font-bold uppercase text-gray-500 text-right mt-1 mb-2 MvTyper">
 | 
						|
                                    {{$article->source->name}}</div>
 | 
						|
 | 
						|
                                <a
 | 
						|
                                    href="{{route('articles.show',['source' => $article->source->slug, 'guid' => $article->guid])}}">
 | 
						|
                                    <div class="text-md font-bold leading-7 mb-2 MvTyper text-right hover:underline">
 | 
						|
                                        {{$article->title}}</div>
 | 
						|
                                </a>
 | 
						|
 | 
						|
                            </div>
 | 
						|
                        </div>
 | 
						|
 | 
						|
 | 
						|
                    </div>
 | 
						|
 | 
						|
                    @endforeach
 | 
						|
                </div>
 | 
						|
            </div>
 | 
						|
        </section>
 | 
						|
    </div>
 | 
						|
 | 
						|
</x-layout> |