Точка останова Sass не работает

Я проверил все возможности и не видел никаких проблем.

config.rb

Иметь следующую строку: require 'breakpoint'

style.scss

также @import "breakpoint";

Я пытаюсь так:

$medium: 96rem; // or even $medium: 51rem 96rem;

.any-class{
    @include breakpoint($medium);
    //change any property
}

Я не вижу никакого эффекта в скомпилированном файле css, только новые свойства, которые переопределяют предыдущие. Я использую Sass 3.4.13 (Selective Steve) и Compass 1.0.1 (Polaris).

Изменить: пример результата компиляции:

//Sass
html{
    font-size: 62.5%;
}
body{
    @include breakpoint(100rem);
    background-color: #000;
}

скомпилировано:

//Css
html {
  font-size: 62.5%;
}
body {
}
body {
  background-color: #000;
}

sass media-queries compass-sass breakpoint-sass
person Garrett    schedule 05.05.2015    source источник
comment
rem не является допустимой единицей для медиа-запросов, поэтому они не будут работать.   -  person Snugug    schedule 05.05.2015
comment
@Snugug Конечно, попробуйте сами. Это тоже подтверждает.   -  person cimmanon    schedule 05.05.2015
comment
@Snugug Я пробовал rem в обычных медиа-запросах, и все работает нормально.   -  person Garrett    schedule 05.05.2015
comment
@cimmanon Это не дубликат. В моем случае точка останова не срабатывает, что бы я ни указывал - 1000 [единиц] или без единиц. У меня также нет ошибок компиляции.   -  person Garrett    schedule 05.05.2015
comment
Вот почему я прошу скомпилированные результаты.   -  person cimmanon    schedule 05.05.2015
comment
@cimmanon добавил результат компиляции.   -  person Garrett    schedule 05.05.2015

Ответы (1)


arrow_upward
1
arrow_downward

Это потому, что вы неправильно используете миксин. Миксин точки останова — это миксин с поддержкой @content, стили, предназначенные для этого миксина, должны быть помещены в фигурные скобки:

body{
    @include breakpoint(100rem) {
      background-color: #000;
    }
}

Выход:

@media (min-width: 100rem) {
  body {
    background-color: #000;
  }
}
person cimmanon    schedule 05.05.2015
comment
О боже, этот пример breakpoint-sass.com не подходит для слепых! :) Не заметил этих фигурных скобок... Спасибо. - person Garrett; 05.05.2015
comment
Да, контраст с подсветкой синтаксиса очень плохой, едва видны фигурные скобки. - person cimmanon; 05.05.2015