iconizr LESS template - not very lean.. but it is full featured

iconizr-template.less

{{#svg}}
{{#selector}}.{{expression}}{{^last}},
{{/last}}{{/selector}} { {{#sprite}}
	background-position: {{position}};{{/sprite}}{{^common}}
	background-repeat: no-repeat;{{#dimensions}}
	display: block;
	text-indent: -999em;
	width: {{width}}px;
	height: {{height}}px;{{/dimensions}}
	background-image: url(/assets/sprite/{{#sprite}}{{sprite}}{{/sprite}}{{^sprite}}{{#encode}}"{{encoded}}"{{/encode}}{{^encode}}{{path}}{{/encode}}{{/sprite}});{{/common}}
}
{{#selector}}.{{expression}}{{^last}},
{{/last}}{{/selector}}-before { {{#sprite}}
	&:before {
		content: "";
		display: inline-block;
		vertical-align: middle;
		margin-right: .3em;
		background-position: {{position}};{{/sprite}}{{^common}}
		background-repeat: no-repeat;{{#dimensions}}
		width: {{width}}px;
		height: {{height}}px;{{/dimensions}}
		background-image: url(/assets/sprite/{{#sprite}}{{sprite}}{{/sprite}}{{^sprite}}{{#encode}}"{{encoded}}"{{/encode}}{{^encode}}{{path}}{{/encode}}{{/sprite}});{{/common}}
	}
}
{{#selector}}.{{expression}}{{^last}},
{{/last}}{{/selector}}-after { {{#sprite}}
	&:after {
		content: "";
		display: inline-block;
		vertical-align: middle;
		margin-left: .3em;
		background-position: {{position}};{{/sprite}}{{^common}}
		background-repeat: no-repeat;{{#dimensions}}
		width: {{width}}px;
		height: {{height}}px;{{/dimensions}}
		background-image: url(/assets/sprite/{{#sprite}}{{sprite}}{{/sprite}}{{^sprite}}{{#encode}}"{{encoded}}"{{/encode}}{{^encode}}{{path}}{{/encode}}{{/sprite}});{{/common}}
	}
}
{{#selector}}.{{expression}}{{^last}},
{{/last}}{{/selector}}-absbefore { {{#sprite}}
	padding-left: {{width}}px;
	position: relative;
	&:before {
		content: "";
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		background-position: {{position}};{{/sprite}}{{^common}}
		background-repeat: no-repeat;{{#dimensions}}
		width: {{width}}px;
		height: {{height}}px;{{/dimensions}}
		background-image: url(/assets/sprite/{{#sprite}}{{sprite}}{{/sprite}}{{^sprite}}{{#encode}}"{{encoded}}"{{/encode}}{{^encode}}{{path}}{{/encode}}{{/sprite}});{{/common}}
	}
}
{{#selector}}.{{expression}}{{^last}},
{{/last}}{{/selector}}-absafter(@top:0; @pad:{{width}}px;) { {{#sprite}}
	padding-right: @pad;
	position: relative;
	&:before {
		content: "";
		display: block;
		position: absolute;
		right: 0;
		top: @top;
		background-position: {{position}};{{/sprite}}{{^common}}
		background-repeat: no-repeat;{{#dimensions}}
		width: {{width}}px;
		height: {{height}}px;{{/dimensions}}
		background-image: url(/assets/sprite/{{#sprite}}{{sprite}}{{/sprite}}{{^sprite}}{{#encode}}"{{encoded}}"{{/encode}}{{^encode}}{{path}}{{/encode}}{{/sprite}});{{/common}}
	}
}
{{/svg}}

first steps in making it mixins: the absafter variant now has top and pad vars

now I really want to incorporate this hack to have full CSS powered fallback for the SVG sprite: http://pauginer.tumblr.com/post/36614680636/invisible-gradient-technique