mirror of
https://github.com/koel/koel
synced 2024-11-27 22:40:26 +00:00
feat: add color-accent
for more theme color control
This commit is contained in:
parent
bd0dc90cce
commit
f1d33b98e8
7 changed files with 7 additions and 11 deletions
|
@ -94,7 +94,7 @@ eventBus.on('LOAD_MAIN_CONTENT', (view: MainViewName) => (viewingQueue.value = v
|
|||
|
||||
.control {
|
||||
&.active {
|
||||
color: var(--color-highlight);
|
||||
color: var(--color-accent);
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
|
|
|
@ -47,12 +47,6 @@ const { song } = toRefs(props)
|
|||
|
||||
.meta {
|
||||
font-size: .9rem;
|
||||
|
||||
a {
|
||||
&:hover {
|
||||
color: var(--color-highlight);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Some little tweaks here and there
|
||||
|
|
|
@ -71,7 +71,7 @@ const doPlayback = () => {
|
|||
display: flex;
|
||||
|
||||
&:focus, &:focus-within {
|
||||
box-shadow: 0 0 1px 1px var(--color-highlight) inset;
|
||||
box-shadow: 0 0 1px 1px var(--color-accent) inset;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
|
@ -84,7 +84,7 @@ const doPlayback = () => {
|
|||
}
|
||||
|
||||
&.playing > span {
|
||||
color: var(--color-highlight);
|
||||
color: var(--color-accent);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -39,7 +39,7 @@ const changeMode = () => playbackService.changeRepeatMode()
|
|||
font-weight: bold;
|
||||
right: 2px;
|
||||
top: 2px;
|
||||
color: var(--color-highlight);
|
||||
color: var(--color-accent);
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
|
|
|
@ -82,6 +82,7 @@ export default [
|
|||
thumbnailUrl: thumbDawn,
|
||||
properties: {
|
||||
'--color-highlight': '#ed5135',
|
||||
'--color-accent': '#f4944f',
|
||||
'--bg-image': `url(${bgDawn})`,
|
||||
'--color-bg-primary': '#1e2747',
|
||||
'--bg-position': 'center bottom'
|
||||
|
|
|
@ -91,7 +91,7 @@ a {
|
|||
}
|
||||
|
||||
&:hover, &:focus {
|
||||
color: var(--color-highlight);
|
||||
color: var(--color-accent);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -4,6 +4,7 @@
|
|||
--color-bg-primary: #181818;
|
||||
--color-bg-secondary: rgba(255, 255, 255, .025);
|
||||
--color-highlight: #ff7d2e;
|
||||
--color-accent: var(--color-highlight);
|
||||
|
||||
--bg-image: none;
|
||||
--bg-position: center;
|
||||
|
|
Loading…
Reference in a new issue