Что такое SCSS-эквивалент пространств имен LESS, связывание классов - PullRequest
Новая
       5

Что такое SCSS-эквивалент пространств имен LESS, связывание классов

4 голосов
/ 31 декабря 2011

Просматривая ветку 2.0 Bootstrap, я обнаружил, что в LESS есть хороший способ объединения переменных и миксинов.См. Пример кода ниже: 

#font {
  #family {
    .serif() {
      font-family: Georgia, "Times New Roman", Times, serif;
    }
    .sans-serif() {
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    }
    .monospace() {
      font-family: Menlo, Monaco, Courier New, monospace;
    }
  }
  .shorthand(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
    font-size: @size;
    font-weight: @weight;
    line-height: @lineHeight;
  }
  .serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
    #font > #family > .serif;
    #font > .shorthand(@size, @weight, @lineHeight);
  }
  .sans-serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
    #font > #family > .sans-serif;
    #font > .shorthand(@size, @weight, @lineHeight);
  }
  .monospace(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
    #font > #family > .monospace;
    #font > .shorthand(@size, @weight, @lineHeight);
  }
}

Что эквивалентно этому в SCSS?Как мне переписать вышесказанное в SCSS?

1 Ответ

1 голос
/ 04 января 2012

К сожалению, это одна из недостающих функций (по мне) в SCSS сегодня.Ответ на этот вопрос: нет эквивалента SCSS .Вы должны переписать его в формате, совместимом с SCSS.Посмотрите на мое переписывание в моем SCSS Twitter Bootstrap fork например (использует тот самый пример, который вы упомянули).

PS Не используйте этот форк, он сейчас не поддерживается, и вы 'Возможно, лучше воспользоваться тем, что упоминается в вики официального Twitter Bootstrap.( подробности )

...