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

Unify styling of FEM subject toolbar #6672

Open
seanmiller26 opened this issue Feb 7, 2025 · 0 comments
Open

Unify styling of FEM subject toolbar #6672

seanmiller26 opened this issue Feb 7, 2025 · 0 comments
Labels
design Design and/or UX enhancement New feature or request ui

Comments

@seanmiller26
Copy link
Contributor

seanmiller26 commented Feb 7, 2025

To coincide with the styling updates of the meta tools and video player toolbar, the subject toolbar is next in line to make FEM more consistent and address accessibility issues.

Image

With all potential lab options added:
Image

Main changes:
A non-responsive width of 45px, even at mobile.
Consistent button sizes of 40px.
Updated selected colors.
Field guide sizing, font and updated icon.

Challenge:
Show all marks, hide all marks, and show my marks is currently a dropdown. If we aim to put it in this toolbar, it may have to function by cycling through the 3 options. I do not have an icon for Show my marks at this time, and the one we currently use is not ideal. I am open to suggestions here, both on the functionality and any icons we can use.

Tooltips for marks:
When unselected: Hide all marks
When 'hide all' is selected: Hide my marks
When 'hide my marks' selected: Show all marks

Image

Future considerations:
Rounded corners on the right.

Figma styling found here: https://www.figma.com/design/6rXVi6arrGTmoM08x9tpex/UI-Kit?node-id=387-1073&t=jylvf9bwvjFBi8JA-1

@seanmiller26 seanmiller26 added design Design and/or UX enhancement New feature or request ui labels Feb 7, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
design Design and/or UX enhancement New feature or request ui
Projects
None yet
Development

No branches or pull requests

1 participant