SASS / SCSS изменить значение переменной перед расширением

Question

У меня есть Bootstrap 3.3.7 и пользовательские файлы scss.

Я хочу переопределить $ grid-float-breakpoint только один раз, прежде чем @extend оценит.Прямо сейчас у меня есть 3 класса, которые расширяют базовый класс начальной загрузки (они используют значение по умолчанию, поэтому я не хочу с ними связываться).

В документах при использовании миксинов и включения это возможно.Можно ли использовать .class и @extend?

Я ищу что-то вроде

    $foo : 1px;

    .normal-class {
      font-size: $foo;
    }

    .extended-normal-class {
      @extend .normal-class;
      font-color: yellow;
    }

    -- This is what I'm trying to do: ---------------------
    .override-class {
      $foo: 3px;
      @extend .normal-class; 
     // font-size in this class after compile should have 3px;
    }

Answer 1

Чтобы достичь того, что вам нужно, вы должны использовать @mixin вместо @extend, вот следующий пример:

@mixin size($size: 1px){
   font-size: $size;
}

.extended-normal-class{
   @include size();
}

.override-class{
   @include size(3px);
}