Masonstrap bundles bootstrap 3.0 and normalize.css for you.
## Making Changes to Masonstrap
## Building Masonstrap
<legend></legend>
If you would like to make changes to values or behaviors in Masonstrap you will need to do some quick setup.
If you would like to make changes to values or behaviors in Masonstrap you will
need to do some quick setup.
Ensure node.js is installed:
1.Ensure node.js is installed:
On Ubuntu: `$ sudo apt-get install npm`
On OS X, make sure you have [Homebrew](http://brew.sh) then `$ brew install node`
On Windows, download it [here](https://nodejs.org/en/download/).
On Ubuntu: `$ sudo apt-get install npm`
On macOS, make sure you have [Homebrew](http://brew.sh) then `$ brew install node`
On Windows, download it [here](https://nodejs.org/en/download/).
and in the root directory of this project (bootswatch/) run:
2. In the root directory of this project run:
`$ npm install`
`$ npm install`
You will also need to have Grunt installed globally on your system:
3. You will also need to have Grunt installed globally on your system:
`$ npm install -g grunt-cli`
`$ npm install -g grunt-cli`
Finally, run:
4.Finally, run:
`$ grunt watch`
`$ grunt swatch:masonstrap` to have masonstrap.css and masonstrap.min.css built.
### Stylesheet test webpage
in order for Grunt to rebuild the bootstrap files.
Run:
After that, you are free to make whatever changes you like to _variables.less_ and _bootswatch.less_ and _bootstrap.min.css_ will be updated accordingly.
`grunt`
Customization
------
Bootswatch is open source and you’re welcome to modify the themes.
to spin up a local server at [http://0.0.0.0:3000](http://0.0.0.0:3000) that
will host a test webpage displaying all of the masonstrap elements styled with
your locally built css files.
## Making changes to Masonstrap
After that, you are free to make whatever changes you like to the css files in masonstrap/
and the css will be updated accordingly when `grunt swatch:masonstrap` is run. Additionally,
`grunt watch` can be run to have grunt watch masonstrap/ for any changes and auto-build
masonstrap.
Each theme consists of two LESS files. `variables.less`, which is included by default in Bootstrap, allows you to customize [these settings](http://getbootstrap.com/customize/#less-variables). `bootswatch.less` introduces more extensive structural changes.
Masonstrap consists of two LESS files. `variables.less`, which is included by default
in Bootstrap, allows you to customize [these settings](http://getbootstrap.com/customize/#less-variables).
`bootswatch.less` introduces more extensive structural changes.
These files are also available in SASS.
Check out the [Help page](http://bootswatch.com/help/) for more details on building your own theme.
