Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Unnecessary styles injected into host app's index.html from ember-a11y-testing #260

Closed
drewlee opened this issue May 10, 2021 · 1 comment
Assignees
Labels

Comments

@drewlee
Copy link
Contributor

drewlee commented May 10, 2021

Unnecessary CSS styles are being injected into header content by the ember-a11y-testing addon. The styles are an artifact of the addon's deprecated visual component audit feature and should be removed.

<style>
  .axe-violation--level-1:not(:focus):not(:hover) {
    background-image: repeating-linear-gradient(
      135deg,
      transparent,
      transparent 10%,
      hsla(0, 0%, 88%, 1) 10%,
      hsla(0, 0%, 62%, 1) 15%,
      hsla(0, 0%, 38%, 1) 20%,
      transparent 20%,
      transparent 35%
    ) !important;
  }  .axe-violation--level-2:not(:focus):not(:hover) {
    background-image: repeating-linear-gradient(
      135deg,
      transparent,
      transparent 25%,
      /* make transparent portion somewhat wider than total stripe width */
        hsla(60, 79%, 59%, 1) 25%,
      hsla(60, 79%, 59%, 1) 30%,
      hsla(166, 44%, 65%, 1) 30%,
      hsla(166, 44%, 65%, 1) 35%,
      hsla(240, 26%, 50%, 1) 35%,
      hsla(240, 26%, 50%, 1) 40%
    ) !important;
  }  .axe-violation--level-3:not(:focus):not(:hover) {
    background-image: repeating-linear-gradient(
      135deg,
      transparent,
      transparent 0.5em,
      hsla(60, 79%, 59%, 1) 0.5em,
      hsla(60, 79%, 59%, 1) 1em,
      hsla(240, 26%, 50%, 1) 1em,
      hsla(240, 26%, 50%, 1) 1.5em
    ) !important;
  }  .axe-violation--replaced-element:not(:focus):not(:hover) {
    box-shadow: 0 0 0em 0.35em hsla(240, 26%, 50%, 1) inset,
      0 0 0em 0.35em hsla(60, 79%, 59%, 1), 0 0 0em 0.7em hsla(240, 26%, 50%, 1) !important;    /* Scale down slightly so box shadow is visible */
    transition-duration: 0.3s !important;
    transition-timing-function: ease-in-out !important;
    transform: scale(0.9) !important;
  }
</style>
@drewlee
Copy link
Contributor Author

drewlee commented May 11, 2021

Fixed via PR #261

@drewlee drewlee closed this as completed May 11, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant