git.roojs.org Git - roojs1/blob - scss/roojs-bootstrap/radio-set.scss

   1
   2 .roo-radio-set:before,
   3 .roo-radio-set:after {
   4     display: table;
   5     content: " ";
   6     clear: both;
   7 }
   8
   9 .radio.checked label::after
  10 {
  11     -webkit-transform: scale(1, 1);
  12     -ms-transform: scale(1, 1);
  13     -o-transform: scale(1, 1);
  14     transform: scale(1, 1);
  15     background-color: $gray;
  16 }
  17
  18 .roo-radio-set.disabled .radio label
  19 {
  20     opacity: 0.65;
  21 }
  22
  23 .roo-radio-set.disabled .radio label
  24 {
  25     cursor: not-allowed;
  26 }
  27
  28
  29 .roo-radio-primary {
  30     .radio label::after
  31     {
  32         background-color: $body-bg;
  33     }
  34
  35     .radio.checked label::before
  36     {
  37         border-color: $brand-primary; //#428bca;
  38     }
  39
  40     .radio.checked label::after
  41     {
  42         background-color: $brand-primary; //#428bca;
  43     }
  44 }
  45
  46
  47 .roo-radio-danger {
  48     .radio label::after
  49     {
  50         background-color: $brand-danger;
  51     }
  52
  53     .radio.checked label::before
  54     {
  55         border-color: $brand-danger;
  56     }
  57
  58     .radio.checked label::after
  59     {
  60         background-color: $brand-danger;
  61     }
  62 }
  63
  64 .roo-radio-info {
  65     .radio label::after
  66     {
  67         background-color: $body-bg;
  68     }
  69
  70     .radio.checked label::before
  71     {
  72         border-color: $brand-info;
  73     }
  74
  75     .radio.checked label::after
  76     {
  77         background-color: $brand-info;
  78     }
  79 }
  80
  81 .roo-radio-warning {
  82     .radio label::after
  83     {
  84         background-color: $body-bg;
  85     }
  86
  87     .radio.checked label::before
  88     {
  89         border-color: $brand-warning;
  90     }
  91
  92     .radio.checked label::after
  93     {
  94         background-color: $brand-warning;
  95     }
  96 }
  97 .roo-radio-success {
  98     .radio label::after
  99     {
 100         background-color: $body-bg;
 101     }
 102
 103     .radio.checked label::before
 104     {
 105         border-color: $brand-success;
 106     }
 107
 108     .radio.checked label::after
 109     {
 110         background-color: $brand-success;
 111     }
 112 }
 113
 114
 115 /** not sure if these are needed with is-valid / is-invalid.. */
 116
 117 /*
 118 .roo-radio-set.has-warning {
 119     .roo-radio-set-items label,
 120     .roo-radio-set-label {
 121         color: $brand-warning; //#8a6d3b;
 122     }
 123 }
 124 .roo-radio-set.has-error {
 125     .roo-radio-set-items label,
 126     .roo-radio-set-label {
 127         color: $brand-danger; //#a94442;
 128     }
 129 }
 130
 131 .roo-radio-set.has-success {
 132     .roo-radio-set-items label,
 133     .roo-radio-set-label
 134     {
 135         color: $brand-success; //#3c763d;
 136     }
 137 }
 138 */
 139
 140
 141 .roo-radio-set.is-invalid {
 142     .roo-radio-set-items label,
 143     .roo-radio-set-label {
 144         color:  $form-feedback-invalid-color; //#8a6d3b;
 145     }
 146 }
 147
 148
 149 .roo-radio-set.is-valid {
 150     .roo-radio-set-items label,
 151     .roo-radio-set-label {
 152         color:  $form-feedback-valid-color; //#8a6d3b;
 153     }
 154 }
 155
 156
 157
 158
 159 .roo-radio-set-inline .radio {
 160     position: relative;
 161     display: inline-block;
 162     padding-left: 20px;
 163     margin-top: 0px;
 164     margin-bottom: 0;
 165     font-weight: 400;
 166     vertical-align: middle;
 167     cursor: pointer;
 168 }
 169
 170 .roo-radio-set-inline .radio + .radio {
 171     margin-left: 10px;
 172 }
 173
 174 .roo-radio-set-label .roo-required-indicator.right-indicator {
 175     position: absolute;
 176 }
 177
 178 .roo-radio-set-label .roo-required-indicator.right-indicator.fa-star {
 179     font-size: 8px;
 180     margin-left: 3px;
 181     color: $brand-danger;
 182 }
 183
 184 .roo-form-error-popover.in {
 185     opacity: 1;
 186 }
 187
 188 .roo-form-error-popover .tooltip-inner {
 189     max-width: 100%;
 190     padding: 10px;
 191 }