mirror of
https://github.com/qier222/YesPlayMusic.git
synced 2024-11-22 09:20:11 +08:00
fix: bugs
This commit is contained in:
qier222
parent
41ff8058b2
commit
226a2145c4
143
src/App.vue
143
src/App.vue
|
|
@ -8,8 +8,8 @@
|
|||
<router-view v-if="!$route.meta.keepAlive"></router-view>
|
||||
</main>
|
||||
<transition name="slide-up">
|
||||
<Player v-if="enablePlayer" v-show="showPlayer" ref="player"
|
||||
/></transition>
|
||||
<Player v-if="enablePlayer" v-show="showPlayer" ref="player" />
|
||||
</transition>
|
||||
<Toast />
|
||||
<ModalAddTrackToPlaylist v-if="isAccountLoggedIn" />
|
||||
<ModalNewPlaylist v-if="isAccountLoggedIn" />
|
||||
|
|
@ -98,93 +98,10 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/* url('~@/assets/fonts/Barlow-Medium.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-SemiBold.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-Bold.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-ExtraBold.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-Black.woff2') format('woff2'); */
|
||||
|
||||
@font-face {
|
||||
font-family: 'Barlow';
|
||||
font-weight: normal;
|
||||
src: url('~@/assets/fonts/Barlow-Regular.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-Regular.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Barlow';
|
||||
font-weight: medium;
|
||||
src: url('~@/assets/fonts/Barlow-Medium.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-Medium.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Barlow';
|
||||
font-weight: 600;
|
||||
src: url('~@/assets/fonts/Barlow-SemiBold.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-SemiBold.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Barlow';
|
||||
font-weight: bold;
|
||||
src: url('~@/assets/fonts/Barlow-Bold.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-Bold.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Barlow';
|
||||
font-weight: 800;
|
||||
src: url('~@/assets/fonts/Barlow-ExtraBold.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-ExtraBold.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Barlow';
|
||||
font-weight: 900;
|
||||
src: url('~@/assets/fonts/Barlow-Black.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-Black.ttf') format('truetype');
|
||||
}
|
||||
|
||||
:root {
|
||||
--color-body-bg: #ffffff;
|
||||
--color-text: #000;
|
||||
--color-primary: #335eea;
|
||||
--color-primary-bg: #eaeffd;
|
||||
--color-secondary: #7a7a7b;
|
||||
--color-secondary-bg: #f5f5f7;
|
||||
--color-navbar-bg: rgba(255, 255, 255, 0.86);
|
||||
--color-primary-bg-for-transparent: rgba(189, 207, 255, 0.28);
|
||||
--color-secondary-bg-for-transparent: rgba(209, 209, 214, 0.28);
|
||||
--html-overflow-y: overlay;
|
||||
}
|
||||
|
||||
[data-theme='dark'] {
|
||||
--color-body-bg: #222222;
|
||||
--color-text: #ffffff;
|
||||
--color-primary: #335eea;
|
||||
--color-primary-bg: #bbcdff;
|
||||
--color-secondary: #7a7a7b;
|
||||
--color-secondary-bg: #323232;
|
||||
--color-navbar-bg: rgba(34, 34, 34, 0.86);
|
||||
--color-primary-bg-for-transparent: rgba(255, 255, 255, 0.12);
|
||||
--color-secondary-bg-for-transparent: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
#app {
|
||||
width: 100%;
|
||||
transition: all 0.4s;
|
||||
}
|
||||
#app,
|
||||
input {
|
||||
font-family: 'Barlow', -apple-system, BlinkMacSystemFont, Helvetica Neue,
|
||||
PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC,
|
||||
WenQuanYi Micro Hei, sans-serif, microsoft uighur;
|
||||
}
|
||||
body {
|
||||
background-color: var(--color-body-bg);
|
||||
}
|
||||
|
||||
html {
|
||||
overflow-y: var(--html-overflow-y);
|
||||
min-width: 768px;
|
||||
overscroll-behavior: none;
|
||||
}
|
||||
|
||||
main {
|
||||
margin-top: 84px;
|
||||
|
|
@ -201,28 +118,7 @@ main {
|
|||
}
|
||||
}
|
||||
|
||||
select,
|
||||
button {
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
button {
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
input,
|
||||
button {
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
padding: 64px 5vw 96px 5vw;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -230,39 +126,12 @@ main::-webkit-scrollbar {
|
|||
width: 0px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
border-left: 1px solid rgba(128, 128, 128, 0.18);
|
||||
background: var(--color-body-bg);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
-webkit-border-radius: 10px;
|
||||
border-radius: 10px;
|
||||
background: rgba(128, 128, 128, 0.38);
|
||||
}
|
||||
|
||||
[data-theme='dark'] ::-webkit-scrollbar-thumb {
|
||||
background: var(--color-secondary-bg);
|
||||
}
|
||||
|
||||
.slide-up-enter-active,
|
||||
.slide-up-leave-active {
|
||||
transition: all 0.4s;
|
||||
transition: transform 0.4s;
|
||||
}
|
||||
.slide-up-enter, .slide-up-leave-to /* .fade-leave-active below version 2.1.8 */ {
|
||||
.slide-up-enter,
|
||||
.slide-up-leave-to {
|
||||
transform: translateY(100%);
|
||||
}
|
||||
|
||||
[data-electron='yes'] {
|
||||
button,
|
||||
.navigation-links a,
|
||||
.playlist-info .description {
|
||||
cursor: default !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
135
src/assets/css/global.scss
Normal file
135
src/assets/css/global.scss
Normal file
|
|
@ -0,0 +1,135 @@
|
|||
@font-face {
|
||||
font-family: 'Barlow';
|
||||
font-weight: normal;
|
||||
src: url('~@/assets/fonts/Barlow-Regular.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-Regular.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Barlow';
|
||||
font-weight: medium;
|
||||
src: url('~@/assets/fonts/Barlow-Medium.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-Medium.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Barlow';
|
||||
font-weight: 600;
|
||||
src: url('~@/assets/fonts/Barlow-SemiBold.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-SemiBold.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Barlow';
|
||||
font-weight: bold;
|
||||
src: url('~@/assets/fonts/Barlow-Bold.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-Bold.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Barlow';
|
||||
font-weight: 800;
|
||||
src: url('~@/assets/fonts/Barlow-ExtraBold.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-ExtraBold.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Barlow';
|
||||
font-weight: 900;
|
||||
src: url('~@/assets/fonts/Barlow-Black.woff2') format('woff2'),
|
||||
url('~@/assets/fonts/Barlow-Black.ttf') format('truetype');
|
||||
}
|
||||
|
||||
:root {
|
||||
--color-body-bg: #ffffff;
|
||||
--color-text: #000;
|
||||
--color-primary: #335eea;
|
||||
--color-primary-bg: #eaeffd;
|
||||
--color-secondary: #7a7a7b;
|
||||
--color-secondary-bg: #f5f5f7;
|
||||
--color-navbar-bg: rgba(255, 255, 255, 0.86);
|
||||
--color-primary-bg-for-transparent: rgba(189, 207, 255, 0.28);
|
||||
--color-secondary-bg-for-transparent: rgba(209, 209, 214, 0.28);
|
||||
--html-overflow-y: overlay;
|
||||
}
|
||||
|
||||
[data-theme='dark'] {
|
||||
--color-body-bg: #222222;
|
||||
--color-text: #ffffff;
|
||||
--color-primary: #335eea;
|
||||
--color-primary-bg: #bbcdff;
|
||||
--color-secondary: #7a7a7b;
|
||||
--color-secondary-bg: #323232;
|
||||
--color-navbar-bg: rgba(34, 34, 34, 0.86);
|
||||
--color-primary-bg-for-transparent: rgba(255, 255, 255, 0.12);
|
||||
--color-secondary-bg-for-transparent: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
#app,
|
||||
input {
|
||||
font-family: 'Barlow', ui-sans-serif, system-ui, -apple-system,
|
||||
BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei,
|
||||
Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif,
|
||||
microsoft uighur;
|
||||
}
|
||||
body {
|
||||
background-color: var(--color-body-bg);
|
||||
}
|
||||
|
||||
html {
|
||||
overflow-y: var(--html-overflow-y);
|
||||
min-width: 768px;
|
||||
overscroll-behavior: none;
|
||||
}
|
||||
|
||||
select,
|
||||
button {
|
||||
font-family: inherit;
|
||||
}
|
||||
button {
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
input,
|
||||
button {
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
[data-electron='yes'] {
|
||||
button,
|
||||
.navigation-links a,
|
||||
.playlist-info .description {
|
||||
cursor: default !important;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
border-left: 1px solid rgba(128, 128, 128, 0.18);
|
||||
background: var(--color-body-bg);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
-webkit-border-radius: 10px;
|
||||
border-radius: 10px;
|
||||
background: rgba(128, 128, 128, 0.38);
|
||||
}
|
||||
|
||||
[data-theme='dark'] ::-webkit-scrollbar-thumb {
|
||||
background: var(--color-secondary-bg);
|
||||
}
|
||||
|
||||
.user-select-none {
|
||||
user-select: none;
|
||||
}
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<span class="artist-in-line">
|
||||
{{ computedPrefix }}
|
||||
<span v-for="(ar, index) in filteredArtists" :key="ar.id">
|
||||
<span v-for="(ar, index) in filteredArtists" :key="index">
|
||||
<router-link v-if="ar.id !== 0" :to="`/artist/${ar.id}`">
|
||||
{{ ar.name }}
|
||||
</router-link>
|
||||
|
|
|
|||
|
|
@ -65,7 +65,6 @@ export default {
|
|||
width: 100%;
|
||||
height: 100%;
|
||||
user-select: none;
|
||||
-webkit-app-region: no-drag;
|
||||
}
|
||||
|
||||
.menu {
|
||||
|
|
@ -81,6 +80,7 @@ export default {
|
|||
box-sizing: border-box;
|
||||
padding: 6px;
|
||||
z-index: 1000;
|
||||
-webkit-app-region: no-drag;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
|
|
|
|||
|
|
@ -31,17 +31,17 @@
|
|||
/></button-icon>
|
||||
</div>
|
||||
<div class="navigation-links">
|
||||
<router-link to="/" :class="{ active: this.$route.name === 'home' }">{{
|
||||
<router-link to="/" :class="{ active: $route.name === 'home' }">{{
|
||||
$t('nav.home')
|
||||
}}</router-link>
|
||||
<router-link
|
||||
to="/explore"
|
||||
:class="{ active: this.$route.name === 'explore' }"
|
||||
:class="{ active: $route.name === 'explore' }"
|
||||
>{{ $t('nav.explore') }}</router-link
|
||||
>
|
||||
<router-link
|
||||
to="/library"
|
||||
:class="{ active: this.$route.name === 'library' }"
|
||||
:class="{ active: $route.name === 'library' }"
|
||||
>{{ $t('nav.library') }}</router-link
|
||||
>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -116,8 +116,8 @@ export default {
|
|||
},
|
||||
translate() {
|
||||
let t;
|
||||
if (this.track.tns?.length > 0) t = this.track.tns[0];
|
||||
else if (this.track.al.tns?.length > 0) t = this.track.al.tns[0];
|
||||
if (this.track?.tns?.length > 0) t = this.track.tns[0];
|
||||
else if (this.track.al?.tns?.length > 0) t = this.track.al.tns[0];
|
||||
else t = this.track.alia[0];
|
||||
return t;
|
||||
},
|
||||
|
|
@ -129,8 +129,8 @@ export default {
|
|||
},
|
||||
isTranslate() {
|
||||
return (
|
||||
this.track.tns?.length > 0 ||
|
||||
this.track.al.tns?.length > 0 ||
|
||||
this.track?.tns?.length > 0 ||
|
||||
this.track.al?.tns?.length > 0 ||
|
||||
this.track.alia?.length > 0
|
||||
);
|
||||
},
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@ import '@/assets/icons';
|
|||
import '@/utils/filters';
|
||||
import './registerServiceWorker';
|
||||
import { dailyTask } from '@/utils/common';
|
||||
import '@/assets/css/global.scss';
|
||||
|
||||
window.resetApp = () => {
|
||||
localStorage.clear();
|
||||
|
|
|
|||
|
|
@ -223,7 +223,7 @@
|
|||
<button v-else @click="lastfmConnect()"> 授权连接 </button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div v-if="isElectron" class="item">
|
||||
<div class="left">
|
||||
<div class="title"
|
||||
>启用
|
||||
|
|
@ -318,22 +318,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="isElectron" class="item">
|
||||
<div class="left">
|
||||
<div class="title"> {{ $t('settings.enableGlobalShortcut') }}</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="toggle">
|
||||
<input
|
||||
id="enable-enable-global-shortcut"
|
||||
v-model="enableGlobalShortcut"
|
||||
type="checkbox"
|
||||
name="enable-enable-global-shortcut"
|
||||
/>
|
||||
<label for="enable-enable-global-shortcut"></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="left">
|
||||
<div class="title" style="transform: scaleX(-1)">🐈️ 🏳️🌈</div>
|
||||
|
|
@ -385,6 +369,26 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="isElectron">
|
||||
<h3>快捷键</h3>
|
||||
<div class="item">
|
||||
<div class="left">
|
||||
<div class="title"> {{ $t('settings.enableGlobalShortcut') }}</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="toggle">
|
||||
<input
|
||||
id="enable-enable-global-shortcut"
|
||||
v-model="enableGlobalShortcut"
|
||||
type="checkbox"
|
||||
name="enable-enable-global-shortcut"
|
||||
/>
|
||||
<label for="enable-enable-global-shortcut"></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer">
|
||||
<p class="author"
|
||||
>MADE BY
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user