Less mixins collection

An useful collection of less mixins

HOW TO USE

<link rel="stylesheet/less" type="text/css" href="mixins.less" />
<script src="less.js" type="text/javascript"></script>

MIXINS

1. .rounded (@radius: 5px)
2. .border-radius (@topleft: 5px, @topright: 5px, @bottomleft: 5px, @bottomright: 5px)
3. .box-shadow (@x: 0px, @y: 3px, @blur: 5px, @alpha: 0.5)
4. .inner-box-shadow (@x:0, @y:1px, @blur:2px, @alpha: 0.4)
5. .transition (@prop: all, @time: 1s, @ease: linear)
6. .transform (@rotate: 90deg, @scale: 1, @skew: 1deg, @translate: 10px)
7. .gradient (@origin: left, @start: #ffffff, @stop: #000000)
8. .quick-gradient (@origin: left, @alpha: 0.2)
9. .bordered (@top-color: #EEE, @right-color: #EEE, @bottom-color: #EEE, @left-color: #EEE)
10. .opacity (@opacity: 0.5)
11. .clip
12. .box-sizing (@sizing: border-box)
13. .bgsize (@size: 100% 100%)
14. .scale (@scale: 1.5, @x: 0, @y: 0)
15. .rotate (@deg: rotate(9deg))
16. .seo-helper ()

RESSOURCES

• http://lesscss.org/
• http://designshack.net/articles/css/10-less-css-examples-you-should-steal-for-your-projects/
• http://lesselements.com/
• https://github.com/tophermade/LESS-Mixins/blob/master/mixins.less
• https://github.com/markdotto/Preboot.less