Added latest article for single-blog page

resources/sass/home/home.scss

@@ -255,3 +255,40 @@ a {
         border-bottom-left-radius: 0.25rem;
     }
 }
+
+// latest article
+.latest-article {
+    .card {
+        background: transparent;
+        border: none
+    }
+    .card-title {
+        line-height: 2;
+        text-align: justify;
+        color: $primary;
+    }
+    .card-text {
+        text-align: justify;
+    }
+    .author-published-holder {
+        display: flex;
+        align-items: center;
+        margin-bottom: 1.5rem;
+        margin-top: 1rem
+    }
+    .author-avatar {
+        width: 3rem;
+        height: 3rem;
+        border-radius: 50%;
+    }
+    .author-published-text {
+        margin-right: 0.75rem;
+    }
+    .author-name {
+        margin-bottom: 0.625rem;
+    }
+    .published-at {
+        color: lighten($gray, 20);
+        font-size: 80%;
+    }
+}

resources/views/home/single-blog.blade.php

@@ -307,6 +307,42 @@
                 </div>
             </div>
         </div>
+
+        <div class="container my-4">
+            <hr>
+            <div class="latest-article">
+                <h5>
+                    مقالات اخیر
+                </h5>
+                <div class="row">
+                    @for($i=0; $i<3; $i++)
+                        <div class="col-lg-4">
+                            <div class="card">
+                                <div class="card-body">
+                                    <h5 class="card-title">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم</h5>
+                                    <p class="card-text">
+                                        لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت با استفاده از طراحان گرافیک است، چاپگرها با استفاده از طراحان گرافیک است،
+                                    </p>
+                                    <div class="author-published-holder">
+                                        <div class="author-avatar-holder">
+                                            <img class="author-avatar" src="https://beyondco.de/img/marcel.jpg" alt="avater">
+                                        </div>
+                                        <div class="author-published-text">
+                                            <div class="author-name">
+                                                مشخصات نویسنده
+                                            </div>
+                                            <div class="published-at">
+                                                ۱۴۰۰/۰۴/۱۸
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    @endfor
+                </div>
+            </div>
+        </div>
     @endslot
 
     @slot('script')