UX Improvements for Select and Operations Dropdowns

[donutdan4114]

Original Post on Drupal.org

There are a couple of small UX regressions when comparing this theme's select dropdown widget to the standard Seven theme. Although minor, these types of interactions occur hundreds of times when building a new site, and I believe these improvements would have a noticeable impact on site building.

Issue 1

It takes twice as money clicks to select anything. Standard HTML dropdowns allow you to Click, Drag to your choice, and Release. The action of releasing your mouse button selects that items. In MA, you are required to Click, Click (there is no drag to select).

Issue 2

Given a list of select dropdown settings you cannot easily tab between them and select a value within. For example, let's assume we have a list of 5 U.S. state select fields. You should be able to hit TAB, start typing "Miss" (Mississippi will be highlighted), hit TAB, and then "Mississippi" is selected and you move to the next field. In the case of MA, hitting TAB after typing "Miss" does not select "Mississippi". In MA, you can hit ENTER to select the highlighted state, but that is an additional keystroke. Ideally, tabbing away from a select dropdown selects the item automatically. This issue also occurs if you use the arrow keys to highlight an item and then TAB away (it does not get selected).

Issue 3

Similarly to Issue #1, the dropdown for Operations (displayed as three dots) requires an additional click. Ideally you would be able to Click, Drag to your Choice, and Release. Essentially this would mean that the Operations menu opens on "mousedown" and you can select an item with "mouseup".