Uploaded image for project: 'Nuxeo Elements'
  1. Nuxeo Elements
  2. ELEMENTS-1554

Improve contrast for select all action

    XMLWordPrintable

    Details

    • Type: Improvement
    • Status: Resolved
    • Priority: Major
    • Resolution: Fixed
    • Affects Version/s: None
    • Fix Version/s: None
    • Component/s: A11y

      Description

      The visual boundary of an ACTIVE user interface component does not have at least a 3 to 1 luminosity contrast ratio with either the inner or outer adjacent background.

      Element Name: Unchecked state of Select all Checkbox

      Location: in Main region of the page.

      How to reach to 'Search Results' page:
      In main region of the page, after
      Clicking “Search” icon in left nav. Enter a search term like “Test” or “iron mountain”. Select Search and observe that a page that comes up, i.e. Search results with “grid view”.

      Select all checkbox in Unchecked state doesn't have min luminosity ratio
      Contrast ratio:
      Focus indicator color: #D2D2D3
      Surrounding color: #F7F7F8
      Ratio: 1.4:1
      Recommendation to fix
      RULE :
      Any visual boundary that indicates an active user component's hit area (the region where a pointer can activate the control) MUST have sufficient contrast of 3 to 1 with the adjacent background. Exceptions exist.

      HOW TO FIX:
      Fix this issue by adjusting the user interface component boundary and/or background to increase the contrast with either the inner or outer adjacent background to at least 3 to 1.

      REFERENCE:
      WCAG Understanding document: https://www.w3.org/WAI/WCAG21/Understanding/non-text-contrast

      BACKGROUND:
      People who have low vision or are colorblind may have difficulty perceiving that an element is interactive or what its state is - e.g. whether it has keyboard focus, is selected/checked/pressed, etc. - if the contrast between the element boundaries and/or state indicators and its background or adjacent colors is insufficient. When an interactive element's visual boundaries and state indicators have adequate contrast, people who have low vision or are colorblind are more likely to be able to perceive which elements on the screen are interactive and what their current state is.

        Attachments

          Issue Links

            Activity

              People

              • Votes:
                0 Vote for this issue
                Watchers:
                2 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:

                  Time Tracking

                  Estimated:
                  Original Estimate - Not Specified
                  Not Specified
                  Remaining:
                  Remaining Estimate - 0 minutes
                  0m
                  Logged:
                  Time Spent - 5 hours
                  5h