Application d'un bloc de code pour les pseudo-classes en LESS

Créons une fonction qui définira les styles d'un lien dans l'état hover.

Laissons cette fonction accepter un bloc de code comme paramètre :

styles.less.hover(@code) {
  
}

Affichons le bloc de code passé à l'intérieur de l'état hover :

styles.less.hover(@code) {
  &:hover {
    @code();
  }
}

Utilisons notre fonction à l'intérieur d'un lien :

styles.lessa {
  color: red;
  
  .hover({
    color: blue;
    text-decoration: none;
  });
}

Résultat de la compilation :

styles.cssa {
  color: red;
}
a:hover {
  color: blue;
  text-decoration: none;
}
Задание 1

Créez une fonction similaire qui définira les styles pour un champ de saisie dans l'état focus.