Topic View
This commit is contained in:
22
app/Http/Controllers/TopicsController.php
Normal file
22
app/Http/Controllers/TopicsController.php
Normal file
@@ -0,0 +1,22 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Controllers;
|
||||
|
||||
use Illuminate\Http\Request;
|
||||
use App\Topic;
|
||||
|
||||
class TopicsController extends Controller
|
||||
{
|
||||
/**
|
||||
* Load a single Topic view
|
||||
*
|
||||
* @param mixed $topic
|
||||
* @return void
|
||||
*/
|
||||
public function show(Topic $topic)
|
||||
{
|
||||
return view('topics.show', [
|
||||
'topic' => $topic->load('articles')
|
||||
]);
|
||||
}
|
||||
}
|
26
public/css/styles.css
vendored
Normal file
26
public/css/styles.css
vendored
Normal file
@@ -0,0 +1,26 @@
|
||||
@font-face {
|
||||
font-family: "mvtyper";
|
||||
src: url("/fonts/mvtyper.ttf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Mvaamu";
|
||||
src: url("/fonts/mv-aammu-fk.ttf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "MvWaheed";
|
||||
src: url("/fonts/mv_waheed.otf");
|
||||
}
|
||||
|
||||
.MvAamu {
|
||||
font-family: "Mvaamu";
|
||||
}
|
||||
|
||||
.MvTyper {
|
||||
font-family: "mvtyper";
|
||||
}
|
||||
|
||||
.MvWaheed {
|
||||
font-family: "MvWaheed";
|
||||
}
|
2
public/js/app.js
vendored
2
public/js/app.js
vendored
@@ -20071,7 +20071,7 @@ var render = function() {
|
||||
"a",
|
||||
{
|
||||
staticClass: "block w-full lg:flex mb-10 shadow rounded-lg",
|
||||
attrs: { href: "" }
|
||||
attrs: { href: "/article/" + story.id }
|
||||
},
|
||||
[
|
||||
_c(
|
||||
|
@@ -13,7 +13,7 @@
|
||||
<div class="w-full lg:w-2/3">
|
||||
<div v-for="story in recentStories" :key="story.id">
|
||||
<a
|
||||
href=""
|
||||
:href="'/article/' + story.id"
|
||||
class="block w-full lg:flex mb-10 shadow rounded-lg"
|
||||
>
|
||||
<div
|
||||
|
@@ -3,8 +3,8 @@
|
||||
@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 image-dark"
|
||||
style="background-image: url({{$article->featured_image}});"
|
||||
<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 font-semibold text-gray-100 leading-relaxed text-right MvAamu" style="direction:rtl;">{{$article->title}}</h2>
|
||||
|
@@ -6,33 +6,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<link rel="stylesheet" href="/css/app.css">
|
||||
<style>
|
||||
@font-face {
|
||||
font-family: "mvtyper";
|
||||
src: url("/fonts/mvtyper.ttf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Mvaamu";
|
||||
src: url("/fonts/mv-aammu-fk.ttf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "MvWaheed";
|
||||
src: url("/fonts/mv_waheed.otf");
|
||||
}
|
||||
.MvAamu {
|
||||
font-family: "Mvaamu";
|
||||
}
|
||||
|
||||
.MvTyper {
|
||||
font-family: "mvtyper";
|
||||
}
|
||||
|
||||
.MvWaheed {
|
||||
font-family: "MvWaheed";
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="/css/styles.css">
|
||||
|
||||
|
||||
</head>
|
||||
|
59
resources/views/topics/show.blade.php
Normal file
59
resources/views/topics/show.blade.php
Normal file
@@ -0,0 +1,59 @@
|
||||
@extends('layouts.app')
|
||||
|
||||
@section('content')
|
||||
<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>
|
||||
<div class="transition-all ease-in-out duration-1000 flex flex-col justify-center"></div>
|
||||
<div class="transition-all ease-in-out duration-1000 flex flex-col justify-center"></div>
|
||||
</div>
|
||||
<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 font-bold text-gray-800 mb-2 text-center MvAamu">{{$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 ($topic->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', $article->id)}}">
|
||||
<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', $article->id)}}">
|
||||
<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>
|
||||
@endsection
|
@@ -4,6 +4,8 @@ use Illuminate\Http\Request;
|
||||
use Illuminate\Support\Facades\Route;
|
||||
use App\Article;
|
||||
use App\Http\Controllers\ArticlesController;
|
||||
use App\Http\Controllers\TopicsController;
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
| Web Routes
|
||||
@@ -20,6 +22,7 @@ Route::get('/', function(){
|
||||
});
|
||||
|
||||
Route::get('/article/{article:id}', [ArticlesController::class,'show'])->name('articles.show');
|
||||
Route::get('/topic/{topic:slug}', [TopicsController::class,'show'])->name('topics.show');
|
||||
|
||||
Route::get('/ogimage', function(Request $request) {
|
||||
|
||||
|
Reference in New Issue
Block a user