From 943f1e9b4f2d6c0d91b560eab26790f15d9b6212 Mon Sep 17 00:00:00 2001
From: ThatOneCalculator <kainoa@t1c.dev>
Date: Sat, 17 Dec 2022 18:31:11 -0800
Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=A5=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                        |  2 +-
 packages/client/src/pages/about.vue | 35 ++++++++++++++++++++++-------
 2 files changed, 28 insertions(+), 9 deletions(-)

diff --git a/package.json b/package.json
index 601a77ca9..a7aa85be2 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "calckey",
-	"version": "13.0.5-rc.7",
+	"version": "13.0.5-rc.8",
 	"codename": "aqua",
 	"repository": {
 		"type": "git",
diff --git a/packages/client/src/pages/about.vue b/packages/client/src/pages/about.vue
index d56fe1b78..f974de33f 100644
--- a/packages/client/src/pages/about.vue
+++ b/packages/client/src/pages/about.vue
@@ -14,7 +14,7 @@
 				<div class="_formRoot">
 					<div class="_formBlock fwhjspax" :style="{ backgroundImage: `url(${ $instance.bannerUrl })` }">
 						<div class="content">
-							<img ref="instanceIcon" :src="$instance.iconUrl || $instance.faviconUrl || '/favicon.ico'" aria-label="none" class="icon" @click="easterEgg"/>
+							<img ref="instanceIcon" :src="$instance.iconUrl || $instance.faviconUrl || '/favicon.ico'" aria-label="none" class="icon" :class="instanceIconAnimation" @click="easterEgg"/>
 							<div class="name">
 								<b>{{ $instance.name || host }}</b>
 							</div>
@@ -174,17 +174,17 @@ async function sleep(seconds) {
 
 function easterEgg() {
 	iconClicks++;
-	instanceIconAnimation = 'none';
-	console.log(iconClicks);
+	instanceIconAnimation = 'noAnimation';
+	console.log(instanceIconAnimation);
 	sleep(0.1);
 	const normalizedCount = (iconClicks % 3) + 1;
-	instanceIconAnimation = `iconShake${normalizedCount} 0.${normalizedCount}s`;
+	instanceIconAnimation = `shake${normalizedCount}`;
 	if (iconClicks % 3 === 0) {
-		console.log('here');
 		defaultStore.state.woozyMode = !defaultStore.state.woozyMode;
 		sleep(0.4);
-		instanceIconAnimation = 'none';
-		instanceIconAnimation = 'swpinY 0.9s';
+		instanceIconAnimation = 'noAnimation';
+		instanceIconAnimation = 'doSpinY';
+		console.log(instanceIconAnimation);
 		if (iconClicks % 6 === 0) {
 			instanceIcon.src = instance.iconUrl || instance.faviconUrl || '/favicon.ico'
 		}
@@ -274,7 +274,26 @@ function syncSlide(index) {
 			margin: 16px auto 0 auto;
 			height: 64px;
 			border-radius: 8px;
-			animation: v-bind('instanceIconAnimation');
+
+			&.noAnimation {
+				animation: none;
+			}
+
+			&.shake1 {
+				animation: iconShake1 0.1s 1;
+			}
+
+			&.shake2 {
+				animation: iconShake2 0.2s 1;
+			}
+
+			&.shake3 {
+				animation: iconShake3 0.3s 1;
+			}
+
+			&.doSpinY {
+				animation: spinY 0.9s 1;
+			}
 		}
 
 		> .name {