github-mirror/YesPlayMusic
2
0
Fork 0
mirror of https://github.com/qier222/YesPlayMusic.git synced 2025-02-01 11:43:00 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

fix: update colors

Browse Source
This commit is contained in:
qier222 2020-12-09 16:55:13 +08:00
parent 58f1d55641
commit d66ceded6e
4 changed files with 24 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/App.vue
View File

@ -72,6 +72,8 @@ export default {
--color-secondary: #7a7a7b; --color-secondary: #7a7a7b;
--color-secondary-bg: #f5f5f7; --color-secondary-bg: #f5f5f7;
--color-navbar-bg: rgba(255, 255, 255, 0.86); --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);
} }
[data-theme="dark"] { [data-theme="dark"] {
@ -83,6 +85,8 @@ export default {
--color-secondary-bg: #323232; --color-secondary-bg: #323232;
--color-navbar-bg: #335eea; --color-navbar-bg: #335eea;
--color-navbar-bg: rgba(34, 34, 34, 0.86); --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 { #app {

2
src/components/ButtonIcon.vue
View File

@ -27,7 +27,7 @@ button {
margin-left: 0; margin-left: 0;
} }
&:hover { &:hover {
background: var(--color-secondary-bg); background: var(--color-secondary-bg-for-transparent);
} }
&:active { &:active {
transform: scale(0.92); transform: scale(0.92);

6
src/components/ContextMenu.vue
View File

@ -85,6 +85,9 @@ export default {
backdrop-filter: blur(16px) contrast(120%); backdrop-filter: blur(16px) contrast(120%);
border: 1px solid rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.08);
} }
.menu .item:hover {
color: var(--color-text);
}
} }
.menu .item { .menu .item {
@ -95,7 +98,8 @@ export default {
cursor: default; cursor: default;
color: var(--color-text); color: var(--color-text);
&:hover { &:hover {
background: var(--color-secondary-bg); color: var(--color-primary);
background: var(--color-primary-bg-for-transparent);
} }
} }

17
src/components/Navbar.vue
View File

@ -139,7 +139,7 @@ nav {
left: 12px; left: 12px;
} }
&:hover { &:hover {
background: var(--color-secondary-bg); background: var(--color-secondary-bg-for-transparent);
} }
&:active { &:active {
transform: scale(0.92); transform: scale(0.92);
@ -167,7 +167,7 @@ nav {
display: flex; display: flex;
align-items: center; align-items: center;
height: 32px; height: 32px;
background: var(--color-secondary-bg); background: var(--color-secondary-bg-for-transparent);
border-radius: 8px; border-radius: 8px;
width: 200px; width: 200px;
} }
@ -194,7 +194,7 @@ nav {
} }
.active { .active {
background: var(--color-primary-bg); background: var(--color-primary-bg-for-transparent);
input, input,
.svg-icon { .svg-icon {
opacity: 1; opacity: 1;
@ -203,6 +203,17 @@ nav {
} }
} }
[data-theme="dark"] {
.search-box {
.active {
input,
.svg-icon {
color: var(--color-text);
}
}
}
}
.right-part { .right-part {
flex: 1; flex: 1;
display: flex; display: flex;