12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273 |
- .form-check:not(.form-switch) .form-check-input {
- &[type="checkbox"],
- &[type="radio"] {
- border: 1px solid darken($gray-200, 10%);
- margin-top: $form-text-margin-top;
- position: relative;
- &:checked {
- border: 0;
- }
- }
- &[type="checkbox"] {
- &:after {
- transition: opacity $form-check-transition-time ease-in-out;
- font-family: "FontAwesome";
- content: "\f00c";
- width: 100%;
- height: 100%;
- color: $form-check-input-checked-color;
- position: absolute;
- display: flex;
- justify-content: center;
- align-items: center;
- font-size: $font-size-sm - .205;
- opacity: 0;
- }
- &:checked:after {
- opacity: 1;
- }
- }
- &[type="radio"] {
- transition: border 0s;
- &:after {
- transition: opacity $form-check-transition-time ease-in-out;
- content: "";
- position: absolute;
- width: $form-check-radio-after-width;
- height: $form-check-radio-after-width;
- border-radius: 50%;
- background-color: $white;
- opacity: 0;
- }
- &:checked {
- padding: 6px;
- }
- &:checked:after {
- opacity: 1;
- }
- }
- }
- .form-check-label,
- .form-check-input[type="checkbox"] {
- cursor: pointer;
- }
- .form-check-label{
- font-size:$font-size-sm;
- font-weight: $font-weight-normal;
- }
- .form-check-input{
- -webkit-appearance: none;
- -moz-appearance: none;
- appearance: none;
- }
|