SASS-da üýtgeýänleriň we mazmun bloglarynyň görünýän çäginiň

Mazmun bloglary miksinä geçirilende, olaryň görünýän çägi blogyň ýerleşişine bagly bolýar, miksine däl. Şonuň üçin, geçirilýän mazmun blogynda miksiniň ýerli üýtgeýänlerini ulanyp bolmaýar, sebäbi ol diňe global üýtgeýänler bilen işläp biler.

Aşakdaky mysala serediň:

styles.scss$size: 14px;
  @mixin sizes ($size: 20px) {
    font-size: $size;
    padding: $size;
    @content;
}

.navbar {
  @include sizes {
    margin: $size;
  }
}

Kompilýasiýanyň netijesi:

styles.css.navbar {
  font-size: 20px;
  padding: 20px;
  margin: 14px; 
}

Задание 1

Aşakdaky kodyň kompilýasiýa netijesi näme bolar?

styles.scss$color: yellow;

@mixin links ($color: red) {
  background: $color;
  @content;
}

Задание 2

Aşakdaky kodyň kompilýasiýa netijesi näme bolar?

styles.scss$color: yellow;
$size: 10px;

@mixin links ($color: red, $size: 12px) {
  background-color: $color;
  font-size: $size;
  @content;
}

.navbar {
  @include links {
    box-shadow: $color;
    padding: $size;
  }
}

Задание 3

Aşakdaky kodyň kompilýasiýa netijesi näme bolar?

styles.scss$color: green;
$size: 6px;

@mixin links ($color: red, $size: 10px) {
  color: $color;
  font-size: $size;
  @content;
}

.navbar {
  @include links {
    border-color: $color;
    margin: $size;
  }
}

#active{
  @include links{
    background-color: $color;
    padding-top: $size;
    padding-bottom: $size * 2;
  }
}