
Sass y Less mixin library 01.OCT.14

Sass y Less son los pre-procesadores de CSS más conocidos en la actualidad, son fáciles de usar, mantener y actualizar, además de ofrecer múltiples ventajas frente al uso de CSS convencional, sin embargo hay cosas que podemos hacer para hacer mucho más rápida la tarea de escribir estilos con estas herramientas por eso quiero mostrarles este par de mixin que harán tu vida más fácil.
Bourbon
Esta librería para Sass te añade funciones que te permiten hacer tu trabajo más fácil y rápido que de manera convencional. Hay muchas funciones incluidas por lo que nombrarlas todas sería imposible por lo que solo vamos a dar un pequeño ejemplo.
Sass / Bourbon
@include border-color(red green null blue);
CSS generado
border-top-color: red; border-right-color: green; border-left-color: blue;
Como pueden ver es mucho más simple escribir el CSS y como este hay muchas funciones más, así que si quieren aprender más pueden visitar su sitio web. Adicionalmente también pueden encontrar un grid framework desarrollado con esta librería y Sass, también en su sitio web.
Sitio web: http://bourbon.io/
Less Hat
Esta librería es similar a la anterior solo que desarrollada para Less, al igual que con bourbon puedes encontrar muchas funciones para hacer más rápido el trabajo pero además de eso también tiene integración con CSS HAT – de ahí el nombre – un plugin para Photoshop que te permite crear estilos CSS a partir de las formas creadas con la aplicación de Adobe.
Less Hat
div { .transform(scale(.5) translate(10, 20)); }
CSS generado
div { -webkit-transform: scale(.5) translate(10, 20); -moz-transform: scale(.5) translate(10, 20); -ms-transform: scale(.5) translate(10, 20); -o-transform: scale(.5) translate(10, 20); transform: scale(.5) translate(10, 20); }
Sitio Web: http://lesshat.madebysource.com/
Alvaro José Rios Ch