Uploaded image for project: 'XWiki Platform'
  1. XWiki Platform
  2. XWIKI-20985

Default theme bootstrap handles lack contrast

    XMLWordPrintable

Details

    • Bug
    • Resolution: Unresolved
    • Minor
    • None
    • 15.4
    • Notifications
    • Hard
    • 1.4.3 Contrast (Minimum)

    Description

      The handles in the notification dropdown

      WCAG warnings in the test class [org.xwiki.platform.notifications.test.ui.AllIT]:
      __________
      Validation in the test method [notificationsEmails]
      Check for [org.xwiki.platform.notifications.test.po.NotificationsTrayPage] at http://xwikiweb:8080/xwiki/bin/view/XWiki/NotificationsEmailsITuser2?category=notifications.
      Found [3] items

      1: Elements must have sufficient color contrast
      Description: Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
      Help URL: https://dequeuniversity.com/rules/axe/4.6/color-contrast?application=axeAPI
      Help: Elements must have sufficient color contrast
      Impact: serious
      Tags: cat.color, wcag2aa, wcag143, ACT

      HTML element:
      <span class="bootstrap-switch-handle-on bootstrap-switch-primary" style="width: 44px;">ON</span>
      Selector: [.notificationAppCell[data-format="alert"] > .bootstrap-switch-small.bootstrap-switch-indeterminate.bootstrap-switch-off > .bootstrap-switch-container > .bootstrap-switch-handle-on.bootstrap-switch-primary]
      Fix any of the following:
      Element has insufficient color contrast of 1.55 (foreground color: #c6d8e7, background color: #8cb0ce, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1

      HTML element:
      <span class="bootstrap-switch-handle-off bootstrap-switch-default" style="width: 44px;">OFF</span>
      Selector: [.notificationAppCell[data-format="alert"] > .bootstrap-switch-small.bootstrap-switch-indeterminate.bootstrap-switch-off > .bootstrap-switch-container > .bootstrap-switch-handle-off.bootstrap-switch-default]
      Fix any of the following:
      Element has insufficient color contrast of 3.82 (foreground color: #757575, background color: #eaeaea, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1

      HTML element:
      <span class="bootstrap-switch-handle-on bootstrap-switch-primary" style="width: 44px;">ON</span>
      Selector: [.notificationAppCell[data-format="email"] > .bootstrap-switch-small.bootstrap-switch-indeterminate.bootstrap-switch-off > .bootstrap-switch-container > .bootstrap-switch-handle-on.bootstrap-switch-primary]
      Fix any of the following:
      Element has insufficient color contrast of 1.55 (foreground color: #c6d8e7, background color: #8cb0ce, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1

      HTML element:
      <span class="bootstrap-switch-handle-off bootstrap-switch-default" style="width: 44px;">OFF</span>
      Selector: [.notificationAppCell[data-format="email"] > .bootstrap-switch-small.bootstrap-switch-indeterminate.bootstrap-switch-off > .bootstrap-switch-container > .bootstrap-switch-handle-off.bootstrap-switch-default]
      Fix any of the following:
      Element has insufficient color contrast of 3.82 (foreground color: #757575, background color: #eaeaea, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1

      Attachments

        Activity

          People

            Lucas C Charpentier Lucas
            Lucas C Charpentier Lucas
            Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

            Dates

              Created:
              Updated: