From ce743054d6585817071721a0f92f47e8c67d9d57 Mon Sep 17 00:00:00 2001
From: syuilo <syuilotan@yahoo.co.jp>
Date: Sun, 29 Nov 2020 22:37:56 +0900
Subject: [PATCH] :art:

---
 package.json                       |  1 +
 src/client/pages/about-misskey.vue | 12 +++++++++++-
 yarn.lock                          |  5 +++++
 3 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 86204bb389..8fa803ce51 100644
--- a/package.json
+++ b/package.json
@@ -239,6 +239,7 @@
 		"url-loader": "4.1.1",
 		"uuid": "8.3.1",
 		"v-debounce": "0.1.2",
+		"vanilla-tilt": "1.7.0",
 		"vue": "3.0.3",
 		"vue-color": "2.7.1",
 		"vue-draggable-next": "1.0.8",
diff --git a/src/client/pages/about-misskey.vue b/src/client/pages/about-misskey.vue
index 2f79936226..7e673de0be 100644
--- a/src/client/pages/about-misskey.vue
+++ b/src/client/pages/about-misskey.vue
@@ -2,7 +2,7 @@
 <FormBase class="znqjceqz">
 	<section class="_formItem">
 		<div class="_formPanel" style="text-align: center; padding: 16px;">
-			<img src="/assets/icons/512.png" alt="" style="display: block; width: 100px; margin: 0 auto; border-radius: 16px;"/>
+			<img src="/assets/icons/512.png" alt="" style="display: block; width: 100px; margin: 0 auto; border-radius: 16px;" ref="icon"/>
 			<div style="margin-top: 0.75em;">Misskey</div>
 			<div style="opacity: 0.5;">v{{ version }}</div>
 		</div>
@@ -38,6 +38,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import { faInfoCircle, faCode, faLanguage, faHandHoldingMedical, } from '@fortawesome/free-solid-svg-icons';
+import VanillaTilt from 'vanilla-tilt';
 import { version } from '@/config';
 import FormLink from '@/components/form/link.vue';
 import FormBase from '@/components/form/base.vue';
@@ -105,6 +106,15 @@ export default defineComponent({
 			faInfoCircle, faCode, faLanguage, faHandHoldingMedical,
 		}
 	},
+
+	mounted() {
+		VanillaTilt.init(this.$refs.icon, {
+			max: 30,
+			perspective: 500,
+			scale: 1.125,
+			speed: 1000,
+		});
+	},
 });
 </script>
 
diff --git a/yarn.lock b/yarn.lock
index cffe7b47a3..1cefe0ecf9 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10272,6 +10272,11 @@ value-or-function@^3.0.0:
   resolved "https://registry.yarnpkg.com/value-or-function/-/value-or-function-3.0.0.tgz#1c243a50b595c1be54a754bfece8563b9ff8d813"
   integrity sha1-HCQ6ULWVwb5Up1S/7OhWO5/42BM=
 
+vanilla-tilt@1.7.0:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/vanilla-tilt/-/vanilla-tilt-1.7.0.tgz#4e6d3c6442c6fa2b45c958c9c2013f31686ab461"
+  integrity sha512-u9yUhpSasFeqQCuiTon+RSb0aHzcj9stvWVXQIswzKL5oG491lkYk7U1GmhOAEZt7yPT6EiYZRJhIh2MFBncOA==
+
 vary@^1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc"