Getting Susy and Compass installed with ruby on rails

Question

I'm just starting with ruby on rails and one of the first things I tried to do was install the gems compass and susy. After figuring out that I needed to include them in the gemfile (I'm using RubyMine and thought it would do it for me), I still got a missing "Could not find", "susy" error when I tried to import susy into one of my css.scss files.

I have ruby version 1.9.3 (194)

and ruby gems version 1.8.23

Any help on which gems (and versions) I need in my bundle, how to make sure they get in the project bundle, is greatly appreciated.

Answer 1

I'm on rails 3.2.7 and use Susy (and Compass) like this.

##### Gemfile:
group :assets do
  gem 'sass-rails',   '~> 3.2.3'
  gem 'coffee-rails', '~> 3.2.1'
  gem 'compass-rails'
  gem 'susy', git: "git://github.com/ericam/susy.git"
  gem 'uglifier', '>= 1.0.3'
end

Then I have several different css files. application.css.scss, screen.css.scss and _base.scss.css.

application.css.scss

#### application.css.scss:
@import "screen";
# Here you import your normal .scss files as well, like:
# @import "products";

screen.css.scss

#### screen.css.scss
// ---------------------------------------------------------------------------
// Imports
@import "compass";
@import "base";

/* -------------------------------------------------------------------------*/
/* Layout */
// Here you can add layout styling or whatever... :)

_base.css.scss

// ---------------------------------------------------------------------------
// Imports

@import "susy";

// ---------------------------------------------------------------------------
// Basic Grid

$total-columns  : 12;
$column-width   : 4em;
$gutter-width   : 1em;
$grid-padding   : $gutter-width;

$show-grid-backgrounds  : true;

And that's it. Now you can use Susy in all your scss files that you import in application.css.scss.

I hope it helps you to get started.