mardi 7 janvier 2020

How to refactor media queries wrappers in LESS?

We have a lot of hover states in our web app and we need to disable all hover states for touch screens. So i decided to wrap all of our hover states in media queries like this :

.my-class {

  border-color: blue;

  @media(hover: hover) {
    &:hover {
      border-color: red;
    }
  }
}

My question is, is there a cleaner way to write these media queries wrappers when we have the power of LESS? It will be awful lot of duplication. I am hoping that we could create a small annotation or something like that instead of these wrappers.




Aucun commentaire:

Enregistrer un commentaire