2013-05-15 2 views
1

Я использую Susy/Compass/SASS для простой реагирующей сетки в моем текущем проекте. Однако компилятор Compass не будет компилировать смешение Susy's at-breakpoint mixin. Вот моя сетка:Compass компилирует ошибку при смешивании Susy's at-breakpoint

+border-box-sizing 

$total-columns : 3 
$column-width : 4.5em 
$gutter-width : 1em 
$grid-padding : $gutter-width 
$container-style: fluid 

$break-1: 6 
$break-2: 10 

body 
    +container($total-columns, $break-1, $break-2) 

.list 
    +span-columns(3) 
.detail 
    display: none 

+at-breakpoint($break-1) { 
    .detail 
     +squish(1) 
     +span-columns(3) 
    .list 
     +span-columns(2 omega) 
} 

+at-breakpoint($break-2) { 
    .detail 
     +squish(1,1) 
     +span-columns(5) 
    .list 
     +span-columns(3 omega) 
} 

Когда компас пытается собрать, я получаю сообщение об ошибке: error screen.sass (Line 20 of _grid.sass: Invalid CSS after "($break-1) ": expected expression (e.g. 1px, bold), was "{") identical screen.css.

Если найдено a previous question похожее на мое, что предлагало compass-susy-plugin был виновником. Я удалил это (не уверен, что у меня было это для начала) и снова установил жемчужину Susy, но я все равно получаю ошибку.

У кого-нибудь была эта или аналогичная проблема? Заранее спасибо за вашу помощь!

ответ

1

Суси поддерживает синтаксис с отступом Sass. Проблема в том, что вы используете гибрид обоих синтаксисов. Попробуйте это:

@import "susy" 

+border-box-sizing 

$total-columns : 3 
$column-width : 4.5em 
$gutter-width : 1em 
$grid-padding : $gutter-width 
$container-style: fluid 

$break-1: 6 
$break-2: 10 

body 
    +container($total-columns, $break-1, $break-2) 

.list 
    +span-columns(3) 
.detail 
    display: none 

+at-breakpoint($break-1) 
    .detail 
     +squish(1) 
     +span-columns(3) 
    .list 
     +span-columns(2 omega) 

+at-breakpoint($break-2) 
    .detail 
     +squish(1,1) 
     +span-columns(5) 
    .list 
     +span-columns(3 omega) 

Уведомление не являются фигурные скобки после at-breakpoint() Mixins. Просто отступ.

+0

Право на. Спасибо! – raddevon

-3

Я нашел проблему. Susy не поддерживает синтаксис с отступом SASS. Бу!

Я добавил в кучу фигурных скобок, точек с запятой и @include s, чтобы исправить это.

UPDATE: ОК, проблема была не поддержка синтаксиса SASS. Это было мое использование фигурных скобок в отступом синтаксиса! По какой-то причине мой мозг решил, что блок кода должен быть в фигурных скобках, поскольку он будет передан в mixin. Моя ошибка и мои извинения перед девами Сьюзи.

+1

Все плагины Sass поддерживают оба синтаксиса. Нет способа поддержать только один. –

+0

@EricMeyer Спасибо, что указали мою ошибку. Обновлен мой ответ выше. – raddevon

Смежные вопросы