mirror of
https://github.com/GiriNeko/YesPlayMusic.git
synced 2025-12-16 13:17:46 +00:00
feat: dark mode support (#53)
This commit is contained in:
parent
4e482941ed
commit
b655c59761
26 changed files with 301 additions and 181 deletions
28
src/App.vue
28
src/App.vue
|
|
@ -50,11 +50,36 @@ export default {
|
|||
<style lang="scss">
|
||||
@import url("https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,500;0,600;0,700;0,800;0,900;1,500;1,600;1,700;1,800;1,900&display=swap");
|
||||
|
||||
: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);
|
||||
}
|
||||
|
||||
[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: #335eea;
|
||||
--color-navbar-bg: rgba(34, 34, 34, 0.86);
|
||||
}
|
||||
|
||||
#app {
|
||||
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;
|
||||
width: 100%;
|
||||
transition: all 0.4s;
|
||||
}
|
||||
body {
|
||||
background-color: var(--color-body-bg);
|
||||
}
|
||||
|
||||
html {
|
||||
|
|
@ -102,12 +127,13 @@ a {
|
|||
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
border-left: 1px solid rgba(128, 128, 128, 0.18);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
-webkit-border-radius: 10px;
|
||||
border-radius: 10px;
|
||||
background: rgb(216, 216, 216);
|
||||
background: var(--color-secondary-bg);
|
||||
}
|
||||
|
||||
.slide-up-enter-active,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue