Uncompiling Mixins in LESS

The class we use as a mixin will also be included in the compilation output.

There are, however, situations when we want to create some piece of code as a blank for use in other places in the code, and at the same time this piece itself will not be used.

To prevent a mixin from being compiled, you need to put parentheses after its name, like this:

styles.less.mix() {
  width: 100px;
  height: 100px;
}

Задание 1

Tell me what the result of compiling the following code will be:

styles.less.mix() {
  color: white;
  background: black;
}

p {
  .mix;
  width: 300px;
}

Задание 2

Tell me what the result of compiling the following code will be:

styles.less.mix1() {
  color: white;
  background: black;
}
.mix2() {
  width: 300px;
  height: 300px;
}

p {
  .mix1;
  .mix2;
}

Задание 3

Create a mixin .tnr, which will specify a font of the Times New Roman family.

Задание 4

Create a mixin .df that will set the display property to flex.

Задание 5

Create a mixin .bold that will set the font-weight property to bold.

Задание 6

Create a mixin .nowrap that will set the property white-space to nowrap.