lessphp

Plugins

Resources

Official documentation is now available, along with a Vim syntax file.

About

lessphp is a compiler for LESS written in php.

The entire compiler comes in a single includable class, but an additional command line interface to the compiler is included. See the quick start for basic usage.

For a gentle introduction to LESS, take a look at LESS classic guide, and to explore some of the more advanced features available in the php version, have look at the lessphp official documentation.

Note: This software is far from mature and is being updated on a regular basis. For the best experience check back here frequently for new versions, or subscribe to the update feed.

Missing Features

If you see something here that isn't listed, or you have found a bug feel free to leave a comment or post on the github issues tracker. The following are planned for future releases.

Download

repo: http://github.com/leafo/lessphp/tree/master

stable: lessphp-0.1.6.tar.gz

Demo

Use the demo to test the compiler running on this server using your own code, or click through the example buttons to see more of LESS.

More Examples: variables, mixins, nested rules, accessors, namespaces, mixin functions

LESS goes here

CSS comes here


				
	




	
	
Quick Start




There are a few ways to interface with the compiler. The easiest is to have it
compile a LESS file when the page is requested. The static function 
less::ccompile, checked compile, will compile the input LESS file only when it
is newer than the output file.



require 'lessc.inc.php';

try {
    lessc::ccompile('input.less', 'out.css');
} catch (exception $ex) {
    exit('lessc fatal error:<br />'.$ex->getMessage());
}






Note that all failures with lessc are reported through exceptions.
If you need more control you can make your own instance of lessc.


require 'lessc.inc.php';

$less = new lessc('path/to/style.less');
file_put_contents('path/to/style.css', $less->parse());






In addition to loading from file, you can also parse from a string like so:


require 'lessc.inc.php';

$less = new lessc();
$style = '<style type="text/css">'.
    $less->parse('.block { padding: 3 + 4px }').
    '</style>';






	
	
Changelog

	
	
version 0.1.6 - August 21 2009


	
	
version 0.1.5 - August 6 2009


	
	
version 0.1.4 - August 4 2009



	
	
version 0.1.3 - July 28 2009

	
	
version 0.1.2-1 - July 23 2009 bugfix

	
	
version 0.1.2 - July 23 2009

	
	
version 0.1.1 - July 22 2009

	
	
version 0.1.0 - July 21 2009 Initial release


	
	
Comments

	
If you have a github account, you can post bug reports on the github issues tracker.

	


	

	

	

	
 August 21 2009 - leaf corcoran


	

		@a: 2;
@x: @a * @a;
@y: @x + 1;
@z: @x * 2 + @y;
 
@nice-blue: #5B83AD;
@light-blue: @nice-blue + #111;
 
@b: @a * 10;
@c: #888;
@fonts: "Trebuchet MS", Verdana, sans-serif;
 
.variables {
  width: @z + 1cm; // 14cm
  height: @b + @x + 0px; // 24px
  color: @c;
  background: @light-blue;
  font-family: @fonts;
}
		.bordered {
  border-top: dotted 1px black;
  border-bottom: solid 2px black;
}
#menu a {
  color: #111;
  .bordered;
}

.post a {
  color: red;
  .bordered;
}
#header {
  color: black;

  .navigation {
    font-size: 12px;
  }
  .logo {
    width: 300px;
    :hover { text-decoration: none }
  }
}
#defaults {
  @width: 960px;
  @color: black;
}

.article { color: #294366; }

.comment {
  width: #defaults[@width];
  color: .article['color']; 
}
#bundle {
  .button {
    display: block;
    border: 1px solid black;
    background-color: grey;
    :hover { background-color: white }
  }
}
#header a {
  color: orange;
  #bundle > .button; // mixin the button class
}
@outer: 10px;
@class(@var:22px; @car: 400px + @outer) {
  margin: @var;
  height: @car;
}

@group { 
  @f(@color) {
    color: @color;
  }
  .cool {
    border-bottom: 1px solid green;
  }
}

.class(@width:200px) {
  padding: @width;
}

body {
  .class(2.0em);
  @group > @f(red);
  @class(10px; 10px + 2); 
  @group > .cool;
}