diff --git a/resources/css/components/article-card.css b/resources/css/components/article-card.css index 58d51c2..b066987 100644 --- a/resources/css/components/article-card.css +++ b/resources/css/components/article-card.css @@ -1,6 +1,37 @@ .article-card { - @apply bg-white border border-primary p-4; + @apply bg-white border border-primary p-6 relative; + &:after { + @apply content-[''] absolute inset-0 border-primary w-full h-full pointer-events-none; + border-width: 4px; + opacity: 0; + } + &:hover { + &:after { + opacity: 1; + } + .article-card__link-button { + svg { + @apply translate-x-2; + } + } + } + &__link-button { + @apply block mt-8; + width: 100px; + height: 100px; + svg { + transition: transform 0.3s ease-in-out; + + path, + circle { + @apply stroke-primary; + } + } + } + .content-meta { + @apply text-primary; + } &__title { @apply text-3xl font-medium uppercase pb-4; }