source: Application/ocrent/wwwroot/lib/bootstrap/scss/forms/_form-check.scss

Last change on this file was f5f7c24, checked in by 192011 <mk.snicker@…>, 15 months ago

Initial commit

  • Property mode set to 100644
File size: 4.2 KB
Line 
1//
2// Check/radio
3//
4
5.form-check {
6 display: block;
7 min-height: $form-check-min-height;
8 padding-left: $form-check-padding-start;
9 margin-bottom: $form-check-margin-bottom;
10
11 .form-check-input {
12 float: left;
13 margin-left: $form-check-padding-start * -1;
14 }
15}
16
17.form-check-reverse {
18 padding-right: $form-check-padding-start;
19 padding-left: 0;
20 text-align: right;
21
22 .form-check-input {
23 float: right;
24 margin-right: $form-check-padding-start * -1;
25 margin-left: 0;
26 }
27}
28
29.form-check-input {
30 width: $form-check-input-width;
31 height: $form-check-input-width;
32 margin-top: ($line-height-base - $form-check-input-width) * .5; // line-height minus check height
33 vertical-align: top;
34 background-color: $form-check-input-bg;
35 background-repeat: no-repeat;
36 background-position: center;
37 background-size: contain;
38 border: $form-check-input-border;
39 appearance: none;
40 print-color-adjust: exact; // Keep themed appearance for print
41 @include transition($form-check-transition);
42
43 &[type="checkbox"] {
44 @include border-radius($form-check-input-border-radius);
45 }
46
47 &[type="radio"] {
48 // stylelint-disable-next-line property-disallowed-list
49 border-radius: $form-check-radio-border-radius;
50 }
51
52 &:active {
53 filter: $form-check-input-active-filter;
54 }
55
56 &:focus {
57 border-color: $form-check-input-focus-border;
58 outline: 0;
59 box-shadow: $form-check-input-focus-box-shadow;
60 }
61
62 &:checked {
63 background-color: $form-check-input-checked-bg-color;
64 border-color: $form-check-input-checked-border-color;
65
66 &[type="checkbox"] {
67 @if $enable-gradients {
68 background-image: escape-svg($form-check-input-checked-bg-image), var(--#{$prefix}gradient);
69 } @else {
70 background-image: escape-svg($form-check-input-checked-bg-image);
71 }
72 }
73
74 &[type="radio"] {
75 @if $enable-gradients {
76 background-image: escape-svg($form-check-radio-checked-bg-image), var(--#{$prefix}gradient);
77 } @else {
78 background-image: escape-svg($form-check-radio-checked-bg-image);
79 }
80 }
81 }
82
83 &[type="checkbox"]:indeterminate {
84 background-color: $form-check-input-indeterminate-bg-color;
85 border-color: $form-check-input-indeterminate-border-color;
86
87 @if $enable-gradients {
88 background-image: escape-svg($form-check-input-indeterminate-bg-image), var(--#{$prefix}gradient);
89 } @else {
90 background-image: escape-svg($form-check-input-indeterminate-bg-image);
91 }
92 }
93
94 &:disabled {
95 pointer-events: none;
96 filter: none;
97 opacity: $form-check-input-disabled-opacity;
98 }
99
100 // Use disabled attribute in addition of :disabled pseudo-class
101 // See: https://github.com/twbs/bootstrap/issues/28247
102 &[disabled],
103 &:disabled {
104 ~ .form-check-label {
105 cursor: default;
106 opacity: $form-check-label-disabled-opacity;
107 }
108 }
109}
110
111.form-check-label {
112 color: $form-check-label-color;
113 cursor: $form-check-label-cursor;
114}
115
116//
117// Switch
118//
119
120.form-switch {
121 padding-left: $form-switch-padding-start;
122
123 .form-check-input {
124 width: $form-switch-width;
125 margin-left: $form-switch-padding-start * -1;
126 background-image: escape-svg($form-switch-bg-image);
127 background-position: left center;
128 @include border-radius($form-switch-border-radius);
129 @include transition($form-switch-transition);
130
131 &:focus {
132 background-image: escape-svg($form-switch-focus-bg-image);
133 }
134
135 &:checked {
136 background-position: $form-switch-checked-bg-position;
137
138 @if $enable-gradients {
139 background-image: escape-svg($form-switch-checked-bg-image), var(--#{$prefix}gradient);
140 } @else {
141 background-image: escape-svg($form-switch-checked-bg-image);
142 }
143 }
144 }
145
146 &.form-check-reverse {
147 padding-right: $form-switch-padding-start;
148 padding-left: 0;
149
150 .form-check-input {
151 margin-right: $form-switch-padding-start * -1;
152 margin-left: 0;
153 }
154 }
155}
156
157.form-check-inline {
158 display: inline-block;
159 margin-right: $form-check-inline-margin-end;
160}
161
162.btn-check {
163 position: absolute;
164 clip: rect(0, 0, 0, 0);
165 pointer-events: none;
166
167 &[disabled],
168 &:disabled {
169 + .btn {
170 pointer-events: none;
171 filter: none;
172 opacity: $form-check-btn-check-disabled-opacity;
173 }
174 }
175}
Note: See TracBrowser for help on using the repository browser.