90 lines
1.9 KiB
Stylus
90 lines
1.9 KiB
Stylus
// Ideal Radio & Check
|
||
//---------------------------------------
|
||
|
||
form.idealforms
|
||
|
||
.ideal-radiocheck-label
|
||
cursor: pointer
|
||
margin: .15em 0 !important
|
||
|
||
if group-horizontal
|
||
margin: .15em 10px !important
|
||
|
||
input
|
||
float: left
|
||
|
||
if radiocheck-sprite
|
||
|
||
.ideal-check, .ideal-radio
|
||
float: left
|
||
margin-right: 10px !important
|
||
width: 20px
|
||
height: 20px
|
||
background: url(../img/radiocheck.png) 0 0
|
||
|
||
.ideal-check.focus
|
||
background-position: -20px 0
|
||
|
||
.ideal-check.checked
|
||
background-position: -40px 0
|
||
|
||
.ideal-check.checked.focus
|
||
background-position: -60px 0
|
||
|
||
.ideal-radio
|
||
background-position: 0 bottom
|
||
|
||
.ideal-radio.focus
|
||
background-position: -20px bottom
|
||
|
||
.ideal-radio.checked
|
||
background-position: -40px bottom
|
||
|
||
.ideal-radio.checked.focus
|
||
background-position: -60px bottom
|
||
|
||
else
|
||
|
||
.ideal-check, .ideal-radio
|
||
position: relative
|
||
float: left
|
||
margin-right: 10px !important
|
||
width: 18px
|
||
height: 18px
|
||
background: linear-gradient(white, #eee)
|
||
border: 1px solid #bbb
|
||
border-radius: 4px
|
||
box-shadow: 0 1px 1px rgba(black, .2)
|
||
&:after
|
||
display: none
|
||
|
||
.ideal-radio
|
||
border-radius: 18px
|
||
|
||
.ideal-check.focus, .ideal-radio.focus
|
||
border-color: valid
|
||
box-shadow: 0 1px 1px rgba(black, .2), 0 0 3px rgba(valid, .75)
|
||
|
||
.ideal-check:after, .ideal-radio:after
|
||
content: "×"
|
||
position: absolute
|
||
left: 50%
|
||
height: 18px
|
||
width: 18px
|
||
line-height: 18px
|
||
margin-left: -9px
|
||
text-align: center
|
||
font-size: 20px
|
||
color: #888
|
||
text-shadow: 1px 1px 0 white
|
||
|
||
.ideal-radio:after
|
||
content: "•"
|
||
font-size: 22px
|
||
|
||
.ideal-check.checked
|
||
.ideal-check.checked.focus
|
||
.ideal-radio.checked
|
||
.ideal-radio.checked.focus
|
||
&:after
|
||
display: block
|