Customizing Bootstrap with variables
In the less directory of your Bootstrap installation, you will find the variables.less file. The variables.less file is the sole place to edit and customize Bootstrap.
Getting ready
Download and install Bootstrap as described in the Downloading and installing Bootstrap recipe of this chapter. The Less files are compiled by leveraging Grunt.
How to do it...
You need to do the following:
- Create an
index.htmlfile that loads thedist/css/bootstrap.cssfile from your Bootstrap installation and contains the HTML code similar to what is shown here:<!DOCTYPE html> <html> <head> <title>Bootstrap's Buttons</title> <link rel="stylesheet" type="text/css" href="bootstrap-master/dist/css/bootstrap.css"> </head> <body> <!-- Standard button --> <button type="button" class="btn btn-default">Default</button> <!-- Provides extra visual weight and identifies...