Giter Site home page Giter Site logo

bourbon's Introduction

Bourbon logo

A Lightweight Sass Tool Set

Bourbon is a library of Sass mixins and functions that are designed to make you a more efficient style sheet author.

It is…

  • Dependency-free: Bourbon is pure Sass.
  • Human-readable: We aim for clarity over brevity.
  • Lightweight: Zero output post-install and has no visual opinion.

The current stable version is 4.3.4. The master branch on GitHub is version 5.0.0.beta.8.

Helpful Links

Table of Contents

Requirements

Installation

  1. Install the Bourbon gem using the RubyGems package manager:

    gem install bourbon

    Alternatively, you can install Bourbon with Bower.

  2. Install the Bourbon library into the current directory:

    bourbon install

    Pro Tip: You can target installation into a specific directory using the path flag:

    bourbon install --path my/custom/path/
  3. Import Bourbon at the beginning of your stylesheet:

    @import "bourbon/bourbon";

    It’s not recommended that you modify Bourbon’s files directly as it will make updating to future versions difficult, by overwriting your custom changes or causing merge conflicts.

Installation for Ruby on Rails 4.2+

  1. Add Bourbon to your Gemfile:

    gem "bourbon"
  2. Then run:

    bundle install
  3. Restart your server and rename application.css to application.scss:

    mv app/assets/stylesheets/application.css app/assets/stylesheets/application.scss
  4. Delete all Sprockets directives in application.scss (require, require_tree and require_self) and use Sass’s native @import instead (why?).

  5. Import Bourbon at the beginning of application.scss. Any project styles that utilize Bourbon’s features must be imported after Bourbon.

    @import "bourbon";
    @import "home";
    @import "users";

Installing with npm and using a Node-based asset pipeline

  1. Add Bourbon as a dependency:

    npm install --save bourbon
  2. If you’re using eyeglass, skip to Step 3. Otherwise, you’ll need to add Bourbon to your node-sass includePaths option. require("bourbon").includePaths is an array of directories that you should pass to node-sass. How you do this depends on how node-sass is integrated into your project.

  3. Import Bourbon into your Sass files:

    @import "bourbon";

Installing older versions of Bourbon

  1. Uninstall any Bourbon gem versions you already have:

    gem uninstall bourbon
  2. Reinstall the Bourbon gem, using the -v flag to specify the version you need:

    gem install bourbon -v 4.2.7
  3. Follow the instructions above to install Bourbon into your project.

Command Line Interface

bourbon [options]

Options

Option Description
-h, --help Show help
-v, --version Show the version number
--path Specify a custom path
--force Force install (overwrite)

Commands

Command Description
bourbon install Install Bourbon into the current directory
bourbon update Overwrite and update Bourbon in the current directory
bourbon help Show help

Browser Support

Bourbon supports Internet Explorer 11+ and the latest versions of Chrome, Firefox, Safari, and Edge.

The Bourbon Family

Bourbon is part of a larger, modular family of Sass utilities:

  • Neat: A lightweight and flexible Sass grid
  • Bitters: Scaffold styles, variables and structure for Bourbon projects
  • Refills: Components and patterns built with Bourbon and Neat

Contributing

See the contributing document. Thank you, contributors!

License

Bourbon is copyright © 2011-2017 thoughtbot, inc. It is free software, and may be redistributed under the terms specified in the license.

About

Bourbon is maintained by Tyson Gach and the thoughtbot design team. It is funded by thoughtbot, inc. and the names and logos for thoughtbot are trademarks of thoughtbot, inc.

thoughtbot

We love open-source software! See our other projects or hire us to design, develop, and grow your product.

bourbon's People

Contributors

bmorrall avatar borodean avatar chriseppstein avatar cllns avatar conchan avatar glovertom avatar hmps avatar hotmeteor avatar jamiebuilds avatar joshuaogle avatar kennethormandy avatar kittygiraudel avatar knuton avatar kylefiedler avatar mattbrictson avatar mendozagioo avatar metaskills avatar mike-burns avatar mikeymike avatar mjankowski avatar mmwtsn avatar mondoreale avatar renaudleo avatar sebmor avatar sikachu avatar thibaut avatar tmazeika avatar travishaynes avatar tysongach avatar whmii avatar

Watchers

 avatar  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.