1
 2/**
 3 * Radio Button Inputs
 4 * --------------------------------------------------
 5 */
 6
 7.item-radio {
 8  padding: 0;
 9
10  &:hover {
11    cursor: pointer;
12  }
13}
14
15.item-radio .item-content {
16  /* give some room to the right for the checkmark icon */
17  padding-right: $item-padding * 4;
18}
19
20.item-radio .radio-icon {
21  /* checkmark icon will be hidden by default */
22  position: absolute;
23  top: 0;
24  right: 0;
25  z-index: $z-index-item-radio;
26  visibility: hidden;
27  padding: $item-padding - 2;
28  height: 100%;
29  font-size: 24px;
30}
31
32.item-radio input {
33  /* hide any radio button inputs elements (the ugly circles) */
34  position: absolute;
35  left: -9999px;
36
37  &:checked + .radio-content .item-content {
38    /* style the item content when its checked */
39    background: #f7f7f7;
40  }
41
42  &:checked + .radio-content .radio-icon {
43    /* show the checkmark icon when its checked */
44    visibility: visible;
45  }
46}
47