Replace palette by applyStyles

2024-10-21 15:43:16 +04:00
parent 0832595858
commit 6e82865743
2 changed files with 20 additions and 6 deletions
@@ -28,8 +28,10 @@ const Widget = styled('div')(({theme}) => ({
  margin: 'auto',
  position: 'relative',
  zIndex: 1,
-  backgroundColor:
-    theme.palette.mode === 'dark' ? 'rgba(0,0,0,0.6)' : grey[200],
+  backgroundColor: grey[200],
+  ...theme.applyStyles('dark', {
+    backgroundColor: 'rgba(0,0,0,0.6)'
+  }),
  backdropFilter: 'blur(40px)',
 }))

@@ -170,7 +172,10 @@ export default function Lekte({audio, url, parole}) {
          step={1}
          max={duration || 100}
          sx={{
-            color: theme.palette.mode === 'dark' ? '#fff' : 'rgba(0,0,0,0.87)',
+            color: 'rgba(0,0,0,0.87)',
+            ...theme.applyStyles('dark', {
+              color: '#fff'
+            }),
            height: 4,
            '& .MuiSlider-thumb': {
              width: 8,
@@ -237,7 +242,10 @@ export default function Lekte({audio, url, parole}) {
            defaultValue={volume}
            value={volume}
            sx={{
-              color: theme.palette.mode === 'dark' ? '#fff' : 'rgba(0,0,0,0.87)',
+              color: 'rgba(0,0,0,0.87)',
+              ...theme.applyStyles('dark', {
+                color: '#fff'
+              }),
              '& .MuiSlider-track': {
                border: 'none',
              },