mirror of
https://github.com/Floriansylvain/spotify-playlist-embed.git
synced 2026-08-19 11:43:17 +02:00
Florian Sylvain
8fe9394b6b
The commit introduces several changes to improve the user interface and experience of the Audio Player. Major updates were made in the styling of audioPlayer.css, audioPlayer.tsx and src/app/playlist/[playlistId]/page.tsx. The UX was enhanced by adding a function to automatically synchronize scrolling with the song being played in the playlist. Also, a new feature has been added to make the track name a clickable link redirecting users to the song on Spotify. The Spotify logo was added in SVG format for better quality.
51 lines
885 B
CSS
51 lines
885 B
CSS
input[type=range]::-webkit-slider-thumb {
|
|
-webkit-appearance: none;
|
|
height: 8px;
|
|
width: 8px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
input[type=range]::-moz-range-thumb {
|
|
height: 36px;
|
|
width: 16px;
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
input[type=range]::-ms-thumb {
|
|
height: 36px;
|
|
width: 16px;
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
input[type=range]::-webkit-slider-runnable-track {
|
|
width: 100%;
|
|
height: 8px;
|
|
cursor: pointer;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
input[type=range]::-moz-range-track {
|
|
width: 100%;
|
|
height: 8px;
|
|
cursor: pointer;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
input[type=range]::-ms-track {
|
|
width: 100%;
|
|
height: 8px;
|
|
cursor: pointer;
|
|
background: transparent;
|
|
border-color: transparent;
|
|
border-width: 16px 0;
|
|
color: transparent;
|
|
}
|
|
input[type=range]::-ms-fill-lower {
|
|
border-radius: 2.6px;
|
|
}
|
|
input[type=range]::-ms-fill-upper {
|
|
border-radius: 2.6px;
|
|
}
|