mirror of
https://github.com/antebudimir/feishin.git
synced 2025-12-31 10:03:33 +00:00
eb50c69a35
* Album blur, allow clicking the playerbar to toggle the player * Fix stopProporagion, sync package with upsteam, update translation * recommit my existing changes * Update default albumBackgroundBlur to 6 * according to git this commit resets the package files * merge with our fork because pyx forgot to add it * try adding a setting * change the playerbar animation * make the animation quicker bc its choppy * change playerbar to use a bool instead * requested opacity fix * Refactor classes to use clsx --------- Co-authored-by: iiPython <ben@iipython.dev> Co-authored-by: Jeff <42182408+jeffvli@users.noreply.github.com>
49 lines
1.6 KiB
TypeScript
49 lines
1.6 KiB
TypeScript
import { rem, Slider, SliderProps } from '@mantine/core';
|
|
|
|
export const PlayerbarSlider = ({ ...props }: SliderProps) => {
|
|
return (
|
|
<Slider
|
|
styles={{
|
|
bar: {
|
|
backgroundColor: 'var(--playerbar-slider-track-progress-bg)',
|
|
transition: 'background-color 0.2s ease',
|
|
},
|
|
label: {
|
|
backgroundColor: 'var(--tooltip-bg)',
|
|
color: 'var(--tooltip-fg)',
|
|
fontSize: '1.1rem',
|
|
fontWeight: 600,
|
|
padding: '0 1rem',
|
|
},
|
|
root: {
|
|
'&:hover': {
|
|
'& .mantine-Slider-bar': {
|
|
backgroundColor: 'var(--primary-color)',
|
|
},
|
|
'& .mantine-Slider-thumb': {
|
|
opacity: 1,
|
|
},
|
|
},
|
|
},
|
|
thumb: {
|
|
backgroundColor: 'var(--slider-thumb-bg)',
|
|
borderColor: 'var(--primary-color)',
|
|
borderWidth: rem(1),
|
|
height: '1rem',
|
|
opacity: 0,
|
|
width: '1rem',
|
|
},
|
|
track: {
|
|
'&::before': {
|
|
backgroundColor: 'var(--playerbar-slider-track-bg)',
|
|
right: 'calc(0.1rem * -1)',
|
|
},
|
|
},
|
|
}}
|
|
{...props}
|
|
onClick={(e) => {
|
|
e?.stopPropagation();
|
|
}}
|
|
/>
|
|
);
|
|
};
|