Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Redesign the list items in the People menu. #151

Merged
merged 6 commits into from
Mar 17, 2023
Merged

Redesign the list items in the People menu. #151

merged 6 commits into from
Mar 17, 2023

Conversation

Gigabyte5671
Copy link
Member

@Gigabyte5671 Gigabyte5671 commented Mar 16, 2023

The old design was focused around the volume slider and mute button, requiring an extra click to access the majority of actions. This was a little backwards, clunky, and made the list items super thick:
image

In the new design the controls take precedence, providing quick access to the majority of actions. The volume slider becomes accessible via a dedicated volume button. The volume button's icon provides an indication of the current volume setting at a glance:
image

Closes #117.

@Gigabyte5671 Gigabyte5671 added the enhancement New feature or request label Mar 16, 2023
@Gigabyte5671
Copy link
Member Author

Gigabyte5671 commented Mar 16, 2023

There are a few bugs that need to be fixed before this PR is complete:

  • The new volume slider cannot be dragged. ✅ Fixed by commit 074ff56.
  • The new volume slider is not accessible on mobile, due to it relying on a mouseenter event. ✅ Fixed by commit 074ff56.
  • Names longer than ~15 characters, a menu width of less than ~350px, or a larger font size than default will cause the controls to wrap. This is desired behaviour, but puts us mostly back where we started with "thick" list items. ⏺️ This is not a huge issue. The readability aspect of this is fixed by commit b735ad7.

@Gigabyte5671 Gigabyte5671 marked this pull request as ready for review March 17, 2023 00:46
@digisomni digisomni merged commit b6cbe37 into master Mar 17, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
2 participants