From 361069314ffaa61a81b2189c2eec000a3d1d9c35 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Fri, 17 Sep 2021 22:39:15 +0900
Subject: Refine UI (#7806)

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* Update default.vue

* wip
---
 src/client/components/global/avatar.vue | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)

(limited to 'src/client/components/global')

diff --git a/src/client/components/global/avatar.vue b/src/client/components/global/avatar.vue
index eea970ec9a..395ed5d8ce 100644
--- a/src/client/components/global/avatar.vue
+++ b/src/client/components/global/avatar.vue
@@ -73,6 +73,22 @@ export default defineComponent({
 </script>
 
 <style lang="scss" scoped>
+@keyframes earwiggleleft {
+	from { transform: rotate(37.6deg) skew(30deg); }
+	25% { transform: rotate(10deg) skew(30deg); }
+	50% { transform: rotate(20deg) skew(30deg); }
+	75% { transform: rotate(0deg) skew(30deg); }
+	to { transform: rotate(37.6deg) skew(30deg); }
+}
+
+@keyframes earwiggleright {
+	from { transform: rotate(-37.6deg) skew(-30deg); }
+	30% { transform: rotate(-10deg) skew(-30deg); }
+	55% { transform: rotate(-20deg) skew(-30deg); }
+	75% { transform: rotate(0deg) skew(-30deg); }
+	to { transform: rotate(-37.6deg) skew(-30deg); }
+}
+
 .eiwwqkts {
 	position: relative;
 	display: inline-block;
@@ -132,6 +148,16 @@ export default defineComponent({
 			border-radius: 75% 0 75% 75%;
 			transform: rotate(-37.5deg) skew(-30deg);
 		}
+
+		&:hover {
+			&:before {
+				animation: earwiggleleft 1s infinite;
+			}
+
+			&:after {
+				animation: earwiggleright 1s infinite;
+			}
+		}
 	}
 }
 </style>
-- 
cgit v1.2.3-freya