webgme
Version:
Web-based Generic Modeling Environment
60 lines (58 loc) • 1.85 kB
CSS
div.iCheckBox {
width: 70px;
height: 18.2px;
display: inline-block;
border-radius: 3px;
position: relative;
cursor: pointer;
background: -moz-linear-gradient(top, #cbcbcb, white);
background: -webkit-linear-gradient(top, #cbcbcb, white);
background: -o-linear-gradient(top, #cbcbcb, white);
background: linear-gradient(to bottom, #cbcbcb, white);
box-shadow: 0 0 2px rgba(0, 0, 0, 0.4), inset 0 0 2px rgba(0, 0, 0, 0.8);
transition: opacity .3s; }
div.iCheckBox .sw {
width: 50%;
height: 100%;
background: -moz-linear-gradient(top, #d4d4d4, white);
background: -webkit-linear-gradient(top, #d4d4d4, white);
background: -o-linear-gradient(top, #d4d4d4, white);
background: linear-gradient(to bottom, #d4d4d4, white);
border-radius: 3px;
display: inline-block;
position: absolute;
border: 1px solid #c4c4c4;
text-align: center; }
div.iCheckBox .sw [class^="icon-"],
div.iCheckBox .sw [class*=" icon-"] {
font-size: 130%;
position: relative;
top: -6%; }
div.iCheckBox .txt {
width: 36.8px;
height: 18.2px;
line-height: 18.2px;
display: inline-block;
position: absolute;
left: 33.2px;
font-size: 9.1px;
font-weight: bold;
text-align: center;
color: #666666;
overflow: hidden; }
div.iCheckBox.checked {
background: -moz-linear-gradient(top, #3160ab, #082c67);
background: -webkit-linear-gradient(top, #3160ab, #082c67);
background: -o-linear-gradient(top, #3160ab, #082c67);
background: linear-gradient(to bottom, #3160ab, #082c67); }
div.iCheckBox.checked .sw {
left: 36.8px; }
div.iCheckBox.checked .txt {
left: 0;
color: white; }
div.iCheckBox.disabled {
opacity: 0.5; }
div.iCheckBox:hover {
opacity: .8; }
div.iCheckBox:hover.disabled {
opacity: 0.5; }