Uploaded image for project: 'stripes-components'
  1. stripes-components
  2. STCOM-865

Apply guidelines for the display of shortcut key combinations in an app's "Keyboard shortcuts" modal



    • Bienenvolk
    • Lotus R1 2022


      Current situation or problem:

      All apps will eventually include an option to display keyboard shortcuts in a modal.

      The order in which keyboard shortcuts are displayed in the modal should be consistent across applications and their presentation should also be consistent. Applying the three guidelines below will achieve this.

      Guideline 1

      Shortcut key combinations should be presented in Camel Case with spaces between the components.

      Key combination  
      Ctrl + Alt + E correct
      Ctrl+alt+e incorrect
      ctrl + alt + e incorrect

      Guideline 2

      Shortcuts should be described and ordered as per the below list of actions, to achieve consistency across applications.

      If a shortcut is not relevant to an app it should be omitted.

      A shortcut can be renamed to make it more relevant. For example in eHoldings "Create a new record" is renamed to "Create a new custom package or title record".

      1. Create a new record
      2. Edit a record
      3. Save a record
      4. Duplicate a record
      6. Expand all accordions
      7. Collapse all accordions
      8. Expand or collapse an accordion
      9. Go to Search & filter pane
      10. Open keyboard shortcuts modal
      11. Close a modal or pop-up
      12. Copy
      13. Cut
      14. Paste
      15. Find

      Guideline 3

      App specific shortcuts should be displayed at the top of the list, or inserted into the list at a point where they make most sense.

      Note: the shortcuts below are core to all apps and will be automatically included in the modal list. Additional shortcuts should be added to the modal on a per app basis and only displayed if they are implemented in the app. Core shortcuts:

      • Open keyboard shortcuts modal
      • Close a modal or pop-up
      • Copy
      • Cut
      • Paste
      • Find

      Links to additional info

      Guidelines are described on the wiki: https://wiki.folio.org/display/A11Y/Keyboard+Navigation

      Interested parties


      TestRail: Results


          Issue Links



                jag.goraya Jag Goraya
                Claudia Claudia Malzer
                0 Vote for this issue
                3 Start watching this issue



                  TestRail: Runs

                    TestRail: Cases