Zastosowanie bloku kodu dla pseudoklas w LESS
Stwórzmy funkcję, która będzie ustawiać
style linku w stanie hover.
Niech ta funkcja przyjmuje blok kodu jako parametr:
.hover(@code) {
}
Wyprowadźmy przekazany blok kodu wewnątrz
stanu hover:
.hover(@code) {
&:hover {
@code();
}
}
Wykorzystajmy naszą funkcję wewnątrz linku:
a {
color: red;
.hover({
color: blue;
text-decoration: none;
});
}
Wynik kompilacji:
a {
color: red;
}
a:hover {
color: blue;
text-decoration: none;
}
Stwórz podobną funkcję, która będzie
ustawiać style dla inputa w stanie focus.