_bem.scss

/**
 * Основная часть.
 */
@import "settings";

/**
 * Возвращает имя класса элемента.
 *
 * @param string $block   Имя блока.
 * @param string $element Имя элемента.
 *
 * @return string
 */
@function element-class($block, $element) {
    @return #{$block}#{$bem-element-separator}#{$element};
}

/**
 * Блок БЭМ.
 *
 * @param string $name Имя блока.
 */
@mixin block($name) {
    .#{$name} {
        @content;
    }
}

/**
 * Элемент блока БЭМ.
 *
 * @param string      $name  Имя элемента (или блока, если указан аргумент $extra).
 * @param string|bool $extra Имя элемента, если указан.
 */
@mixin element($name, $extra: false) {
    @if $extra {
        .#{element-class($name, $extra)} {
            @content;
        }
    } @else {
        &#{$bem-element-separator}#{$name} {
            @content;
        }
    }
}

/**
 * Модификатор БЭМ.
 *
 * @param string      $property Имя свойства.
 * @param string|bool $value    Необязательное значение свойства.
 */
@mixin modifier($property, $value: true) {
    @if $value == true or $value == yes {
        &#{$bem-modifier-separator}#{$property} {
            @content;
        }
    } @else {
        &#{$bem-modifier-separator}#{$property}#{$bem-modifier-value-separator}#{$value} {
            @content;
        }
    }
}