![]() Shouldn't be very slow / resource intensive, as I'm using Good Practices ™️ and transform.New transition to fit with that whenever the song changes:.Replaced "reflections" with previous / coming album covers:. ![]() turns out that if you don't use hacks in the first place you don't have to use hacks later because the other elements aren't absolutely positioned anymore, they have a say in layout and thus can bully around the cover into being smaller. details on how it does this: the cover is actually set to have a height of zero, but with flex-grow set to 10 so that it can grow, but only if there's free space. Inter vs sans-serif comparison: (See especially the album & artist names) ![]() Main player pane, in a Vivaldi webpanel (meaning it has enough height to have the cover "comfortable"): Stations pane: (I figured that since station names are long, they should have more room, so 3 per row -> 2 per row) tell me if you do want it though so I can fix the issues that I don't care about but would matter were it to be released to the public (mostly how I broke theming a tad) screenshots That said, I did break theming a little bit because I figured I wasn't going to share these modifications ✨ but then I did ✨Īgain, no pressure to add this. I swapped some expensive transitions ( width, left) to good GPU-accelerable transitions ( transform: scaleX, transform: translate).When there's no station playing (where it usually says "Play to play your latest station" or something like that), now it says that and the play button pulses:.the other buttons now have the same opacity properties as the artist and album links.I moved the play/pause and skip buttons to be larger and with the song details, because they're the most important buttons.artist and album links are smaller than song name, and usually have an opacity of 0.7 unless they're:.I didn't actually mean to replace the cover link with this but it was convenient.there's now an album link with the album name on it so you know what you're listening to.looked better to me, you can shrink it if you want instead, it dynamically shrinks the cover if it doesn't have space.now does not have horizontal scrolling functionality.reflections also use s, meaning that they load in the same fashion as the main image ( example of differing and background-image).when there's no room for it to be as high as the player is wide, it shows little reflections to the right and left:.is now an actual instead of an with a background-image (yay, semantic html).when the player is too short, it just.the player controls pane got a lot of improvements:.ok now that I see it side-by-side you can't actually tell that much based on the history panel's small text but just trust me it looks much better for the main panel, I just don't want to spoil what the main panel looks like yet.I switched to using the Inter font family instead of using the default sans-serif, as it just looks a lot nicer:.the "switch to different tab" buttons (the chevrons) are now actual buttons, rather than s (yay, semantic html).Oh right yeah so here are the changes I've made and a few screenshots maybe three ui updates in a year is a tad too much for longtime users? I've changed it a bit more to adapt to high popup heights because I switched to Vivaldi and made it a webpanel which is as high as the screen, as opposed to chrome popups being limited in height to I think it's 599px? you may not want to push this to main because. It's probably because I like the project and I use it probably the most out of any of my browser extensionsĪnyways I updated the ui a tiny bit.
0 Comments
Leave a Reply. |