|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 3.2 KiB |
|
After Width: | Height: | Size: 5.3 KiB |
|
After Width: | Height: | Size: 6.8 KiB |
|
After Width: | Height: | Size: 8.0 KiB |
|
After Width: | Height: | Size: 11 KiB |
@@ -0,0 +1,26 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<img :src="'/skonk/board/top/Quest_Board_top_fleur0006.png'" class="image">
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<style lang="css" scoped>
|
||||||
|
@keyframes fleur {
|
||||||
|
0% {background-image: url(/skonk/board/top/Quest_Board_top_fleur0000.png);}
|
||||||
|
17% {background-image: url(/skonk/board/top/Quest_Board_top_fleur0001.png);}
|
||||||
|
34% {background-image: url(/skonk/board/top/Quest_Board_top_fleur0002.png);}
|
||||||
|
50% {background-image: url(/skonk/board/top/Quest_Board_top_fleur0003.png);}
|
||||||
|
67% {background-image: url(/skonk/board/top/Quest_Board_top_fleur0004.png);}
|
||||||
|
84% {background-image: url(/skonk/board/top/Quest_Board_top_fleur0005.png);}
|
||||||
|
100% {background-image: url(/skonk/board/top/Quest_Board_top_fleur0006.png);}
|
||||||
|
}
|
||||||
|
.animate {
|
||||||
|
animation-duration: 600ms;
|
||||||
|
mask-repeat: no-repeat;
|
||||||
|
animation-name: fleur;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
.image {
|
||||||
|
width: 100%;
|
||||||
|
padding: 15px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -2,6 +2,7 @@
|
|||||||
import Wish from '../components/Wish.vue';
|
import Wish from '../components/Wish.vue';
|
||||||
import {ref, onMounted} from 'vue';
|
import {ref, onMounted} from 'vue';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
import TopFleur from '../components/TopFleur.vue';
|
||||||
|
|
||||||
let interval;
|
let interval;
|
||||||
|
|
||||||
@@ -23,6 +24,7 @@ onMounted(() => {
|
|||||||
|
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
<TopFleur></TopFleur>
|
||||||
<body>
|
<body>
|
||||||
<template v-for="wish in wishes">
|
<template v-for="wish in wishes">
|
||||||
<Wish :wish="wish"/>
|
<Wish :wish="wish"/>
|
||||||
|
|||||||