nik/navidrome
1
0
Fork 0
mirror of https://github.com/navidrome/navidrome.git synced 2026-08-31 07:30:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: loading albbun, play button color

Browse Source
This commit is contained in:
Xavier Araque 2025-11-04 19:58:49 +01:00
parent 48ebeb78cd
commit ec7f5c89b1
2 changed files with 79 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
ui/src/themes/SquiddiesGlass.css.js
View File

@ -48,6 +48,37 @@ const stylesheet = `
color: #c231ab;
}
.react-jinke-music-player .music-player-controller {
color: #c231ab;
border: 1px solid #e14ac2;
}
.react-jinke-music-player .music-player-controller.music-player-playing:before {
border: 1px solid rgba(194, 49, 171, 0.3);
}
.react-jinke-music-player .music-player .destroy-btn {
background-color: #c2c1c2;
top: -7px;
border-radius: 50%;
display: flex;
}
.react-jinke-music-player .music-player .destroy-btn svg {
font-size: 20px;
}
@media screen and (max-width: 767px) {
.react-jinke-music-player .music-player .destroy-btn {
right: -12px;
}
}
.react-jinke-music-player-mobile-header-right {
right: 0;
top: 0;
}
@media screen and (max-width: 767px) {
.react-jinke-music-player-main svg {
font-size: 32px;
@ -129,6 +160,16 @@ a[aria-current="page"] .MuiListItemIcon-root {
opacity: 0.8;
}
}
@keyframes pulse {
0% { opacity: 0.5; }
100% { opacity: 1; }
}
@keyframes spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
`
export default stylesheet

38
ui/src/themes/SquiddiesGlass.js
View File

@ -177,6 +177,8 @@ export default {
},
MuiCardMedia: {
root: {
position: 'relative',
overflow: 'hidden',
boxShadow: `0 2px 32px rgba(0,0,0,0.5), 0px 1px 5px rgba(0,0,0,0.1)`,
},
},
@ -366,6 +368,29 @@ export default {
},
coverParent: {
zIndex: '99999',
position: 'relative',
backgroundColor: 'rgba(0, 0, 0, 0.5)',
'&::before': {
content: '""',
position: 'absolute',
inset: '0',
width: '100%',
height: '100%',
borderRadius: '50%',
animation: 'pulse 1.5s ease-in-out infinite alternate',
zIndex: -1,
},
'&::after': {
content: '""',
position: 'absolute',
inset: '0',
zIndex: '-1',
borderRadius: '50%',
background: 'repeating-conic-gradient(from 0deg, rgba(255,255,255,0.08) 0deg, rgba(255,255,255,0.08) 0.5deg, rgba(0,0,0,1) 1deg)',
filter: 'contrast(999) sepia(1)',
boxShadow: 'inset 0 0 25px rgba(255,255,255,0.05), inset 0 0 95px rgba(0,0,0,0.9)',
animation: 'spin 6s linear infinite',
}
},
details: {
zIndex: '99999',
@ -405,7 +430,19 @@ export default {
},
},
},
MuiGridListTile: {
tile: {
'&:hover': {
boxShadow: '0 2px 32px rgba(0,0,0,0.5), 0px 1px 5px rgba(0,0,0,0.1)',
},
},
},
NDAlbumGridView: {
tileBar: {
background:
'linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0) 100%)',
marginBottom: '2px',
},
albumName: {
marginTop: '0.5rem',
fontWeight: 700,
@ -425,6 +462,7 @@ export default {
},
},
albumPlayButton: {
color: colors.black,
backgroundColor: colors.pink[500],
borderRadius: '50%',
boxShadow: '0 8px 8px rgb(0 0 0 / 30%)',