Description

The purpose of this library is to facilitate the use of CSS3 on different browsers.

All CSS3 Properties used in the mixins are being supported by Safari 5.

Created by: Matthieu Aussaguel, @mattaussaguel

Mixins:

Mixins Arguments (with default values)
background-gradient Start Color: #3C3C3C, End Color: #999999
background-size Width: 100%, Height: 100%
border-radius Radius: 5px
border-radius-separate Top Left: 5px, Top Left: 5px, Bottom Left: 5px, Bottom Right: 5px
box Orientation: horizontal, Pack: center, Align: center
box-rgba R: 60, G: 3, B: 12, Opacity: 0.23, Color: #3C3C3C
box-shadow X: 2px, Y: 2px, Blur: 5px, Color: rgba(0,0,0,.4)
box-sizing Type: border-box
columns Count: 3, Gap: 10
double-borders Color One: #3C3C3C, Color Two: #999999, Radius: 0
flex Value: 1
flip Value: ScaleX: -1
font-face Value: Font Family: myFont, Eot File Src: myFont.eot, Woff File Src: myFont.woff, Ttf File Src: myFont.ttf
opacity Opacity: 0.5
outline radius Radius: 5px
resize Direction: both
rotate Degree: 0, M11: 0, M12: 0, M21: 0, M22: 0
text-shadow X: 2px, Y: 2px, Blur: 5px, Color: rgba(0,0,0,.4)
transform Parameters: null
transition What: all, Length: 1s, Easing: ease-in-out
triple-borders Color One: #3C3C3C, Color Two: #999999, Color Three: #000000, Radius: 0

Examples and Instructions

// Import the mixins
@import "css3-mixins.scss"

// Call Mixins
@include opacity();
@include border-radius(3px); 
@include transition(color, .5s, ease-in);