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

Use of .table-hover is confusing because we use a blue hover color to indicate clickable #1904

Closed
rhamilto opened this issue Aug 3, 2017 · 3 comments
Assignees
Labels
area/styles area/usability kind/bug Categorizes issue or PR as related to a bug. priority/P2

Comments

@rhamilto
Copy link
Member

rhamilto commented Aug 3, 2017

On browse page tables, we use .table-hover. Given the hover color is blue, this is a bit confusing because in places like the project list page and <registry-imagestream-listing> we use a blue hover color to indicate the item is clickable. I think we should only use .table-hover if the item is clickable OR change the clickable item hover color. Granted the cursor changes when the item is clickable, but I think the hover color change dominates the cursor change affordance.

Row is not clickable:
screen shot 2017-08-03 at 9 04 39 am

Row is clickable:
screen shot 2017-08-03 at 9 04 54 am
screen shot 2017-08-03 at 9 05 05 am

thoughts, @openshift/team-ux-review?

@rhamilto rhamilto added area/styles area/usability kind/bug Categorizes issue or PR as related to a bug. priority/P2 labels Aug 3, 2017
@ncameronbritt
Copy link

List view items are highlighted in gray whether they're clickable or not: http://www.patternfly.org/pattern-library/content-views/list-view/#/code

The blue highlighting is less subtle than the gray, imho, and it does make it seem like the table row should be clickable. PF uses blue for other actions (links, etc), so the blue highlighting for something that isn't interactive seems to me to be inconsistent.

Maybe this gray vs blue/interactive vs non-interactive is a question that should be raised upstream?

@beanh66
Copy link
Member

beanh66 commented Aug 3, 2017

@rhamilto I agree with the points @ncameronbritt makes regarding gray vs blue. In PF listview links and actions are highlighted in blue on hover as well as the full row is highlighted in blue once selected (when multi-select checkboxes are enabled) but in general rows are not blue on hover.

I wonder about when a row is actually clickable to jump to a details page if it should be blue on hover though, such as the two examples you show last. @serenamarie125 have you run into this with other products at all?

@beanh66
Copy link
Member

beanh66 commented Aug 28, 2017

FYI @rhamilto We have a PatternFly Design issue in GH to address this inconsistency.

f0x11 pushed a commit to f0x11/origin-web-console that referenced this issue Mar 26, 2018
Fixes openshift#1904

Until patternfly/patternfly-design#314 is
addressed, I think we should avoid using .table-hover in our tables.
f0x11 pushed a commit to f0x11/origin-web-console that referenced this issue Mar 26, 2018
Fixes openshift#1904

Until patternfly/patternfly-design#314 is
addressed, I think we should avoid using .table-hover in our tables.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area/styles area/usability kind/bug Categorizes issue or PR as related to a bug. priority/P2
Projects
None yet
Development

No branches or pull requests

3 participants