readme.md in bourbon-0.1.2 vs readme.md in bourbon-0.1.3
- old
+ new
@@ -269,31 +269,43 @@
}
##Add-ons
+###Animation-Keyframes
+
+Animation-keyframes are provided for quick out-of-the-box animations. Two animation-keyframes are provided: fade-in, fade-out. These animations can be called using the *animation-name* mixin; alternatively the *animation-basic* mixin can be used. Supports Webkit browsers and Mozilla 5.0+.
+
+ div.fade-in {
+ @include animation-name(fade-in);
+ }
+
+ div.fade-out {
+ @include animation-basic(fade-out, 2.0s, ease-in);
+ opacity: 0;
+ }
+
+
###Buttons
-The button add-on provides well-designed buttons with a single line in your CSS. The demo folder contains examples of the buttons in use.
-The mixin can be called with no parameters to render a blue button with the "simple" style.
+The button add-on provides well-designed buttons with a single line in your CSS.
+The mixin supports a style parameter and an optional color argument. The available styles are **"simple"** (default), **"shiny"**, and **"pill"**.
- button,
- input[type="button"] {
+ # The mixin can be called with no arguments, which will render a blue button with the "simple" style.
+ button, input[type="button"] {
@include button;
}
-The mixin supports a style parameter. Right now the available styles are "simple" (default), "shiny", and "pill".
-
- button,
- input[type="button"] {
+ # Pass a style argument
+ button, input[type="button"] {
@include button(shiny);
}
-The real power of the mixin is revealed when you pass in the optional color argument. Using a single color, the mixin calculates the gradient, borders, box shadow, text shadow and text color of the button. The mixin will change the text to be light when on a dark background, and dark when on a light background.
+Create beautiful buttons by defining a style and color argument; using a single color, the mixin calculates the gradient, borders, box shadow, text shadow and text color of the button. The mixin will change the text to be light when on a dark background, and dark when on a light background.
- button,
- input[type="button"] {
+ # Style + color arguments
+ button, input[type="button"] {
@include button(shiny, #ff0000);
}
#All Supported Functions, Mixins, and Addons
@@ -322,10 +334,11 @@
@ animation-play-state(*args)
@ animation-timing-function(*args)
@ background-image(*args)
@ border-radius(*args)
+ @ box-shadow(*args)
@ box-sizing(*args)
flex-box
@ box(*args)
@ box-align(*args)
@@ -350,9 +363,10 @@
@ transition-property(*args)
@ transition-timing-function(*args)
#Addons
--------------------------------
+ animation-keyframes (fade-in, fade-out)
@ button(*args)
@ position(*args)
##Help Out