Issue view: Insufficient color contrast for states of user interface controls

XMLWordPrintable

    • Severity 3 - Minor
    • 0
    • Accessibility

      Issue Summary

      The pin button fails to meet the minimum color contrast ratio requirement.

      Test URL

      https://anu-j.atlassian.net/browse/SP-15

      Steps to Reproduce

      1. Open the JSM Cloud homepage.
      2. Select any project and open an issue within it.
      3. Within the issue view, locate the "Details" and "More fields" sections and expand them accordingly.
      4. Observe that the Pin button is displayed adjacent to the "Assignee", "Request type", and other section headings.
      5. Use keyboard navigation to access these buttons and pin the respective fields.
      6. The pinned elements will subsequently appear above, under the section heading "Your pinned fields."
      7. Hover over the pinned elements.
      8. Use any color contrast testing tool to check the contrast ratio between the foreground and background colors of the pin buttons as specified.
      9. Note that the color contrast between the foreground and background colors for the pin button is insufficient in the hover state.

      Screenshot

      Actual Results

      The pin buttons associated with "Assignee," "Request type," "Priority," "Labels," and so on elements present within the "Details" and "More fields" sections have insufficient contrast ratios between their background and foreground colors when hovered over with a mouse pointer.

      • The foreground #B38601 color of these pin buttons has a contrast ratio of 2.4:1 against the #DDDDDD background.

      This will make it difficult for people with low vision and color blindness to distinguish the user interface components in different states that have insufficient contrast.

      Expected Results

      The contrast ratio between the foreground border color of the button and its background color should be sufficient in the hover state.

      Ensure that the color contrast for the foreground color of the pin button in hover state is 3:1 with the background color.

      Workaround

      Currently there is no known workaround for this behavior. A workaround will be added here when available.

      Environment

      MacBook Pro (16 inch, 2021)
      macOs 26.3 (25D125)
      Windows - 11 pro
      Chrome - Version 145.0.7632.76 (Official Build) (arm64)
      Safari - Version 26.2 (21623.1.14.11.9)
      JAWS - Version 2025
      NVDA - Version 2024.4.2.35031
      Voiceover - Version Latest

              Assignee:
              Diksha Vedi
              Reporter:
              Anusooya .
              Votes:
              1 Vote for this issue
              Watchers:
              3 Start watching this issue

                Created:
                Updated: