use class binding on class

yasuharuokazaki · Aug 15, 2021 · 15dec86 · 15dec86
1 parent ba5e239
commit 15dec86
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 54 deletions.
diff --git a/app/Http/Kernel.php b/app/Http/Kernel.php
@@ -21,7 +21,7 @@ class Kernel extends HttpKernel
         \Illuminate\Foundation\Http\Middleware\ValidatePostSize::class,
         \App\Http\Middleware\TrimStrings::class,
         \Illuminate\Foundation\Http\Middleware\ConvertEmptyStringsToNull::class,
-        \App\Http\Middleware\GetIsMobile::class,
+        // \App\Http\Middleware\GetIsMobile::class,
     ];
 
     /**

diff --git a/database/factories/CategoryFactory.php b/database/factories/CategoryFactory.php
@@ -22,7 +22,7 @@ class CategoryFactory extends Factory
     public function definition()
     {
         return [
-            'name'=> $this->faker->word(),
+            'name'=> $this->faker->unique()->word(),
             'slug'=> $this->faker->slug(),
         ];
     }

diff --git a/database/seeders/DatabaseSeeder.php b/database/seeders/DatabaseSeeder.php
@@ -18,11 +18,11 @@ public function run()
     {
 
         User::factory()->create([
-            'name'=>'Yasu Oka'
+            // 'name'=>'Yasu Oka'
         ]);
 
         Post::factory(5)->create([
-            'user_id'=>1,
+            // 'user_id'=>1,
         ]);
 
     }

diff --git a/resources/views/components/post-card.blade.php b/resources/views/components/post-card.blade.php
@@ -1,5 +1,7 @@
+         @props(['post'])
+
             <article
-                class="transition-colors duration-300 hover:bg-gray-100 border border-black border-opacity-0 hover:border-opacity-5 rounded-xl">
+                {{ $attributes->merge(['class'=>"transition-colors duration-300 hover:bg-gray-100 border border-black border-opacity-0 hover:border-opacity-5 rounded-xl"]) }}>
                 <div class="py-6 px-5 ">
                     <div>
                         <img src="/images/illustration-3.png" alt="Blog Post illustration" class="rounded-xl">
@@ -8,48 +10,41 @@ class="transition-colors duration-300 hover:bg-gray-100 border border-black bord
                     <div class="mt-8 flex flex-col justify-between">
                         <header>
                             <div class="space-x-2">
-                                <a href="#"
-                                   class="px-3 py-1 border border-blue-300 rounded-full text-blue-300 text-xs uppercase font-semibold"
-                                   style="font-size: 10px">Techniques</a>
-                                <a href="#"
+
+                                <a href="{{ $post->category->slug }}"
                                    class="px-3 py-1 border border-red-300 rounded-full text-red-300 text-xs uppercase font-semibold"
-                                   style="font-size: 10px">Updates</a>
+                                   style="font-size: 10px">{{ $post->created_at->diffForHumans() }}</a>
                             </div>
 
                             <div class="mt-4">
                                 <h1 class="text-3xl">
-                                    This is a big title and it will look great on two or even three lines. Wooohoo!
+                                    {{ $post->excerpt }}
                                 </h1>
 
                                 <span class="mt-2 block text-gray-400 text-xs">
-                                    Published <time>1 day ago</time>
+                                    Published <time>{{ $post->created_at->diffForHumans() }}</time>
                                 </span>
                             </div>
                         </header>
 
                         <div class="text-sm mt-4">
                             <p>
-                                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt
-                                ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
-                                ullamco laboris nisi ut aliquip ex ea commodo consequat.
+                                {{ $post->body }}
                             </p>
 
-                            <p class="mt-4">
-                                Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
-                            </p>
                         </div>
 
                         <footer class="flex justify-between items-center mt-8">
                             <div class="flex items-center text-sm">
                                 <img src="/images/lary-avatar.svg" alt="Lary avatar">
                                 <div class="ml-3">
-                                    <h5 class="font-bold">Lary Laracore</h5>
+                                    <h5 class="font-bold">{{ $post->author->name }}</h5>
                                     <h6>Mascot at Laracasts</h6>
                                 </div>
                             </div>
 
                             <div>
-                                <a href="#"
+                                <a href="/posts/{{ $post->slug }}"
                                    class="transition-colors duration-300 text-xs font-semibold bg-gray-200 hover:bg-gray-300 rounded-full py-2 px-8"
                                 >Read More</a>
                             </div>

diff --git a/resources/views/posts.blade.php b/resources/views/posts.blade.php
@@ -3,42 +3,25 @@
     @include('_posts-header')
 
     <main class="max-w-6xl mx-auto mt-6 lg:mt-20 space-y-6">
-
-        <x-post-featured-card :post="$posts[0]" />
-
-        <div class="lg:grid lg:grid-cols-2">
-            @foreach ($posts->skip(1) as $post)
-                <x-post-card :post="$post"/>
-            @endforeach    
-        </div>
-
-
-    </main>
-
-    {{-- @foreach ($posts as $post) 
-        
-        <article >
-
-                <h1>
-                    <a href="/posts/{{ $post->slug }}">
-                        
-                        {!! $post->title; !!}
-                    
-                    </a>
-                </h1>
-
-                 <p>
-                    By<a href="/authors/{{ $post->author->username }}"> {{ $post->author->name }} </a> in  <a href="/categories/{{ $post->category->slug }}"> {{ $post->category->name }} </a>
-                 </p>
-
-                <div>
-                    {!! $post->excerpt; !!}
+        @if ($posts->count())
+            <x-post-featured-card :post="$posts[0]" />
+
+            @if ($posts->count()>1)
+                <div class="lg:grid lg:grid-cols-6">
+                    @foreach ($posts->skip(1) as $post)
+                        @dd($loop)
+                        <x-post-card :post="$post" class="col-span-2"/>
+                    @endforeach    
                 </div>
+            @endif
+        @else
+            <p class="text-center">
+                No posts yet. Please check back later.
+            </p>
+        @endif
+    </main>
 
-        </article> --}}
-
-    {{-- @endforeach --}}
-
+
 
 </x-layout>