Re: Sass - Ignore syntax errors or allow custom syntax?

[Roy Tomeij]

Use image-url() and define the actual paths in your config file.

On Wednesday, March 27, 2013 4:56:12 PM UTC+1, Gareth Clubb wrote:

Hey Guys,

I would like to use Sass for a project but we use our own custom syntax in our stylesheets to pull random things from the server - such as image path names etc.

We use a variable like the following:

.background {

    background-image: url({$imgPath}/background.jpg);

}

Where {$imgPath} is our variable. Obviously Sass is screaming at me that this is a syntax error or invalid css and therefore won't compile correctly.

Is there anyway to disable errors (though not a great approach), or allow for such a custom syntax within my css?

Thanks.

[Roy Tomeij]

Which is a Compass helper, by the way.

[Chris Eppstein]

As Roy points out, the compass image-url() helper is designed to help with this. The docs for this can be found here: http://compass-style.org/reference/compass/helpers/urls/

Assuming you don't want to use compass for now. But I'm not clear: is $imgPath a sass variable that you've set elsewhere or is this post-processed and you need {$imgPath} to be in your output exactly.

If the former do this:

$imgPath: "/images" !default; // or wherever you keep you images on your server

@function image-url($img) {

  @return url("#{$imgPath}/#{$img}");

}

.background {

    background-image: image-url("background.jpg");

}

If the latter do this:

@function image-url($img) {

  @return url("{$imgPath}/#{$img}");

}

.background {

    background-image: image-url("background.jpg");

}

Chris

On Wed, Mar 27, 2013 at 8:56 AM, Gareth Clubb <thew...@gmail.com> wrote:

Hey Guys,

I would like to use Sass for a project but we use our own custom syntax in our stylesheets to pull random things from the server - such as image path names etc.

We use a variable like the following:

.background {

    background-image: url({$imgPath}/background.jpg);

}

Where {$imgPath} is our variable. Obviously Sass is screaming at me that this is a syntax error or invalid css and therefore won't compile correctly.

Is there anyway to disable errors (though not a great approach), or allow for such a custom syntax within my css?

Thanks.

--
You received this message because you are subscribed to the Google Groups "Sass" group.
To unsubscribe from this group and stop receiving emails from it, send an email to sass-lang+...@googlegroups.com.
To post to this group, send email to sass...@googlegroups.com.
Visit this group at http://groups.google.com/group/sass-lang?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[Gareth Clubb]

Hi Roy/Chris,

That works perfectly - it was the latter I was after.

Sorry for the late reply, for some reason I didn't receive email notifications but thanks, you've helped a lot.

Cheers,

Gareth