diff --git a/resources/css/components/article-card.css b/resources/css/components/article-card.css index 62bd1cc..b4b3c56 100644 --- a/resources/css/components/article-card.css +++ b/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; } diff --git a/resources/img/elements/fond-biseau.svg b/resources/img/elements/fond-biseau.svg new file mode 100644 index 0000000..692566f --- /dev/null +++ b/resources/img/elements/fond-biseau.svg @@ -0,0 +1,3 @@ + + + diff --git a/template-parts/dynamiques/article-card.php b/template-parts/dynamiques/article-card.php index 97e89b7..9fd818d 100644 --- a/template-parts/dynamiques/article-card.php +++ b/template-parts/dynamiques/article-card.php @@ -22,7 +22,7 @@ $cover = get_the_post_thumbnail_url($articleID);
  • - + name); ?>
  • @@ -42,6 +42,10 @@ $cover = get_the_post_thumbnail_url($articleID); 'label' => 'Lire la revue', 'target' => '_self', )); ?> - - + \ No newline at end of file