Skip to content

yashilanka/bootstrap-rubygem

 
 

Repository files navigation

Bootstrap Ruby Gem Build Status

This is the future home of the Bootstrap v4 ruby gem for Ruby on Rails (Sprockets) and Compass.

There has not been a release yet, but if you'd like to try out the latest development version, see the instructions below.

Installation

Please see the appropriate guide for your environment of choice:

a. Ruby on Rails

Add bootstrap to your Gemfile:

gem 'bootstrap', git: 'https://github.com/twbs/bootstrap-rubygem'

Ensure that sprockets-rails is at least v2.3.2.

bundle install and restart your server to make the files available through the pipeline.

Import Bootstrap styles in app/assets/stylesheets/application.scss:

// Custom bootstrap variables must be set or import before bootstrap itself.
@import "bootstrap";

Make sure the file has .scss extension (or .sass for Sass syntax). If you have just generated a new Rails app, it may come with a .css file instead. If this file exists, it will be served instead of Sass, so rename it:

$ mv app/assets/stylesheets/application.css app/assets/stylesheets/application.scss

Then, remove all the //= require and //= require_tree statements from the file. Instead, use @import to import Sass files.

Do not use //= require in Sass or your other stylesheets will not be able to access the Bootstrap mixins and variables.

Require Bootstrap Javascripts in app/assets/javascripts/application.js:

//= require jquery
//= require bootstrap-sprockets

While bootstrap-sprockets provides individual Bootstrap components for ease of debugging, you may alternatively require the concatenated bootstrap for faster compilation:

//= require jquery
//= require bootstrap

Tooltips and popovers depend on tether for positioning. If you use them, add tether to the Gemfile:

source 'https://rails-assets.org/' do
  gem 'rails-assets-tether', '>= 1.1.0'
end

Then, run bundle, restart the server, and require tether before bootstrap but after jQuery:

//= require jquery
//= require tether
//= require bootstrap-sprockets

b. Compass without Rails

Install the gem from GitHub master:

$ gem install specific_install
$ gem specific_install https://github.com/twbs/bootstrap-rubygem.git

If you have an existing Compass project:

  1. Require bootstrap in config.rb:

    require 'bootstrap'
  2. Install Bootstrap with:

    $ bundle exec compass install bootstrap

If you are creating a new Compass project, you can generate it with bootstrap support:

$ bundle exec compass create my-new-project -r bootstrap --using bootstrap

or, alternatively, if you're not using a Gemfile for your dependencies:

$ compass create my-new-project -r bootstrap --using bootstrap

This will create a new Compass project with the following files in it:

Some bootstrap mixins may conflict with the Compass ones. If this happens, change the import order so that Compass mixins are loaded later.

Configuration

Sass: Autoprefixer

Bootstrap requires the use of Autoprefixer. Autoprefixer adds vendor prefixes to CSS rules using values from Can I Use.

If you are using bootstrap with Rails, autoprefixer is set up for you automatically. Otherwise, please consult the Autoprefixer documentation.

Sass: Individual components

By default all of Bootstrap is imported.

You can also import components explicitly. To start with a full list of modules copy _bootstrap.scss file into your assets as _bootstrap-custom.scss. Then comment out components you do not want from _bootstrap-custom. In the application Sass file, replace @import 'http://github.com/bootstrap' with:

@import 'bootstrap-custom';

About

Bootstrap 4 Ruby Gem for Rails / Sprockets and Compass.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Ruby 49.8%
  • CSS 45.4%
  • HTML 4.5%
  • JavaScript 0.3%