misty.cafe/mistykey
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions

[frontend] Theme: add SkModPlayer slider knob as a theme-able var.

Browse source
This commit is contained in:
Vavency 2025-07-24 20:24:20 +03:00
parent 2d9744340f
commit 177a5c048c
3 changed files with 8 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

2
packages/frontend-shared/themes/_dark.json5
View file

@ -79,6 +79,8 @@
modPlayerVolume: '#80ff80',
modPlayerFx: '#ff80e0',
modPlayerOperant: '#ffe080',
modPlayerShadow: 'rgba(0, 0, 0, 0.5)',
modPlayerSliderKnob: ':darken<10<@indicator',
},
codeHighlighter: {

2
packages/frontend-shared/themes/_light.json5
View file

@ -79,6 +79,8 @@
modPlayerVolume: '#80ff80',
modPlayerFx: '#ff80e0',
modPlayerOperant: '#ffe080',
modPlayerShadow: 'rgba(0, 0, 0, 0.5)',
modPlayerSliderKnob: ':darken<10<@indicator',
},
codeHighlighter: {

7
packages/frontend/src/components/SkModPlayer.vue
View file

@ -551,6 +551,7 @@ onDeactivated(() => {
--MI_THEME-modPlayerFx: #ff80e0;
--MI_THEME-modPlayerOperant: #ffe080;
--MI_THEME-modPlayerShadow: #00000080;
--MI_THEME-modPlayerSliderKnob: hsl(from var(--MI_THEME-indicator) h s calc(l * 0.1));
}
.hide {
@ -761,7 +762,7 @@ onDeactivated(() => {
height: 100%;
width: 14px;
border-radius: 0;
background: hsl(from var(--MI_THEME-indicator) h s calc(l * 0.5));
background: var(--MI_THEME-modPlayerSliderKnob);
cursor: pointer;
-webkit-appearance: none;
box-shadow: calc(-100vw - 14px) 0 0 100vw var(--MI_THEME-accent);
@ -790,7 +791,7 @@ onDeactivated(() => {
height: 100%;
border-radius: 0;
width: 14px;
background: hsl(from var(--MI_THEME-indicator) h s calc(l * 0.5));
background: var(--MI_THEME-modPlayerSliderKnob);
cursor: pointer;
}
@ -823,7 +824,7 @@ onDeactivated(() => {
height: 100%;
width: 14px;
border-radius: 0;
background: hsl(from var(--MI_THEME-indicator) h s calc(l * 0.5));
background: var(--MI_THEME-modPlayerSliderKnob);
cursor: pointer;
}