fix: Only show hover feedback on clickable patch list items

ReVanced / revanced-website

🌐 Website for ReVanced

https://revanced.app

GNU General Public License v3.0

313 stars 42 forks source link

fix: Only show hover feedback on clickable patch list items #236

Open KTibow opened 7 months ago

KTibow commented 7 months ago

right now, all patches look clickable, and no patches can be tabbed to.
with this, we make expandable patches buttons (can be tabbed to), and only apply the hover animations to those. this makes it more clear when a patch can be expanded.
we also uplevel the animation wrapper div because it was causing the widths to be odd, probably also improving perf.

oSumAtrIX commented 7 months ago

Something about this feels odd. Everything has some form of feedback and you feel under control, but when hovering over the list items, it feels empty:

https://github.com/ReVanced/revanced-website/assets/13122796/2f99fa91-5daf-4ac1-8f6d-af4df0d82585

oSumAtrIX commented 7 months ago

Discord for example gives similar visual clues by dimming the background even though theres no interactivity with the item itself but just some action buttons:

https://github.com/ReVanced/revanced-website/assets/13122796/c0cbc96b-02f2-4cdc-bc89-155fc69a0f4d

Ushie commented 7 months ago

In the case of discord, there is a form of interactivity which is the right click/context menu, but I agree that it feels empty

oSumAtrIX commented 7 months ago

I'd argue we have interactivity with the package chip, but I can see the UX issue with showing visual cues for interaction when the item is not really interactable, but yes, it feels empty.

KTibow commented 7 months ago

I'd argue that while removing hover effects makes it feel less interesting, it emphasizes that it's less of something to put your mouse over and more a static list. This increases semantic alignment - static elements are, well, static, and expandable items are easily noticed.

re: discord hover: you can right click on the hovered message, so the hover makes sense there re: package chip: the only time a hover effect for it should show up is when you're hovering on the clickable part. the whole card isn't the clickable part.