Pregunta

Using:

  • susy (2.0.0.alpha.6)
  • sass (3.3.0.rc.2)
  • compass (1.0.0.alpha.17)

with the following SCSS:

$susy: (
    columns: 12,
    column-width: 5em,
    gutter-width: 1em,
    gutter-position: after,
    grid-padding: gutter-width,
);

$small: 36em;
$medium: 50em;
$large: 65em;

.hlt-container{
    @include at-breakpoint($small) {
        @include span(6);
        @include nth-omega(2n);
        margin-bottom: gutter(12);
    }

    @include at-breakpoint($small $large) {
        &:last-child:nth-child(odd){
            float: none;
            clear: both;
            margin-right: auto;
            margin-left: auto;
        }
    }

    @include at-breakpoint($large) {
        @include span(4);
        @include remove-nth-omega(2n,12);
        @include nth-omega(3n);
        margin-bottom: 0;
    }
}

I first get the error: error source/scss/style.scss (Line 10 of source/scss/01-molecules/02-blocks/_00-highlight-block.scss: Undefined mixin 'at-breakpoint'.)

If I remove the at-breakpoint styles, It moves on and chokes again on remove-nth-omega: error source/scss/style.scss (Line 26 of source/scss/01-molecules/02-blocks/_00-highlight-block.scss: Undefined mixin 'remove-nth-omega'.)

I've searched through docs and Googled everything I could think of, but can't seem to find issues, like perhaps at-breakpoint and remove-nth-omega being deprecated with Susy Next.

EDIT:

If I change back to

  • compass (0.12.2)
  • sass (3.2.12)
  • susy (1.0.9)

(thank goodness for RVM & gemsets)

and revert the .scss to reflect older Susy syntax:

$columns: 12;
$column-width: 5em;
$gutter-width: 1em;
$gutter-position: after;
$grid-padding: $gutter-width;

$small: 36em;
$medium: 50em;
$large: 65em;

.hlt-container{
    @include at-breakpoint($small) {
        @include span-columns(6,12);
        @include nth-omega(2n);
        margin-bottom: gutter(12);
    }

    @include at-breakpoint($small $large) {
        &:last-child:nth-child(odd){
            float: none;
            clear: both;
            margin-right: auto;
            margin-left: auto;
        }
    }

    @include at-breakpoint($large) {
        @include span-columns(4,12);
        @include remove-nth-omega(2n);
        @include nth-omega(3n);
        margin-bottom: 0;
    }
}

everything works fine.

¿Fue útil?

Solución 2

Yes, both of those mixins are being deprecated in Susy 2.0, so neither is available in alpha. We haven't built a clean upgrade path yet, but I promise there's one on the way.

Otros consejos

if you want to use the old susy syntax then write:

// With Susy 2 installed...
   @import "susyone";

instead of

// With Susy 2 installed...
   @import "susy";

I had this same problem with at-breakpoint and once I switched over it was fine. > susy documentation

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top