bootswatch-rails
This gem is meant to be used with bootstrap-sass. It gives you complete scss versions of bootswatches for use in your Rails asset pipeline, just like bootstrap-sass gives you scss version of bootstrap itself.
Installation
Add this line to your application's Gemfile, in assets group:
gem 'bootswatch-rails'
And then execute:
$ bundle
Usage
When using bootstrap-sass, it's recommended to avoid sprockets in your
stylesheets. In order to do that you simply rename your application.css
file
to application.css.scss
, remove all sprockets comments, and instead use sass
@import
commands. These commands are smart enough to fully support asset
pipeline load paths, thanks to sass-rails
gem.
Here's approximately how your application.css.scss
file should look like,
considering that you're using
bootstrap-sass.
// Example using 'Cerulean' bootswatch
//
// First import cerulean variables
@import "bootswatch/cerulean/variables";
// Then bootstrap itself
@import "bootstrap";
// Bootstrap body padding for fixed navbar
body { padding-top: 60px; }
// And finally bootswatch style itself
@import "bootswatch/cerulean/bootswatch";
// Whatever application styles you have go last
@import "base";
Overriding bootswatch variables
Since version 3.1 it's possible to override variables.
// First set or import your overrides
$textColor: #000;
// Then load variables
@import "bootswatch/journal/variables";
// Then the rest as shown above...
Bootswatches
Included bootswatches
- Amelia
- Cerulean
- Cosmo
- Cyborg
- Darkly
- Flatly
- Journal
- Lumen
- Paper
- Readable
- Sandstone
- Simplex
- Slate
- Spacelab
- Superhero
- United
- Yeti
Contributing
- Fork it
- Create your feature branch (
git checkout -b my-new-feature
) - Commit your changes (
git commit -am 'Added some feature'
) - Push to the branch (
git push origin my-new-feature
) - Create new Pull Request
Please see CONTRIBUTING for more detail. (Dont change the scss files by hand, use the converter and rearranger first, and make your changes in those if possible)
Note about converter
I am trying to automate this project as much as possible, so I wrote a script that does most of the work converting less to scss. If you want to contribute a fix that's easily automatable and you know ruby, please add a processor to the converter.
Credits
Big thanks to these guys.