Learning Less.js

Working through a practical example

So far, we've looked at a range of tips and tricks that you can use to convert a site in order to use Less—while there are some useful tips, I think you will agree that it is far better to see the conversion process in action! With this in mind, let's take a look at a simple example, in the form of the CSS styling we created in Chapter 4, Working with Variables, Mixins, and Functions, for the one-page website.

Before we start making changes, let's take a look at the compiled CSS that was created for the page, along with a screenshot of the page:

Introducing the CSS

Now that we've seen a screenshot of the page that ...