bootswatches

NOTE: This documentation only applies to the 6.x version of Blacklight. It does not work with Blacklight 7

Bootswatches

One approach to styling Bootstrap-based sites is using "bootswatches", which are simple bootstrap themes that override SASS variables, mixins and declarations.

First, add the bootswatch-rails gem to your Gemfile (and run bundle install):

gem 'bootswatch-rails'

This will give you the set of themes from http://bootswatch.com/, converted to SASS and exposed to the Rails asset pipeline.

Out of the box, your application's blacklight stylesheet (generated by default to app/assets/stylesheets/blacklight.css.scss) looks something like:

@import 'bootstrap';

@import 'blacklight/blacklight';

To add the one of the bootswatch themes ('cerulean' in this example):

@import "bootswatch/cerulean/variables";

@import "bootstrap";

@import "bootswatch/cerulean/bootswatch";

@import 'blacklight/blacklight'

The bootswatch-rails documentation provides similar directions, a list of available out-of-the-box themes, and more.

As of this writing, not all bootswatch-rails themes seem to be bootstrap 2.1.x compatible, or do weird things to the Blacklight navbar, etc. Your milage may vary.