commit
6c58920f77
@ -17,7 +17,12 @@
|
|||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
<!-- 移动端菜单按钮 -->
|
<!-- 移动端菜单按钮 -->
|
||||||
<Icon class="menu" size="24" @click="store.mobileOpenState = !store.mobileOpenState">
|
<Icon
|
||||||
|
class="menu"
|
||||||
|
size="24"
|
||||||
|
v-show="!store.backgroundShow"
|
||||||
|
@click="store.mobileOpenState = !store.mobileOpenState"
|
||||||
|
>
|
||||||
<component :is="store.mobileOpenState ? CloseSmall : HamburgerButton" />
|
<component :is="store.mobileOpenState ? CloseSmall : HamburgerButton" />
|
||||||
</Icon>
|
</Icon>
|
||||||
<!-- 页脚 -->
|
<!-- 页脚 -->
|
||||||
@ -178,7 +183,7 @@ onBeforeUnmount(() => {
|
|||||||
.i-icon {
|
.i-icon {
|
||||||
transform: translateY(2px);
|
transform: translateY(2px);
|
||||||
}
|
}
|
||||||
@media (min-width: 720px) {
|
@media (min-width: 721px) {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="cover">
|
<div :class="store.backgroundShow ? 'cover show' : 'cover'">
|
||||||
<img
|
<img
|
||||||
v-show="store.imgLoadStatus"
|
v-show="store.imgLoadStatus"
|
||||||
class="bg"
|
class="bg"
|
||||||
@ -99,6 +99,10 @@ onBeforeUnmount(() => {
|
|||||||
transition: 0.25s;
|
transition: 0.25s;
|
||||||
z-index: -1;
|
z-index: -1;
|
||||||
|
|
||||||
|
&.show {
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
.bg {
|
.bg {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
|
@ -42,7 +42,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 音乐列表弹窗 -->
|
<!-- 音乐列表弹窗 -->
|
||||||
<Transition name="fade">
|
<Transition name="fade" mode="out-in">
|
||||||
<div class="music-list" v-show="musicListShow" @click="musicListShow = false">
|
<div class="music-list" v-show="musicListShow" @click="musicListShow = false">
|
||||||
<Transition name="zoom">
|
<Transition name="zoom">
|
||||||
<div class="list" v-show="musicListShow" @click.stop>
|
<div class="list" v-show="musicListShow" @click.stop>
|
||||||
@ -281,12 +281,6 @@ watch(
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 弹窗动画
|
// 弹窗动画
|
||||||
.fade-enter-active {
|
|
||||||
animation: fade 0.3s ease-in-out;
|
|
||||||
}
|
|
||||||
.fade-leave-active {
|
|
||||||
animation: fade 0.3s ease-in-out reverse;
|
|
||||||
}
|
|
||||||
.zoom-enter-active {
|
.zoom-enter-active {
|
||||||
animation: zoom 0.4s ease-in-out;
|
animation: zoom 0.4s ease-in-out;
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user