Code Monkey home page Code Monkey logo

bootstrap-sass-rails's Introduction

Bootstrap::Sass::Rails

Bootstrap is Twitter's toolkit for kickstarting CSS for websites, apps, and more. It includes base CSS styles for typography, forms, buttons, tables, grids, navigation, alerts, and more.

Twitter Bootstrap has been converted to Sass which makes it possible to use the default Rails Asset Pipeline

  • All assets have been namespaced within twitter/bootstrap to avoid naming conflicts
  • Top level requires for sprockets to get the complete bundle with a simple = require twitter/bootstrap
  • Ability to import individually namespaced stylesheets or javascripts.

Usage

Stylesheets

The easiest way to use Twitter Bootstrap is to require it in your application.css file.

/*
 *= require twitter/bootstrap
 */

#example {
  /* Your styles... */
}

If you need access to the variables within the Twitter Bootstrap framework or want to use the mixins you will need to import it within an .css.scss file. This will still include the complete framework.

@import "twitter/bootstrap";

#foo {
  @include border-radius(4px);
}

Using only parts of the framework like variables and mixin you can import all of these individually from within .css.scss files.

@import "twitter/bootstrap/variables";
@import "twitter/bootstrap/mixins";

@mixin myButton($radius: 5px) {
  @include border-radius($radius);
}

#foo {
  @include myButton(10px);
}

Javascripts

Using the JavaScript works the same way. You can include them all with a single require directive from your application.js.

//= require twitter/bootstrap

$(document).ready(function(){
});

If you only want a part of the javascripts require the individual files from your .js file.

//= require twitter/bootstrap/modal

$(document).ready(function(){
});

Versioning

This gem will directly track the semantic versioning releases of the Twitter Bootstrap project. If it should be necessary a build number will be added to the version to mark releases specific to this gem.

Note on Patches / Pull Requests

  • Fork the project.
  • Make your feature addition or bug fix.
  • Add tests for it. This is important so I don't break it in a future version unintentionally.
  • Commit, do not mess with rakefile, version, or history. (if you want to have your own version, that is fine but bump version in a commit by itself I can ignore when I pull)
  • Send me a pull request. Bonus points for topic branches.

Credits

This work incorporates Twitter Bootstrap by Twitter, Inc.
This gem has been inspired by less-rails-bootstrap by Ken Collins

Maintainers

License

Apache License, Version 2.0

Copyright

Copyright 2011-2012 Morton Jonuschat
Twitter Bootstrap copyright 2011-2012 Twitter, Inc

bootstrap-sass-rails's People

Contributors

mjonuschat avatar tiwatson avatar ys avatar

Stargazers

Cédric Dekimpe avatar

Watchers

Cédric Dekimpe avatar James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.