Create buttons.less

This commit is contained in:
Owen Versteeg 2013-12-08 16:40:46 -05:00
parent 2100ce402f
commit 83bc63b8a6

53
less/buttons.less Normal file
View file

@ -0,0 +1,53 @@
@btn-a-bg: #0AE;
@btn-b-bg: #3C5;
@btn-c-bg: #D33;
i, button {
font-family: Lucida Sans Unicode, Lucida Grande, sans-serif;
}
button {
background: #aaa;
box-shadow: 3px 3px 0 black;
color: rgb(243, 243, 243) !important;
font-size: 2.5em;
padding: 15px 40px 16px;
text-decoration: none;
margin: .3em .7em .3em .7em;
cursor: pointer;
border: none;
&.smooth {
transition: background .15s ease-in-out;
}
&.btn-a {
background: @btn-a-bg;
&:hover {
background: darken(@btn-a-bg, 5%);
}
&:active {
background: darken(@btn-a-bg, 10%);
}
}
&.btn-b {
background: @btn-b-bg;
&:hover {
background: darken(@btn-b-bg, 5%);
}
&:active {
background: darken(@btn-b-bg, 10%);
}
}
&.btn-c {
background: @btn-c-bg;
&:hover {
background: darken(@btn-c-bg, 5%);
}
&:active {
background: darken(@btn-c-bg, 10%);
}
}
&.btn-small {
padding: 7px 19px 10px;
font-size: 16px;
}
}