dice/impress
1
0
Fork 0
forked from OpenNeo/impress
Code Pull requests Activity

Improve row focus and keyboard nav in Item Getting Guide

Browse source 
Clearer focus states, row changes bg color on hover/focus to help you
track where you are, remove the redundant image thumbnail link from the
tab order (it's the same as the item name link!)
This commit is contained in:
Emi Matchu 2024-05-22 14:57:28 -07:00
parent 189cb6a132
commit 1bd5598b64
2 changed files with 9 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
app/assets/stylesheets/items/sources.sass
View file

@ -30,7 +30,7 @@
.name-cell a .name-cell a
text-decoration: none text-decoration: none
&:hover &:hover, &:focus
text-decoration: underline text-decoration: underline
.actions-cell .actions-cell
@ -38,6 +38,11 @@
padding-left: 1em padding-left: 1em
font-size: 85% font-size: 85%
tbody
tr
&:hover, &:focus-within
background: rgba($module-bg-color, 0.5)
thead thead
background: $module-bg-color background: $module-bg-color

4
app/views/items/_item_list_row.html.haml
View file

@ -1,4 +1,6 @@
%tr %tr
%td.thumbnail-cell= link_to item_thumbnail_for(item), item, target: "_blank" %td.thumbnail-cell
= link_to item_thumbnail_for(item), item, target: "_blank",
tabindex: "-1"
%td.name-cell= link_to item.name, item, target: "_blank" %td.name-cell= link_to item.name, item, target: "_blank"
%td.actions-cell= yield %td.actions-cell= yield