compass-sass

In section 2.2.2, "CSS and Sass" , I'm told to put image-url('delete.png') in my sass. And so I have. However, it is generating CSS like background-image: url(/images/delete.png) instead of the thing that I'm told everywhere it should be generating, the correct and obvious thing, background-image: url(/assets/delete.png) What. The heck. I have spent literal days trying to figure out where this is coming from. Here's a gist of relevant settings that are resulting in this behavior. Here's a gist of the same files in an earlier version of our code base (right after we implemented the asset

I've successfully set up my heroku app with the grunt buildpack . When I push my Node.js app to heroku it will run the appropriate grunt task. What I'd like is to use the 'grunt-contrib-compass' package to compile my .scss files. But that requires the compass executable and I don't know how to get that. I've checked the heroku documentation and have seen an outdated doc that describes setting up compass with ruby ... but I haven't seen any recent documentation for setting it up with Node.js. Any ideas? This took a lot of figuring out, but I've finally managed to get it to work. What's needed

I'm trying to make a button mixin like this: =default_button(!lighter, !darker) :border= 1px !lighter solid :background-color #e3e3e3 :background= -webkit-gradient(linear, 0 0, 0 100%, from(!lighter), to(!darker)) repeat-x, #d0581e :background= -moz-linear-gradient(90deg, !darker, !lighter) repeat-x scroll 0 0 #d0581e :filter= progid:DXImageTransform.Microsoft.gradient(startColorstr='!lighter', endColorstr='!darker') :-ms-filter= "progid:DXImageTransform.Microsoft.gradient(startColorstr='!lighter', endColorstr='!darker')" :zoom 1 :margin 0 0 0 0 :width auto :padding 2px 14px 2px 14px :border

I am trying to use a Compass font-face mixin, which contains the inclusion of *.eot?iefix My app/assets/fonts contains all the font types needed, including .eot. When I try to run assets:precompile the task fails saying something like: webfont.eot?iefix isn't precompiled Do you know the possible solution for this problem? It runs with no error in case I have config.assets.compile = true, but as I've understood it's better not to use it on production. You can do it with pure Scss too: @font-face { font-family: 'DroidSans'; src: url(font-path('DroidSans-webfont.eot')); src: url(font-path(

If I'm using compass for CSS and use a function or mixin like: @include background-image(linear-gradient(#a3cce0, #fff)); is there any easy way to have compass add !important to every line it generates? UPDATE : new versions of sass support this syntax now: @include border-radius(5px !important); Just do this (as noted in @naoufal answer). --- old answer --- You can not use !important with compass mixings, but the culprit is not compass, you should blame sass for this. @include border-radius(5px) !important; #=> SASS Syntax Error You can include it inside the mixin like so: @include border

A while ago I was using compass to generate stylesheets from sass for a project. Recently I returned to that project. I went to my sass directory and did "compass watch --debug .:." This generated the error "You must compile individual stylesheets from the project directory". I discovered that there was no config.rb in the directory. So I recreated one. It looks like this: http_path = "/" css_dir = "/css" sass_dir = "/css" images_dir = "/img" javascripts_dir = "/js" preferred_syntax = :sass However, all of my attempts to use compass result in the same error, no matter what values I put in the

I have clean new Rails 4 app with Gemfile: #default gems gem 'compass-rails' gem 'zurb-foundation' gem 'thin' with style.scss: @import "compass"; @import "foundation/variables"; $red: rgb(255,0,1); $green: rgb(51,153,50); $body-bg: #F4F4F4; $body-font-color: #7B7B7B; $primary-color: #999; $secondary-color: #0CC; $dark-color: #393939; $block-container-border-color: rgb(218,218,218); $block-container-shadow-color: rgb(208,208,208); // main background html{ background:image-url('bckg.jpg'); } body{ width:1000px; margin:0 auto; @include box-shadow(0px 0px 32px -5px #000); } And I have this error:

I'm trying to decide if I should include Compass when starting a new Rails 3.1 project. I haven't used Compass before. Rails 3.1 now supports SCSS directly. The Rails 3.1 asset pipeline (via sprockets) now compiles stylesheets automatically. And I can use a SCSS version of a CSS framework such as Blueprint directly. What benefits will I get from using Compass with Rails 3.1? Bourbon (by Thoughtbot) is a light alternative to compass that integrates well with rails 3.1. It has the main css3 mixins you get with compass (background-images, box shadow, border radius, gradients...). It also has