Skip to content

Instantly share code, notes, and snippets.

@nex3
Created February 9, 2012 21:04
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nex3/1783082 to your computer and use it in GitHub Desktop.
Save nex3/1783082 to your computer and use it in GitHub Desktop.
$ ./bin/sass --scss
.foo {a: b}
.bar {c: d}
.baz {@extend .foo, .bar}
Syntax error: Invalid CSS after ".baz {@extend .foo": expected "}", was ", .bar}"
on line 3 of standard input
Use --trace for backtrace.
@nathos
Copy link

nathos commented Feb 9, 2012

This:

// Prototype classes to @extend
.full
  +grid(12)

.full-nested
  @extend .full
  @extend .alpha, .omega

.twothirds
  +grid(8)

.onethird
  +grid(4)

.half
  +grid(6)

.alpha
  +alpha

.omega
  +omega


// Semantic grid definitions
#casestudy-intro
  @extend .full
  .image-slider
    @extend .twothirds, .alpha
  .headline
    @extend .onethird, .omega

#casestudy-body
  @extend .full
  .casestudy-content-block
    @extend .full-nested
  .content-left, .content-right
    @extend .half
  .content-left
    @extend .alpha
  .content-right
    @extend .omega

gives me:

/* line 27, grid/_960gs.sass */
.full, .full-nested, .casestudy-body .casestudy-content-block, .casestudy-intro, .casestudy-body {
  display: inline;
  float: left;
  margin-left: 15px;
  margin-right: 15px;
  width: 930px; }

/* line 34, grid/_960gs.sass */
.twothirds, .casestudy-intro .image-slider {
  display: inline;
  float: left;
  margin-left: 15px;
  margin-right: 15px;
  width: 610px; }

/* line 37, grid/_960gs.sass */
.onethird, .casestudy-intro .headline {
  display: inline;
  float: left;
  margin-left: 15px;
  margin-right: 15px;
  width: 290px; }

/* line 40, grid/_960gs.sass */
.half, .casestudy-body .content-left, .casestudy-body .content-right {
  display: inline;
  float: left;
  margin-left: 15px;
  margin-right: 15px;
  width: 450px; }

/* line 43, grid/_960gs.sass */
.alpha, .full-nested, .casestudy-body .casestudy-content-block, .casestudy-intro .image-slider, .casestudy-body .content-left {
  margin-left: 0; }

/* line 46, grid/_960gs.sass */
.omega, .full-nested, .casestudy-body .casestudy-content-block, .casestudy-intro .headline, .casestudy-body .content-right {
  margin-right: 0; }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment