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

lint: forbid comma separated selectors in selectors #499

Open
layershifter opened this issue Jan 26, 2024 · 2 comments
Open

lint: forbid comma separated selectors in selectors #499

layershifter opened this issue Jan 26, 2024 · 2 comments
Labels
💅 enhancement New feature or request

Comments

@layershifter
Copy link
Member

We need add a ESLint rule that will forbid :hover,:active selectors.

makeStyles({
  root: {
     // 🟢 should pass
    ":hover": { color: "red" },
    ":active": { color: "blue" },
    // 🔴 should break
    ":hover,:active": { color: "blue" },
  },
});

For context, #495.

@layershifter layershifter added the 💅 enhancement New feature or request label Jan 26, 2024
@NotWoods
Copy link
Member

Possibly as an option, I think it would be helpful to allow comma-separated selectors only if they all include &.

makeStyles({
  root: {
     // 🟢 should pass
    "&:hover, &:active": { color: "blue" },
    // 🔴 should break
    ":hover,&:active": { color: "blue" },
  },
});

@miroslavstastny
Copy link
Member

Waiting for partners to enable linting, considering for H2/2024

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
💅 enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

3 participants