Difference between revisions of "LESS"
Revision as of 03:34, 12 April 2013
Recess is a tool used to compile and compress LESS into CSS under *nix based systems.
About the bootstrap theme
In Moodle, the styles for the boostrap theme are written using LESS, which is compiled into CSS. The main LESS file is theme/bootstrap/less/moodle.less, while additional files are stored in theme/bootstrap/less/moodle/ and imported by the main file. Following the instructions for using Recess below, you will be able to compile the LESS code into a single CSS file which will be stored in theme/bootstrap/style/.
It is extremely important that developers do not edit the bootstrap CSS file directly, as it can be replaced at any time with a newly compiled version. It is much safer to alter the LESS code, ensuring that your changes are kept after each compile.
Installing Recess under Ubuntu
The following commands should be run to install Recess
sudo apt-get install npm node npm install recess -g
Installing Recess under Mac OS X using MacPorts
1) Install MacPorts on Mac OS X. If you use a different package manager some install commands will vary. 2) Install NPM
port install npm rehash
3) Download https://github.com/twitter/recess/archive/master.zip and unzip it, then cd into the directory. 4) Install recess
npm install recess -g rehash
To compile to LESS for the boostrap theme use these commands, from the root of your Moodle code directory
cd theme/boostrap/less/ recess --compile --compress moodle.less > ../style/generated.css
This will compile and compress the moodle.less file (and all the LESS and CSS files it imports) into a single file, generated.css, and store it in the style folder of the bootstrap theme.
NOTE: if you are getting empty generated.css files, this is being caused by a parsing error in your LESS code. You will need to examine what you have altered or written to make sure it is complete and the syntax is correct.