FEATURE Refining article-card aspect

resources/css/components/article-card.css

@@ -1,12 +1,21 @@
 .article-card {
-  @apply bg-white border border-primary p-6 relative  !flex flex-col;
+  @apply p-6 relative  !flex flex-col pt-16;
 
-  &:after {
-    @apply content-[''] absolute inset-0 border-primary w-full h-full pointer-events-none;
-    border-width: 4px;
-    opacity: 0;
+  svg {
+    @apply absolute top-0 left-0 w-full h-full;
+    z-index: -1;
+    path {
+      stroke-width: 0;
+      vector-effect: non-scaling-stroke;
+    }
   }
+
   &:hover {
+    svg {
+      path {
+        stroke-width: 8px;
+      }
+    }
     &:after {
       opacity: 1;
     }

resources/img/elements/fond-biseau.svg

@@ -0,0 +1,3 @@
+<svg width="595" height="508" viewBox="0 0 595 508" fill="none" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none">
+<path d="M594.5 506.914H0.5V17.2129L594.5 0.513672V506.914Z" fill="white" stroke="#136F63"/>
+</svg>

template-parts/dynamiques/article-card.php

@@ -22,7 +22,7 @@ $cover = get_the_post_thumbnail_url($articleID);
 			<?php foreach ($terms as $term): ?>
 
 				<li class="article-card__tag article-tag">
-					<a href="<?php echo add_query_arg('etiquette', $tag->slug, get_post_type_archive_link('articles')); ?>">
+					<a href="<?php echo add_query_arg('etiquette', $term->slug, get_post_type_archive_link('articles')); ?>">
 						<?php echo esc_html($term->name); ?>
 					</a>
 				</li>
@@ -42,6 +42,10 @@ $cover = get_the_post_thumbnail_url($articleID);
 		'label' => 'Lire la revue',
 		'target' => '_self',
 	)); ?>
-
-
+	<?php
+	$svg_path = get_template_directory() . '/resources/img/elements/fond-biseau.svg';
+	if (file_exists($svg_path)) {
+		echo file_get_contents($svg_path);
+	}
+	?>
 </div>