Anvendelse av kodeblokk for pseudoklasser i LESS

La oss lage en funksjon som vil sette stilene til en lenke i hover-tilstand.

La denne funksjonen ta en kodeblokk som parameter:

styles.less.hover(@code) {
  
}

La oss skrive ut den overførte kodeblokken inni hover-tilstanden:

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

La oss bruke funksjonen vår inne i en lenke:

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

Resultat av kompilering:

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

Lag en tilsvarende funksjon som vil sette stiler for en input i focus-tilstand.