From 7469ed243376a13d9bcb463d6d6af445293d7b97 Mon Sep 17 00:00:00 2001
From: Innei <i@innei.in>
Date: Fri, 6 Sep 2024 13:25:04 +0800
Subject: [PATCH] feat: flip for power claim toast

Signed-off-by: Innei <i@innei.in>
---
 src/renderer/src/queries/wallet.tsx         |  2 +-
 src/renderer/src/styles/tailwind-extend.css | 15 +++++++++++++++
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/renderer/src/queries/wallet.tsx b/src/renderer/src/queries/wallet.tsx
index 8d2ca0ae4..de39e1b3c 100644
--- a/src/renderer/src/queries/wallet.tsx
+++ b/src/renderer/src/queries/wallet.tsx
@@ -89,7 +89,7 @@ export const useClaimWalletDailyRewardMutation = () => {
           className="flex items-center gap-1 text-lg"
           onClick={() => settingModalPresent("wallet")}
         >
-          <i className="i-mgc-power" />
+          <i className="i-mgc-power animate-flip" />
         </div>,
         {
           unstyled: true,
diff --git a/src/renderer/src/styles/tailwind-extend.css b/src/renderer/src/styles/tailwind-extend.css
index 682b0c07a..2ceb42f35 100644
--- a/src/renderer/src/styles/tailwind-extend.css
+++ b/src/renderer/src/styles/tailwind-extend.css
@@ -359,3 +359,18 @@
     --spring-duration: 1.157s;
   }
 }
+
+@layer utilities {
+  .animate-flip {
+    animation: flip 0.5s ease-in-out infinite;
+  }
+
+  @keyframes flip {
+    0% {
+      transform: rotateY(0deg);
+    }
+    100% {
+      transform: rotateY(180deg);
+    }
+  }
+}