Makerstrap

A Bootstrap theme based on Webmaker’s style guide

Check out our demo page, which showcases much of what Makerstrap can do.

Usage

bower install makerstrap

How lazy are you?

Real frikin lazy

Includes Font Awesome and Open Sans automagically via @import. Don’t use this in production please.

<link rel="stylesheet" href="bower_components/makerstrap/makerstrap.complete.min.css">

Somewhat lazy

Includes Font Awesome and Open Sans from a CDN.

<link href="https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700" rel="stylesheet">

<link href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">

<link href="bower_components/makerstrap/dist/makerstrap.complete.min.css" rel="stylesheet">

Actually, I’m a ninja, hit me

This is for LESS importing:


@import 'bower_components/makerstrap/less/makerstrap';
@makerstrap-bower-path: '../bower_components';

Contributing

Development environment

Install bower and grunt-cli if you don’t have them:

npm install -g bower
npm install -g grunt-cli

Clone this repo: git clone https://github.com/mozilla/makerstrap.git
Run npm install from inside the makerstrap directory.
Run grunt to start the dev server and LESS watch task, navigate to http://localhost:1944 to see the demo page.
The main LESS files are in the less/ directory.
Read http://getbootstrap.com/css/#less to orient yourself on extending Bootstrap with LESS.

Submitting a Pull Request

Be sure to run grunt build and commit the generated files to your patch if you modify any of the LESS files. This ensures that people using the library as a dependency will get the latest compiled CSS.