[7304c7f] | 1 | .form-control, .custom-select {
|
---|
| 2 | font-size: .875rem;
|
---|
| 3 | border-color: #e1e1e1;
|
---|
| 4 | border-radius: .50rem;
|
---|
| 5 |
|
---|
| 6 | &:focus {
|
---|
| 7 | box-shadow: none;
|
---|
| 8 | border-color: rgba($color-primary, .8);
|
---|
| 9 | }
|
---|
| 10 | }
|
---|
| 11 |
|
---|
| 12 | .form-control:not(.form-control-lg):not(.form-control-sm) {
|
---|
| 13 | height: calc(1.5em + .75rem + 3px)
|
---|
| 14 | }
|
---|
| 15 |
|
---|
| 16 | .form-rounded {
|
---|
| 17 | border-radius: 50px;
|
---|
| 18 | }
|
---|
| 19 |
|
---|
| 20 | .form-control-lg {
|
---|
| 21 | font-size: 1.10rem;
|
---|
| 22 | }
|
---|
| 23 |
|
---|
| 24 | .form-control-sm {
|
---|
| 25 | font-size: .800rem;
|
---|
| 26 | }
|
---|
| 27 |
|
---|
| 28 | .input-group-text {
|
---|
| 29 | border: none;
|
---|
| 30 | }
|
---|
| 31 |
|
---|
| 32 | textarea {
|
---|
| 33 | min-height: 100px;
|
---|
| 34 | max-height: 500px
|
---|
| 35 | }
|
---|
| 36 |
|
---|
| 37 | .custom-file-input:focus ~ .custom-file-label {
|
---|
| 38 | border-color: lighten($color-primary, 10%);
|
---|
| 39 | box-shadow: none;
|
---|
| 40 | }
|
---|
| 41 |
|
---|
| 42 | .custom-control-input {
|
---|
| 43 | right: 0;
|
---|
| 44 | }
|
---|
| 45 |
|
---|
| 46 | .custom-control-label {
|
---|
| 47 | line-height: 25px;
|
---|
| 48 | }
|
---|
| 49 |
|
---|
| 50 | /* Checkboxes and Radios */
|
---|
| 51 | .custom-checkbox, .custom-radio, .custom-switch {
|
---|
| 52 |
|
---|
| 53 | .custom-control-input:checked ~ .custom-control-label::before {
|
---|
| 54 | border-color: $color-primary;
|
---|
| 55 | background-color: $color-primary;
|
---|
| 56 | }
|
---|
| 57 |
|
---|
| 58 | .custom-control-input:focus ~ .custom-control-label::before {
|
---|
| 59 | box-shadow: 0 0 0 0.2rem rgba($color-primary, .30)
|
---|
| 60 | }
|
---|
| 61 |
|
---|
| 62 | & .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
|
---|
| 63 | border-color: lighten($color-primary, 18%);
|
---|
| 64 | background-color: lighten($color-primary, 18%);
|
---|
| 65 | }
|
---|
| 66 |
|
---|
| 67 | &.custom-checkbox-secondary {
|
---|
| 68 | .custom-control-input:checked ~ .custom-control-label::before {
|
---|
| 69 | border-color: $color-secondary;
|
---|
| 70 | background-color: $color-secondary;
|
---|
| 71 | }
|
---|
| 72 |
|
---|
| 73 | .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
|
---|
| 74 | border-color: lighten($color-secondary, 18%);
|
---|
| 75 | background-color: lighten($color-secondary, 18%);
|
---|
| 76 | }
|
---|
| 77 |
|
---|
| 78 | .custom-control-input:focus ~ .custom-control-label::before {
|
---|
| 79 | box-shadow: 0 0 0 0.2rem rgba($color-secondary, .30)
|
---|
| 80 | }
|
---|
| 81 | }
|
---|
| 82 |
|
---|
| 83 | &.custom-checkbox-success {
|
---|
| 84 | .custom-control-input:checked ~ .custom-control-label::before {
|
---|
| 85 | border-color: $color-success;
|
---|
| 86 | background-color: $color-success;
|
---|
| 87 | }
|
---|
| 88 |
|
---|
| 89 | .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
|
---|
| 90 | border-color: lighten($color-success, 18%);
|
---|
| 91 | background-color: lighten($color-success, 18%);
|
---|
| 92 | }
|
---|
| 93 |
|
---|
| 94 | .custom-control-input:focus ~ .custom-control-label::before {
|
---|
| 95 | box-shadow: 0 0 0 0.2rem rgba($color-success, .30)
|
---|
| 96 | }
|
---|
| 97 | }
|
---|
| 98 |
|
---|
| 99 | &.custom-checkbox-danger {
|
---|
| 100 | .custom-control-input:checked ~ .custom-control-label::before {
|
---|
| 101 | border-color: $color-danger;
|
---|
| 102 | background-color: $color-danger;
|
---|
| 103 | }
|
---|
| 104 |
|
---|
| 105 | .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
|
---|
| 106 | border-color: lighten($color-danger, 18%);
|
---|
| 107 | background-color: lighten($color-danger, 18%);
|
---|
| 108 | }
|
---|
| 109 |
|
---|
| 110 | .custom-control-input:focus ~ .custom-control-label::before {
|
---|
| 111 | box-shadow: 0 0 0 0.2rem rgba($color-danger, .30)
|
---|
| 112 | }
|
---|
| 113 | }
|
---|
| 114 |
|
---|
| 115 | &.custom-checkbox-warning {
|
---|
| 116 | .custom-control-input:checked ~ .custom-control-label::before {
|
---|
| 117 | border-color: $color-warning;
|
---|
| 118 | background-color: $color-warning;
|
---|
| 119 | }
|
---|
| 120 |
|
---|
| 121 | .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
|
---|
| 122 | border-color: lighten($color-warning, 18%);
|
---|
| 123 | background-color: lighten($color-warning, 18%);
|
---|
| 124 | }
|
---|
| 125 |
|
---|
| 126 | .custom-control-input:focus ~ .custom-control-label::before {
|
---|
| 127 | box-shadow: 0 0 0 0.2rem rgba($color-warning, .30)
|
---|
| 128 | }
|
---|
| 129 | }
|
---|
| 130 |
|
---|
| 131 | &.custom-checkbox-info {
|
---|
| 132 | .custom-control-input:checked ~ .custom-control-label::before {
|
---|
| 133 | border-color: $color-info;
|
---|
| 134 | background-color: $color-info;
|
---|
| 135 | }
|
---|
| 136 |
|
---|
| 137 | .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
|
---|
| 138 | border-color: lighten($color-info, 18%);
|
---|
| 139 | background-color: lighten($color-info, 18%);
|
---|
| 140 | }
|
---|
| 141 |
|
---|
| 142 | .custom-control-input:focus ~ .custom-control-label::before {
|
---|
| 143 | box-shadow: 0 0 0 0.2rem rgba($color-info, .30)
|
---|
| 144 | }
|
---|
| 145 | }
|
---|
| 146 |
|
---|
| 147 | &.custom-checkbox-dark {
|
---|
| 148 | .custom-control-input:checked ~ .custom-control-label::before {
|
---|
| 149 | border-color: $color-dark;
|
---|
| 150 | background-color: $color-dark;
|
---|
| 151 | }
|
---|
| 152 |
|
---|
| 153 | .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
|
---|
| 154 | border-color: lighten($color-dark, 18%);
|
---|
| 155 | background-color: lighten($color-dark, 18%);
|
---|
| 156 | }
|
---|
| 157 |
|
---|
| 158 | .custom-control-input:focus ~ .custom-control-label::before {
|
---|
| 159 | box-shadow: 0 0 0 0.2rem rgba($color-dark, .30)
|
---|
| 160 | }
|
---|
| 161 | }
|
---|
| 162 | }
|
---|
| 163 |
|
---|
| 164 | .custom-checkbox {
|
---|
| 165 | &.custom-range-danger {
|
---|
| 166 | &::before {
|
---|
| 167 | background-color: $color-danger;
|
---|
| 168 | }
|
---|
| 169 |
|
---|
| 170 | &::-webkit-slider-thumb:active {
|
---|
| 171 | background-color: lighten($color-danger, 18%);
|
---|
| 172 | }
|
---|
| 173 | }
|
---|
| 174 | }
|
---|
| 175 |
|
---|
| 176 | .custom-range {
|
---|
| 177 | &::-webkit-slider-thumb {
|
---|
| 178 | background-color: $color-primary;
|
---|
| 179 | }
|
---|
| 180 |
|
---|
| 181 | &::-webkit-slider-thumb:active {
|
---|
| 182 | background-color: lighten($color-primary, 18%);
|
---|
| 183 | }
|
---|
| 184 |
|
---|
| 185 | &.custom-range-danger {
|
---|
| 186 | &::-webkit-slider-thumb {
|
---|
| 187 | background-color: $color-danger;
|
---|
| 188 | }
|
---|
| 189 |
|
---|
| 190 | &::-webkit-slider-thumb:active {
|
---|
| 191 | background-color: lighten($color-danger, 18%);
|
---|
| 192 | }
|
---|
| 193 | }
|
---|
| 194 |
|
---|
| 195 | &.custom-range-warning {
|
---|
| 196 | &::-webkit-slider-thumb {
|
---|
| 197 | background-color: $color-warning;
|
---|
| 198 | }
|
---|
| 199 |
|
---|
| 200 | &::-webkit-slider-thumb:active {
|
---|
| 201 | background-color: lighten($color-warning, 18%);
|
---|
| 202 | }
|
---|
| 203 | }
|
---|
| 204 |
|
---|
| 205 | &.custom-range-success {
|
---|
| 206 | &::-webkit-slider-thumb {
|
---|
| 207 | background-color: $color-success;
|
---|
| 208 | }
|
---|
| 209 |
|
---|
| 210 | &::-webkit-slider-thumb:active {
|
---|
| 211 | background-color: lighten($color-success, 18%);
|
---|
| 212 | }
|
---|
| 213 | }
|
---|
| 214 |
|
---|
| 215 | &.custom-range-secondary {
|
---|
| 216 | &::-webkit-slider-thumb {
|
---|
| 217 | background-color: $color-secondary;
|
---|
| 218 | }
|
---|
| 219 |
|
---|
| 220 | &::-webkit-slider-thumb:active {
|
---|
| 221 | background-color: lighten($color-secondary, 18%);
|
---|
| 222 | }
|
---|
| 223 | }
|
---|
| 224 |
|
---|
| 225 | &.custom-range-info {
|
---|
| 226 | &::-webkit-slider-thumb {
|
---|
| 227 | background-color: $color-info;
|
---|
| 228 | }
|
---|
| 229 |
|
---|
| 230 | &::-webkit-slider-thumb:active {
|
---|
| 231 | background-color: lighten($color-info, 18%);
|
---|
| 232 | }
|
---|
| 233 | }
|
---|
| 234 |
|
---|
| 235 | &.custom-range-light {
|
---|
| 236 | &::-webkit-slider-thumb {
|
---|
| 237 | background-color: $color-light;
|
---|
| 238 | }
|
---|
| 239 |
|
---|
| 240 | &::-webkit-slider-thumb:active {
|
---|
| 241 | background-color: lighten($color-light, 18%);
|
---|
| 242 | }
|
---|
| 243 | }
|
---|
| 244 |
|
---|
| 245 | &.custom-range-dark {
|
---|
| 246 | &::-webkit-slider-thumb {
|
---|
| 247 | background-color: $color-dark;
|
---|
| 248 | }
|
---|
| 249 |
|
---|
| 250 | &::-webkit-slider-thumb:active {
|
---|
| 251 | background-color: lighten($color-dark, 18%);
|
---|
| 252 | }
|
---|
| 253 | }
|
---|
| 254 | }
|
---|