From 7940d344c4c7649a3c8337a949d819c7398fdbbc Mon Sep 17 00:00:00 2001
From: tutaru99 <simas.raudonis@gmail.com>
Date: Tue, 2 Jul 2024 17:41:35 +0200
Subject: [PATCH] Cute button arrow transitions on hover news cards

---
 components/base/NewsCard.vue | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/components/base/NewsCard.vue b/components/base/NewsCard.vue
index e706f77..ad5d64a 100644
--- a/components/base/NewsCard.vue
+++ b/components/base/NewsCard.vue
@@ -75,6 +75,14 @@ const cardBodyText: any = ref(stripHtmlFromString(props.data.body) || '');
       transform: scale(1.2);
       transition: transform 5s;
     }
+
+    .news-card__footer-button {
+      opacity: 0.8;
+    }
+
+    .news-card__button-icon {
+      animation: transformArrow 0.5s ease-in-out alternate;
+    }
   }
 
   :deep(img) {
@@ -208,4 +216,15 @@ const cardBodyText: any = ref(stripHtmlFromString(props.data.body) || '');
     }
   }
 }
+@keyframes transformArrow {
+  0% {
+    transform: translateX(0);
+  }
+  50% {
+    transform: translateX(4px);
+  }
+  100% {
+    transform: translateX(0);
+  }
+}
 </style>