1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31
|
/* This button is for on/off things, like activeate/desactivate checks. It's important
to remove the !important from onoff so we get a gray "active" state. */
.btn-onoff {
background-color: hsl(201, 67%, 56%) /*!important*/;
background-repeat: repeat-x;
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)", #b2daef, #43a5d9));
background-image: -khtml-gradient(linear, left top, left bottom, from(#b2daef), to(#43a5d9));
background-image: -moz-linear-gradient(top, #b2daef, #43a5d9);
background-image: -ms-linear-gradient(top, #b2daef, #43a5d9);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #b2daef), color-stop(100%, #43a5d9));
background-image: -webkit-linear-gradient(top, #b2daef, #43a5d9);
background-image: -o-linear-gradient(top, #b2daef, #43a5d9);
background-image: linear-gradient(#b2daef, #43a5d9);
border-color: #43a5d9 #43a5d9 hsl(201, 67%, 49.5%);
/* And no color so the text inside is gray too */
/*color: #333 !important;*/
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.42);
-webkit-font-smoothing: antialiased;
}
/* I don't know why, but by default it's 15px, and it stop in the middle of the button. */
.btn-onoff:hover {
background-position: 0 -25px;
}
/* By default bootstrap put 5px, I don't see why*/
.btn-group + .btn-group {
margin-left: 0px;
}
|