mirror of
https://github.com/antebudimir/feishin.git
synced 2026-01-03 03:11:40 +00:00
Migrate to Mantine v8 and Design Changes (#961)
* mantine v8 migration * various design changes and improvements
This commit is contained in:
parent
bea55d48a8
commit
c1330d92b2
473 changed files with 12469 additions and 11607 deletions
|
|
@ -1,44 +1,16 @@
|
|||
import { rem, Slider, SliderProps } from '@mantine/core';
|
||||
import styles from './playerbar-slider.module.css';
|
||||
|
||||
import { Slider, SliderProps } from '/@/shared/components/slider/slider';
|
||||
|
||||
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)',
|
||||
},
|
||||
},
|
||||
classNames={{
|
||||
bar: styles.bar,
|
||||
label: styles.label,
|
||||
root: styles.root,
|
||||
thumb: styles.thumb,
|
||||
track: styles.track,
|
||||
}}
|
||||
{...props}
|
||||
onClick={(e) => {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue