💄 modification de la disposition des articles sur la landing

Author: mckenziearts

public/css/app.css

@@ -9513,6 +9513,14 @@ html {
 		     column-gap: 0.5rem;
 	}
 
+	.lg\:gap-y-2 {
+		row-gap: 0.5rem;
+	}
+
+	.lg\:gap-y-4 {
+		row-gap: 1rem;
+	}
+
 	.lg\:space-y-0 > :not([hidden]) ~ :not([hidden]) {
 		--tw-space-y-reverse: 0;
 		margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));

resources/views/components/articles/card.blade.php

@@ -11,7 +11,7 @@
             <time datetime="{{ $article->created_at->format('Y-m-d') }}" class="font-sans text-sm leading-5 text-skin-base capitalize">
                 {{ $article->created_at->isoFormat('LL') }}
             </time>
-            <a href="{{ route('articles.show', $article) }}" class="mt-2 inline-flex items-center justify-between group">
+            <a href="{{ route('articles.show', $article) }}" class="mt-2 flex items-center justify-between group">
                 <h4 class="text-lg leading-6 font-semibold font-sans text-skin-inverted group-hover:text-skin-primary">{{ $article->title }}</h4>
                 <x-heroicon-o-external-link class="ml-2.5 h-5 w-5 text-skin-base" />
             </a>

resources/views/components/articles/summary.blade.php

@@ -19,7 +19,7 @@
             </p>
         </div>
         @if ($article->tags->isNotEmpty())
-            <div class="mt-4 flex items-center space-x-2">
+            <div class="mt-2 flex items-center space-x-2">
                 @foreach ($article->tags as $tag)
                     <x-tag :tag="$tag" />
                 @endforeach

resources/views/home.blade.php

@@ -67,7 +67,7 @@
 
             <div class="py-12 lg:py-20">
                 <x-section-header title="Articles Populaires" content="Découvrez les articles les plus appréciés et partagés par les membres de la communauté" />
-                <div class="mt-8 grid gap-6 max-w-xl mx-auto lg:grid-rows-2 lg:grid-flow-col lg:grid-cols-2 lg:gap-y-0 lg:mt-10 lg:gap-x-8 lg:max-w-none">
+                <div class="mt-8 grid gap-6 max-w-xl mx-auto lg:grid-rows-2 lg:grid-flow-col lg:grid-cols-2 lg:mt-10 lg:gap-x-8 lg:max-w-none">
                     @foreach($latestArticles as $article)
                         @if($loop->first)
                             <div class="lg:row-span-2">