video_app/pages/pause/pause.vue

69 lines
1.2 KiB
Vue

<template>
<view class="u-flex u-flex-col min-page">
<view class="u-p-30 w-full u-flex u-p-r-30">
<image class="img w-full" src="/static/pause.png" mode="aspectFit"></image>
</view>
<view class="u-m-t-16 text">
<text class="ani1" v-for="(item,index) in text" :key="index">{{item}}</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
text: '系统更新维护中……',
time: 10
}
},
methods: {
}
}
</script>
<style lang="scss" scoped>
@keyframes ani {
0% {
transform: scale(0.9);
}
100% {
transform: scale(1);
}
}
@keyframes ani1 {
0% {
transform: scale(1);
}
50% {
transform: scale(1.5);
}
100%{
transform: scale(1);
}
}
.img {
animation: ani 5s ease-in-out infinite alternate;
}
.min-page {
min-height: 100vh;
justify-content: center;
align-items: center;
}
.text {
transform-origin: center center;
animation: ani1 5s ease-in-out infinite alternate;
font-size: 20px;
font-weight: bold;
color: #fff;
text-shadow: 0 0 1px rgba(255, 117, 129, .9), 0 0 3px rgba(255, 117, 129, .5), 0 0 6px rgba(255, 117, 129, .2), 0 0 10px #999;
}
</style>