Skip to content

a11y/media-prefers-reduced-motion doesn't detect override for rule with multiple selectors #57

@ghost

Description

These rules trigger an error with a11y/media-prefers-reduced-motion:

.Zoom-img,
.Zoom-wrap {
  position: relative;
  transition: all var(--Zoom-transition);
  z-index: 1;
}

@media screen and (prefers-reduced-motion) {
  .Zoom-img,
  .Zoom-wrap {
    transition: none;
  }
}

Modifying the above to rules with single selectors gets rid of the error:

.Zoom-wrap {
  position: relative;
  transition: all var(--Zoom-transition);
  z-index: 1;
}

@media screen and (prefers-reduced-motion) {
  .Zoom-wrap {
    transition: none;
  }
}

So it seems that this rule does not parse css rules with multiple selectors correctly. Neither of the above cases should return a linting error.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions