Now that we've finished our layout, it's time to move on to updating our Less variables. For this project, I'm not going to add any new colors. We're going to fall back to the colors from our original boilerplate. I want to give you a good example of how it's useful to have these stock colors for use on a project.
Let's start by updating our background colors to use our boilerplate color values. As you'll see, I'm using
@black for the primary background. This is because we're going to make this a dark colored design:
@primary-background: @black; @secondary-background: @dark-grey; @inverse-background: @white;
Next, let's update our text colors and invert them to be readable on a dark background: ...