animations is the most important part of this project

2024-04-12 20:22:57 +03:00
parent 2a781e9603
commit f887d5ef07
4 changed files with 39 additions and 2 deletions
--- a/frontend/app/src/components/styles.css
+++ b/frontend/app/src/components/styles.css
@ -8,7 +8,23 @@
  background-color: #001529;
 }

+@keyframes cardPopup {
+  0% {
+    transform: translateY(20%);
+    opacity: 0%;
+  }
+  50% {
+    opacity: 20%;
+    transform: translateY(3%);
+  }
+  100% {
+    transform: translateY(0);
+    opacity: 100%;
+  }
+}
+
 .card {
+  animation: 0.5s ease-out 0s 1 cardPopup;
  background: #001529;
  margin-top: 0.5rem;
  margin-right: 1rem;