How to use Preboot mixins in a Rails project with Twitter Bootstrap - ruby-on-rails

Question

I'm looking for a way to use the Less Preboot mixins in my Rails project.
Gems Gemfile:
gem "less-rails"
gem "twitter-bootstrap-rails"
Layout application.html.erb:
<%= stylesheet_link_tag "application", :media => "all" %>
Stylesheet application.css.less.erb:
/*
*= require bootstrap_and_overrides
*= require_self
*/
.navbar .navbar-inner {
#gradient > .vertical(#333,#000);
}
But the Preboot mixin #gradient > .vertical is not found, giving this error:
#gradient > .vertical is undefined
(in */app/assets/stylesheets/application.css.less.erb)
The Bootstrap Github page tells me it was built with Preboot:
"Bootstrap was built with Preboot" (Source: https://github.com/seyhunak/twitter-bootstrap-rails#using-with-less)

Answer 1

I believe you have to define - override the styles provided by Twitter Bootstrap - all the css components in the bootstrap_and_overrides.css.less file. You can create your ids and classes through your application and define the style in this file... Well, this is the way I use twitter-bootstrap-rails...
There are other options... this article compare some of them: http://rubysource.com/twitter-bootstrap-less-and-sass-understanding-your-options-for-rails-3-1/
Also, there is a very good railscast about it: http://railscasts.com/episodes/328-twitter-bootstrap-basics?view=asciicast

Answer 2

If you want to use the Preboot mixins in your Rails project with twitter bootstrap you need to add the following to the top of the LESS file you want to use them in:
#import "twitter/bootstrap/variables";
#import "twitter/bootstrap/mixins";
After this you are able to use the gradients, and all other Preboot mixins:
#content {
#gradient > .vertical( #eee, #ccc );
}