nex3/sass — Issue #261: @import regular css files does not show up correcly at top of created file
Author: luisenstrasse
Created: 2012-01-31 23:30:18+00:00
State: open

In a structure like this:

FILE ./style.scss
@import "./vars/vars";

@media projection {
.fakeshadow {
border: {
style: solid;
left: {
width: 4px;
color: $red;
}
right: {
width: 2px;
color: $gruen;
}
}
}
}
FILE ./vars/vars.scss
@import "./vars/vars2";
@import "./vars/vars3.css";

$red : #FF0001;
$gruen : #00FF01;

.image {
background-image : url(./image.png) center center no-repeat ;
}
FILE vars2.scss
.image1 {
background-image : url(./image.png) center center no-repeat ;
}
FILE vars3.css
.image2 {
background-image : url(./image.png) center center no-repeat ;
}

the following output is generated:

/* style.scss */
/* vars.scss */
/* vars.scss */
.image1 {
background-image: url(./image.png) center center no-repeat; }

@import url(./vars/vars3.css);
.image {
background-image: url(./image.png) center center no-repeat; }

@media projection {
.fakeshadow {
border-style: solid;
border-left-width: 4px;
border-left-color: #ff0001;
border-right-width: 2px;
border-right-color: #00ff01; } }

which is not correct as the @import statement @import url(./vars/vars3.css); should be above the vars2.scss inclusion content. Is there a way to keep track of this in the compiler?

Cheers Jan