diff --git a/docs/_includes/nav-css.html b/docs/_includes/nav-css.html index 970f5731d..4f5d031db 100644 --- a/docs/_includes/nav-css.html +++ b/docs/_includes/nav-css.html @@ -122,9 +122,6 @@ Using Sass diff --git a/docs/css.html b/docs/css.html index 98a18f062..22439aa77 100644 --- a/docs/css.html +++ b/docs/css.html @@ -3334,153 +3334,8 @@ a {

Installation

-

Use the appropriate guide for your environment of choice.

- -

Rails

- -

bootstrap-sass is easy to drop into Rails with the asset pipeline.

- -

In your Gemfile you need to add the bootstrap-sass gem, and ensure that the sass-rails gem is present—it is added to new Rails applications by default.

- -{% highlight ruby %} -gem 'sass-rails', '>= 3.2' # sass-rails needs to be higher than 3.2 -gem 'bootstrap-sass', '~> 3.0.3.0' -{% endhighlight %} - -

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

- - -

Compass without Rails

- -

Install the gem:

- -{% highlight bash %} -gem install bootstrap-sass -{% endhighlight %} - -

If you have an existing Compass project:

- -{% highlight ruby %} -# config.rb: -require 'bootstrap-sass' -{% endhighlight %} - -{% highlight bash %} -bundle exec compass install bootstrap -{% endhighlight %} - -

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

- -{% highlight bash %} -bundle exec compass create my-new-project -r bootstrap-sass --using bootstrap -{% endhighlight %} - -

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

- - - - -

Sass-only without Compass or Rails

- -

Require the gem, and load paths and Sass helpers will be configured automatically:

- -{% highlight ruby %} -require 'bootstrap-sass' -{% endhighlight %} - -

Using bootstrap-sass as a Bower package is still being tested. You can install it with:

- -{% highlight bash %} -bower install 'git://github.com/twbs/bootstrap-sass.git#v3.0.3.0' -{% endhighlight %} - -

JS and fonts

- -

If you are using Rails or Sprockets, see Usage. If none of Rails/Sprockets/Compass were detected the fonts will be referenced as:

- -{% highlight sass %} -"#{$icon-font-path}/#{$icon-font-name}.eot" -{% endhighlight %} - -

$icon-font-path defaults to bootstrap/. When not using an asset pipeline, you have to copy fonts and javascripts from the gem.

- -{% highlight bash %} -mkdir public/fonts -cp -r $(bundle show bootstrap-sass)/vendor/assets/fonts/ public/fonts/ -mkdir public/javascripts -cp -r $(bundle show bootstrap-sass)/vendor/assets/javascripts/ public/javascripts/ -{% endhighlight %} - -

In ruby you can get the assets' location in the filesystem like this:

- -{% highlight ruby %} -Bootstrap.stylesheets_path -Bootstrap.fonts_path -Bootstrap.javascripts_path -{% endhighlight %} - - -

Usage

- -

Sass

- -

Import Bootstrap into a Sass file (for example, application.css.scss) to get all of Bootstrap's styles, mixins and variables! We recommend against using //= require directives, since none of your other stylesheets will be able to access the Bootstrap mixins or variables.

- -{% highlight sass %} -@import "bootstrap"; -{% endhighlight %} - -

You can also include optional Bootstrap theme:

- -{% highlight sass %} -@import "bootstrap/theme"; -{% endhighlight %} - -

The full list of Bootstrap variables can be found in the Customizer. You can override these by simply redefining the variable before the @import directive, e.g.:

- -{% highlight sass %} -$navbar-default-bg: #312312; -$light-orange: #ff8c00; -$navbar-default-color: $light-orange; - -@import "bootstrap"; -{% endhighlight %} - -

You can also import components explicitly. To start with a full list of modules copy this file from the gem:

- -{% highlight bash %} -# copy and prepend "bootstrap/" to the @import paths: -sed 's/@import "/@import "bootstrap\//' \ -$(bundle show bootstrap-sass)/vendor/assets/stylesheets/bootstrap/bootstrap.scss > \ -app/assets/stylesheets/bootstrap-custom.scss -{% endhighlight %} - -

In your application.sass, replace @import 'bootstrap' with:

- -{% highlight sass %} -@import 'bootstrap-custom'; -{% endhighlight %} - -

Comment out any components you do not want from bootstrap-custom.

- -

JavaScript

- -

We have a helper that includes all Bootstrap javascripts. If you use Rails (or Sprockets separately), put this in your Javascript manifest (usually in application.js) to load the files in the [correct order](/vendor/assets/javascripts/bootstrap.js):

- -{% highlight js %} -// Loads all Bootstrap javascripts -//= require bootstrap -{% endhighlight %} - -

You can also load individual modules, provided you also require any dependencies. You can check dependencies in the [Bootstrap JS documentation][jsdocs].

- -{% highlight js %} -//= require bootstrap/scrollspy -//= require bootstrap/modal -//= require bootstrap/dropdown -{% endhighlight %} +

For information on how to install and use Bootstrap for Sass, consult the GitHub repository readme. It's the most up to date source and includes information for use with Rails, Compass, and standard Sass projects.

+

+ Bootstrap for Sass +

diff --git a/docs/index.html b/docs/index.html index 7d4ef68ea..428121b5e 100644 --- a/docs/index.html +++ b/docs/index.html @@ -26,7 +26,7 @@ title: Bootstrap
Sass and Less support

Preprocesors

-

In addition to vanilla CSS, Bootstrap includes support for the two most popular CSS preprocessors, Less and Sass.

+

In addition to vanilla CSS, Bootstrap includes support for the two most popular CSS preprocessors, Less and Sass.

Responsive across devices