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

Pointer Cursor #301

Closed
stdavis opened this issue Sep 9, 2024 · 6 comments
Closed

Pointer Cursor #301

stdavis opened this issue Sep 9, 2024 · 6 comments

Comments

@stdavis
Copy link
Member

stdavis commented Sep 9, 2024

Should the button component use a pointer cursor rather than leaving it unchanged? I think that the pointer cursor gives an additional cue that the button is clickable.

Same question for log out menu item:
image

@steveoh
Copy link
Member

steveoh commented Sep 9, 2024

I'm following https://github.com/adobe/react-spectrum/wiki/Frequently-Asked-Questions-%28FAQs%29#why-dont-buttons-use-a-pointer-cursor

which specify that most clickable elements (with the exception of links), should use an arrow cursor for all states, including hover and down.

The intent is to better match native browser behavior, the CSS spec, Microsoft interface guidelines and Apple interface guidelines.

If we are treating this like a link then I could see changing the pointer.

@stdavis
Copy link
Member Author

stdavis commented Sep 9, 2024

Interesting. I couldn't find any sites with buttons that use the arrow cursor including microsoft.com and apple.com. Maybe I'm looking in the wrong places. I looked for buttons that were not links like add to cart stuff.

Either way, do you want the "Sign out" menu item set to something other than text?

@steveoh
Copy link
Member

steveoh commented Sep 10, 2024

It's possible that I interpreted that incorrectly since I also don't see the treatment I would expect after looking at all of those websites including adobes. I've reached out for clarification.

I did have the same question and used that as an answer since the utah design system doesn't provide guidance. I thought it would be nice to follow a cited pattern but if it's not being followed in practice then it's not that nice. Whatever we do it needs to be consistent.

I don't follow this...

Either way, do you want the "Sign out" menu item set to something other than text?

Right now it's a MenuItem component which ultimately is a button. The menu styling needs to be updated and I have a task to do that but haven't made time yet.

@steveoh
Copy link
Member

steveoh commented Sep 10, 2024

Adobe is sticking to their guns.

Yeah, I'm not sure every team/product follows these guidelines perfectly, but we wanted to as a component library.

@stdavis
Copy link
Member Author

stdavis commented Sep 10, 2024

I don't follow this...

When I hover over the "Sign out" menu item in the Avatar menu, the cursor turns to the "text" type. It doesn't show up on a screenshot so I can't easily share it with you.

@steveoh
Copy link
Member

steveoh commented Sep 10, 2024

This should be fixed with #304. I'm going to close this and we can continue this discussion internally.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants