add flip card animation

2024-07-22 04:53:59 +00:00
parent b705afd5ff
commit c1175bfb7d
1 changed files with 5 additions and 4 deletions
--- a/themes/common.css
+++ b/themes/common.css
@@ -170,14 +170,15 @@
    padding: 15px;
    margin: 10px;
    flex: 1 0 calc(30% - 5px);
-    transition: opacity 0.1s ease-in-out;
-    opacity: 1;
+    transform: rotateY(0deg);
+    transition: transform 0.1s;
+    transform-style: preserve-3d;
 }
 .welcome-card.show {
-    opacity: 1;
+    transform: rotateY(0deg);
 }
 .welcome-card.hide {
-    opacity: 0;
+    transform: rotateY(90deg);
 }
 .welcome-title {
    font-size: 40px;