tgext.less 0.3.1

LESS middleware for TurboGears2

About tgext.less

LESS is a dynamic stylesheet language that extends CSS with dynamic behaviour such as variables, mixins, operations and functions.

tgext.less is a middleware aimed at making TurboGears2 development easier, tgext.less converts regular less files to css using the official less compiler (lessc), thus it currently requires is to be installed.

tgext.less is based on tgext.scss by Alessandro Molina and is under the same license (MIT).

Installing

tgext.less can be installed both from pypi or from bitbucket:

easy_install tgext.less

You will also need to install the less compiler, for instructions on this check the less website under the server side usage section.

http://www.lesscss.org/

Enabling tgext.less

Using tgext.less is really simple, you edit your config/middeware.py and just after the #Wrap your base TurboGears 2 application with custom middleware here comment wrap app with LESSMiddleware:

from tgext.less import LESSMiddleware

make_base_app = base_config.setup_tg_wsgi_app(load_environment)

def make_app(global_conf, full_stack=True, **app_conf):
    app = make_base_app(global_conf, full_stack=True, **app_conf)

    # Wrap your base TurboGears 2 application with custom middleware here
    app = LESSMiddleware(app)

    return app

Now you just have to put your .less files inside public/css and they will be served as CSS.

Cache Backends

You can change the cache backend storage into any dict like object that can serialize a dict object, for example, you can use beaker cache by passing the cache object to the middleware constructor:

from tgext.less import LESSMiddleware
from tg import cache

make_base_app = base_config.setup_tg_wsgi_app(load_environment)

def make_app(global_conf, full_stack=True, **app_conf):
    app = make_base_app(global_conf, full_stack=True, **app_conf)

    # LESS with beaker cache backend
    app = LESSMiddleware(app, cache=cache)

    return app

Jinja2 Extension

tgext.less provides and extension for jinja2 templates to compile LESS embedded directly on your templates, to activate it just add it to your config/app_config.py file the following:

from tgext.less.jinja import LessExtension

base_config.jinja_extensions = [LessExtension]

Now you can use the less tag in your templates:

<style type="text/css">
{% less "main" %}
#header {
    h1 {
        font-size: 24pt;
    }
}
{% endless %}
</style>

Where “main” is a unique identifier for that LESS section.

You should take into account that when using mixins or any other identifier not defined inside the tag the LESS code will fail to compile, you can use the @import statement to include a file, in which case you should include the path relative to your static file directory:

<style type="text/css">
{% less "main" %}
@include "css/bootstrap.less";
#round_box {
    .border-radius(5px);
}
{% endless %}
</style>

You should be aware that when using this extension with the LESS import statement the output can get big quickly as the compiler currently does not just get the necessary things from the imported file but it just naively includes the whole file (as in the example, the while bootstrap library will be included).