frontend.txt

CUSTOMISE BOOTSTRAP
===================

Install twitter bower and recess as npm modules, within the virtualenv:
(bower for dependency management, and recess for LESS compilation)

$ npm install -g bower
$ npm install -g recess
...both done by ./scripts/get_dependencies.py


Install bootstrap, font-awesome as a bower components:

$ bower install bootstrap#2.3.1
$ bower install font-awesome#3.0.2
...this will create folders components/bootstrap, components/font-awesome...

Copy font-awesome font to our static font directory as post-install:
$ cp components/font-awesome/font/* deploystream/static/font/


INITIAL STEPS TO USE BOOTSTRAP AS A BASE
========================================

Make bootstrap files usable in our project:

Symlink components/bootstrap/less to deploystream/static/less/bootstrap

Copy bootstrap.less into site.less, and copy variables.less
Comment-out unneeded components and adjust import paths to point
to bootstrap/*.less


DAILY WORK ON STYLES
====================

Edit only LESS files in static/less.

Compile with:

$ cd deploystream/static
$ recess less/site.less --compile [--compress] > css/site.css
...or just use ./compile-css.sh

(compile other less files if they need to be standalone CSS, else
import from site)


DYNAMIC WORKFLOW
================

In order to compile css dynamically as you work with the less files:

$ cd deploystream/static
$ recess less/site.less:css/site.css --watch less/
...or just use ./watch-less.sh