diff --git a/src/renderer/components/MusicList.vue b/src/renderer/components/MusicList.vue index bbc951e..631bc50 100644 --- a/src/renderer/components/MusicList.vue +++ b/src/renderer/components/MusicList.vue @@ -313,4 +313,13 @@ watch( .double-item { @apply mb-2 bg-light-100 bg-opacity-20 dark:bg-dark-100 dark:bg-opacity-20 rounded-3xl; } + +.mobile { + .music-info { + @apply hidden; + } + .music-list-content { + @apply pb-[100px]; + } +} diff --git a/src/renderer/layout/AppLayout.vue b/src/renderer/layout/AppLayout.vue index a3fe837..1cce800 100644 --- a/src/renderer/layout/AppLayout.vue +++ b/src/renderer/layout/AppLayout.vue @@ -21,11 +21,11 @@ - + - + diff --git a/src/renderer/layout/components/MusicFull.vue b/src/renderer/layout/components/MusicFull.vue index 1c1cdd3..0ef1926 100644 --- a/src/renderer/layout/components/MusicFull.vue +++ b/src/renderer/layout/components/MusicFull.vue @@ -35,8 +35,8 @@ class="music-lrc" style="height: 60vh" :native-scrollbar="false" - @mouseover="mouseOverLayout" - @mouseleave="mouseLeaveLayout" + @mouseover="!isMobile ? mouseOverLayout : null" + @mouseleave="!isMobile ? mouseLeaveLayout : null" >
-
+
@@ -294,6 +294,7 @@ const musicFullVisible = ref(false); // 设置musicFull const setMusicFull = () => { musicFullVisible.value = !musicFullVisible.value; + store.commit('setMusicFull', musicFullVisible.value); }; const palyListRef = useTemplateRef('palyListRef'); @@ -432,8 +433,7 @@ const openLyricWindow = () => { .mobile { .music-play-bar { - @apply px-4; - bottom: 70px; + @apply px-4 bottom-[70px] transition-all duration-300; } .music-time { display: none; diff --git a/src/renderer/store/index.ts b/src/renderer/store/index.ts index 526097f..f90bf9f 100644 --- a/src/renderer/store/index.ts +++ b/src/renderer/store/index.ts @@ -37,6 +37,7 @@ interface State { favoriteList: number[]; playMode: number; theme: ThemeType; + musicFull: boolean; } const state: State = { @@ -55,7 +56,8 @@ const state: State = { searchType: 1, favoriteList: getLocalStorageItem('favoriteList', []), playMode: getLocalStorageItem('playMode', 0), - theme: getCurrentTheme() + theme: getCurrentTheme(), + musicFull: false }; const { handlePlayMusic, nextPlay, prevPlay } = useMusicListHook(); @@ -73,6 +75,9 @@ const mutations = { setPlayMusic(state: State, play: boolean) { state.play = play; }, + setMusicFull(state: State, musicFull: boolean) { + state.musicFull = musicFull; + }, setPlayList(state: State, playList: SongResult[]) { state.playListIndex = playList.findIndex((item) => item.id === state.playMusic.id); state.playList = playList; diff --git a/src/renderer/views/list/index.vue b/src/renderer/views/list/index.vue index 8a5deb0..19a6571 100644 --- a/src/renderer/views/list/index.vue +++ b/src/renderer/views/list/index.vue @@ -18,7 +18,7 @@
- +
diff --git a/src/renderer/views/mv/index.vue b/src/renderer/views/mv/index.vue index 0add1e7..3659c64 100644 --- a/src/renderer/views/mv/index.vue +++ b/src/renderer/views/mv/index.vue @@ -292,4 +292,13 @@ const isPrevDisabled = computed(() => currentIndex.value === 0); @apply text-center py-4 col-span-full; @apply text-gray-500 dark:text-gray-400; } + +.mobile { + .mv-list-content { + @apply pl-4 pr-4; + } + .categories-wrapper { + @apply pl-4; + } +}