Indicate which page we're on by making the background visible

[nordwestt]

Currently the topbar doesn't indicate which page we're on.
This PR makes the background change for the "button" of the current page, making it abundantly clear to the user where they are. Also tested on mobile 😉

[KartoffelChipss]

IMO the pages you can select in the top bar are so distinct that you don't really need this. It feels like unnecessary clutter. I mean you can pretty easily distinguish the music, the library, the home and the search page.

[nordwestt]

I think for most people (including me) it makes for a nicer UX as it's similar to how pages/windows work in general - ie. if you look at your web browser, you can see which tab is open just by looking at the tab having a different background, even if you only have a single tab appearing.

I actually think this opens up for a good discussion about design guidelines - like what vibe/direction is pelagica going in? what are its principles? does it prioritize customisability or simplicity?

Let me know if you're open to changing your mind on this one, though, as I personally would prefer to have some simple way of indicating state - it could even just be making the icon a bit larger or something (like apple do on the bottom bar)

[nordwestt]

Sometimes compromises are best, so I've made this disabled by default, but toggleable under settings. What do you think about that @KartoffelChipss ?

Also, I've added a very nice UX feature that auto-hides the topbar when scrolling down. It then shows again when either scrolling up or simply hovering over the area.
This makes it feel really clean and also fits well with your aesthetic