If you don't know about LESS you can read about it here: lesscss.org

Mac OS X application for LESS incident57.com/codekit

git submodule add git://github.com/meritt/my-less-framework.git public/css/mlf

And after that you need to import it in your style file.

Insert into your style.less

@import "mlf/framework.less";

Basic

• .box-sizing(border-box);
• .opacity(0.5);
• .wrap();
• .user-select(none);

Animations

• .transition(all 500ms);
• .rotate(45deg);
• .scale(5);
• .translate(0, 0);
• .translate3d(0, 0, 0);
• .skew(0, 0);
• .animation(spinner 5s ease infinite);

Backgrounds

• .background-size(50px 50px);
• .linear-gradient(top, rgb(255, 255, 255), rgb(0, 0, 0));
• .radial-gradient(50% 50%, rgb(255, 255, 255), rgb(0, 0, 0));
• .background-horizontal(#00aaee, rgba(255, 255, 255, 0.2));
• .background-vertical(#ff9900, rgba(255, 255, 255, 0.2));
• .background-picnic(rgba(200, 0, 0, 0.5), rgba(200, 0, 0, 0.5), #ffffff);

Borders

• .background-clip(padding-box);
• .border-radius(5px);
• .border-left-radius(5px);
• .border-right-radius(5px);

Columns

• .columns(2, 10px);
• .column-count(2);
• .column-gap(10px);

Scrollbars

• .scrollbar(rgba(0, 0, 0, 0.2), 7px, 9px, 4px);

Shadows

• .box-shadow(1px 1px 8px #ccc);
• .blur-text-shadow(#ccc);
• .line-text-shadow(#ccc);

Additional it includes reset and normalize styles.

Also, you can use this in partial, for example if you need only animations and transformations CSS3 functions, you can do this in following way:

@import "mlf/functions/animations.less";

• Alexey Simonenko, simonenko.su

The MIT License, see the included license.md file.