notxia/notxia.github.io
1
0
Fork 0
mirror of https://github.com/NotXia/notxia.github.io.git synced 2026-05-06 08:46:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add animation

Browse Source
This commit is contained in:
Tian Cheng (Riccardo) Xia
2026-04-14 23:43:49 +02:00
parent fb0c65fba7
commit ba9327b424
1 changed files with 19 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
components/RandomSomething.vue
View File

@@ -1,6 +1,24 @@
<style>
@keyframes float {
0% {
transform: translate(0px, 0px);
}
50% {
transform: translate(-3px, -8px);
}
100% {
transform: translate(0px, 0px);
}
}
.animate-float {
animation: float 5s ease-in-out infinite;
}
</style>
<template> <template>
<div v-if="current_name !== ''" class="w-52"> <div v-if="current_name !== ''" class="w-52">
<img :src="current_image" alt="" class="h-40 max-w-xs max-w- mx-auto" @click="userChangeThing"> <img :src="current_image" alt="" class="h-40 max-w-xs max-w- mx-auto animate-float" @click="userChangeThing">
<p class="text-center text-sm mt-2 select-none">{{ $t(current_name) }}</p> <p class="text-center text-sm mt-2 select-none">{{ $t(current_name) }}</p>
</div> </div>
</template> </template>