File size: 1.33Kb
/**
* ========================================================
* Buttons
*
* Created by Kevin Hale [particletree.com]
*
* @section Buttons
* @see particletree.com/features/rediscovering-the-button-element
* @since 1.0
* --------------------------------------------------------
*/
=button
{
display:block;
float:left;
margin:0 0.583em 0.667em 0;
width:auto;
overflow:visible;
padding:4px 10px 4px 7px;
/**
* Buttons have trouble with line-heights
* @bugfix
* @affected IE
* @valid yes
*/
line-height:$baseline;
border:1px solid #dedede;
border-top:1px solid #eee;
border-left:1px solid #eee;
background-color:#f5f5f5;
text-decoration:none;
color:#565656;
cursor:pointer;
&:hover
{
background-color:#dff4ff; border:1px solid #c2e1ef; color:#336699;
}
&:active
{
background-color:#6299c5; border:1px solid #6299c5; color:#fff;
}
}
=positive
{
+button;
color:#529214;
&:hover
{
background-color:#E6EFC2; border:1px solid #C6D880; color:#529214;
}
&:active
{
background-color:#529214; border:1px solid #529214; color:#fff;
}
}
=negative
{
+button;
color:#d12f19;
&:hover
{
background:#fbe3e4; border:1px solid #fbc2c4; color:#d12f19;
}
&:active
{
background-color:#d12f19; border:1px solid #d12f19; color:#fff;
}
}