bootstrap 4.3.1 → 5.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (179) hide show
  1. checksums.yaml +4 -4
  2. data/.github/workflows/ci.yml +55 -0
  3. data/CHANGELOG.md +2 -14
  4. data/README.md +28 -5
  5. data/assets/javascripts/bootstrap/alert.js +54 -163
  6. data/assets/javascripts/bootstrap/base-component.js +83 -0
  7. data/assets/javascripts/bootstrap/button.js +44 -152
  8. data/assets/javascripts/bootstrap/carousel.js +289 -569
  9. data/assets/javascripts/bootstrap/collapse.js +170 -349
  10. data/assets/javascripts/bootstrap/dom/data.js +62 -0
  11. data/assets/javascripts/bootstrap/dom/event-handler.js +236 -0
  12. data/assets/javascripts/bootstrap/dom/manipulator.js +71 -0
  13. data/assets/javascripts/bootstrap/dom/selector-engine.js +103 -0
  14. data/assets/javascripts/bootstrap/dropdown.js +303 -496
  15. data/assets/javascripts/bootstrap/modal.js +229 -559
  16. data/assets/javascripts/bootstrap/offcanvas.js +245 -0
  17. data/assets/javascripts/bootstrap/popover.js +61 -226
  18. data/assets/javascripts/bootstrap/scrollspy.js +217 -317
  19. data/assets/javascripts/bootstrap/tab.js +220 -212
  20. data/assets/javascripts/bootstrap/toast.js +145 -229
  21. data/assets/javascripts/bootstrap/tooltip.js +421 -782
  22. data/assets/javascripts/bootstrap/util/backdrop.js +139 -0
  23. data/assets/javascripts/bootstrap/util/component-functions.js +41 -0
  24. data/assets/javascripts/bootstrap/util/config.js +67 -0
  25. data/assets/javascripts/bootstrap/util/focustrap.js +113 -0
  26. data/assets/javascripts/bootstrap/util/index.js +281 -0
  27. data/assets/javascripts/bootstrap/util/sanitizer.js +110 -0
  28. data/assets/javascripts/bootstrap/util/scrollbar.js +112 -0
  29. data/assets/javascripts/bootstrap/util/swipe.js +134 -0
  30. data/assets/javascripts/bootstrap/util/template-factory.js +150 -0
  31. data/assets/javascripts/bootstrap-global-this-define.js +6 -0
  32. data/assets/javascripts/bootstrap-global-this-undefine.js +2 -0
  33. data/assets/javascripts/bootstrap-sprockets.js +23 -7
  34. data/assets/javascripts/bootstrap.js +3690 -3639
  35. data/assets/javascripts/bootstrap.min.js +4 -4
  36. data/assets/stylesheets/_bootstrap-grid.scss +53 -20
  37. data/assets/stylesheets/_bootstrap-reboot.scss +5 -7
  38. data/assets/stylesheets/_bootstrap.scss +21 -13
  39. data/assets/stylesheets/bootstrap/_accordion.scss +158 -0
  40. data/assets/stylesheets/bootstrap/_alert.scss +32 -15
  41. data/assets/stylesheets/bootstrap/_badge.scss +15 -31
  42. data/assets/stylesheets/bootstrap/_breadcrumb.scss +23 -24
  43. data/assets/stylesheets/bootstrap/_button-group.scss +27 -48
  44. data/assets/stylesheets/bootstrap/_buttons.scss +139 -69
  45. data/assets/stylesheets/bootstrap/_card.scss +91 -141
  46. data/assets/stylesheets/bootstrap/_carousel.scss +86 -39
  47. data/assets/stylesheets/bootstrap/_close.scss +51 -29
  48. data/assets/stylesheets/bootstrap/_containers.scss +41 -0
  49. data/assets/stylesheets/bootstrap/_dropdown.scss +131 -72
  50. data/assets/stylesheets/bootstrap/_forms.scss +9 -330
  51. data/assets/stylesheets/bootstrap/_functions.scss +244 -28
  52. data/assets/stylesheets/bootstrap/_grid.scss +18 -31
  53. data/assets/stylesheets/bootstrap/_helpers.scss +12 -0
  54. data/assets/stylesheets/bootstrap/_images.scss +3 -3
  55. data/assets/stylesheets/bootstrap/_list-group.scss +101 -53
  56. data/assets/stylesheets/bootstrap/_maps.scss +174 -0
  57. data/assets/stylesheets/bootstrap/_mixins.scss +13 -18
  58. data/assets/stylesheets/bootstrap/_modal.scss +120 -112
  59. data/assets/stylesheets/bootstrap/_nav.scss +113 -24
  60. data/assets/stylesheets/bootstrap/_navbar.scss +145 -150
  61. data/assets/stylesheets/bootstrap/_offcanvas.scss +146 -0
  62. data/assets/stylesheets/bootstrap/_pagination.scss +74 -38
  63. data/assets/stylesheets/bootstrap/_placeholders.scss +51 -0
  64. data/assets/stylesheets/bootstrap/_popover.scss +99 -74
  65. data/assets/stylesheets/bootstrap/_progress.scss +40 -15
  66. data/assets/stylesheets/bootstrap/_reboot.scss +342 -215
  67. data/assets/stylesheets/bootstrap/_root.scss +174 -9
  68. data/assets/stylesheets/bootstrap/_spinners.scss +52 -22
  69. data/assets/stylesheets/bootstrap/_tables.scss +101 -115
  70. data/assets/stylesheets/bootstrap/_toasts.scss +54 -25
  71. data/assets/stylesheets/bootstrap/_tooltip.scss +67 -63
  72. data/assets/stylesheets/bootstrap/_transitions.scss +8 -1
  73. data/assets/stylesheets/bootstrap/_type.scss +42 -61
  74. data/assets/stylesheets/bootstrap/_utilities.scss +806 -17
  75. data/assets/stylesheets/bootstrap/_variables-dark.scss +85 -0
  76. data/assets/stylesheets/bootstrap/_variables.scss +1235 -615
  77. data/assets/stylesheets/bootstrap/bootstrap-utilities.scss +19 -0
  78. data/assets/stylesheets/bootstrap/forms/_floating-labels.scss +94 -0
  79. data/assets/stylesheets/bootstrap/forms/_form-check.scss +188 -0
  80. data/assets/stylesheets/bootstrap/forms/_form-control.scss +214 -0
  81. data/assets/stylesheets/bootstrap/forms/_form-range.scss +91 -0
  82. data/assets/stylesheets/bootstrap/forms/_form-select.scss +80 -0
  83. data/assets/stylesheets/bootstrap/forms/_form-text.scss +11 -0
  84. data/assets/stylesheets/bootstrap/forms/_input-group.scss +132 -0
  85. data/assets/stylesheets/bootstrap/forms/_labels.scss +36 -0
  86. data/assets/stylesheets/bootstrap/forms/_validation.scss +12 -0
  87. data/assets/stylesheets/bootstrap/helpers/_color-bg.scss +8 -0
  88. data/assets/stylesheets/bootstrap/helpers/_colored-links.scss +30 -0
  89. data/assets/stylesheets/bootstrap/helpers/_focus-ring.scss +5 -0
  90. data/assets/stylesheets/bootstrap/helpers/_icon-link.scss +25 -0
  91. data/assets/stylesheets/bootstrap/helpers/_position.scss +36 -0
  92. data/assets/stylesheets/bootstrap/helpers/_ratio.scss +26 -0
  93. data/assets/stylesheets/bootstrap/helpers/_stacks.scss +15 -0
  94. data/assets/stylesheets/bootstrap/helpers/_stretched-link.scss +15 -0
  95. data/assets/stylesheets/bootstrap/helpers/_text-truncation.scss +7 -0
  96. data/assets/stylesheets/bootstrap/helpers/_visually-hidden.scss +8 -0
  97. data/assets/stylesheets/bootstrap/helpers/_vr.scss +8 -0
  98. data/assets/stylesheets/bootstrap/mixins/_alert.scss +11 -6
  99. data/assets/stylesheets/bootstrap/mixins/_backdrop.scss +14 -0
  100. data/assets/stylesheets/bootstrap/mixins/_banner.scss +7 -0
  101. data/assets/stylesheets/bootstrap/mixins/_border-radius.scss +37 -22
  102. data/assets/stylesheets/bootstrap/mixins/_box-shadow.scss +7 -9
  103. data/assets/stylesheets/bootstrap/mixins/_breakpoints.scss +20 -16
  104. data/assets/stylesheets/bootstrap/mixins/_buttons.scss +60 -97
  105. data/assets/stylesheets/bootstrap/mixins/_caret.scss +34 -27
  106. data/assets/stylesheets/bootstrap/mixins/_clearfix.scss +2 -0
  107. data/assets/stylesheets/bootstrap/mixins/_color-mode.scss +21 -0
  108. data/assets/stylesheets/bootstrap/mixins/_color-scheme.scss +7 -0
  109. data/assets/stylesheets/bootstrap/mixins/_container.scss +11 -0
  110. data/assets/stylesheets/bootstrap/mixins/_forms.scss +77 -116
  111. data/assets/stylesheets/bootstrap/mixins/_gradients.scss +13 -11
  112. data/assets/stylesheets/bootstrap/mixins/_grid.scss +133 -33
  113. data/assets/stylesheets/bootstrap/mixins/_image.scss +0 -20
  114. data/assets/stylesheets/bootstrap/mixins/_list-group.scss +7 -2
  115. data/assets/stylesheets/bootstrap/mixins/_pagination.scss +7 -19
  116. data/assets/stylesheets/bootstrap/mixins/_reset-text.scss +2 -2
  117. data/assets/stylesheets/bootstrap/mixins/_table-variants.scss +24 -0
  118. data/assets/stylesheets/bootstrap/mixins/_transition.scss +18 -8
  119. data/assets/stylesheets/bootstrap/mixins/_utilities.scss +97 -0
  120. data/assets/stylesheets/bootstrap/mixins/_visually-hidden.scss +33 -0
  121. data/assets/stylesheets/bootstrap/utilities/_api.scss +47 -0
  122. data/assets/stylesheets/bootstrap/vendor/_rfs.scss +276 -132
  123. data/bootstrap.gemspec +4 -6
  124. data/lib/bootstrap/version.rb +2 -2
  125. data/tasks/updater/js.rb +31 -7
  126. data/tasks/updater/network.rb +10 -4
  127. data/tasks/updater/scss.rb +1 -1
  128. data/tasks/updater.rb +2 -2
  129. data/test/dummy_rails/app/assets/config/manifest.js +3 -0
  130. data/test/dummy_rails/app/assets/javascripts/application.js +4 -3
  131. data/test/dummy_rails/app/assets/stylesheets/.browserslistrc +1 -0
  132. data/test/dummy_rails/app/views/layouts/application.html.erb +3 -1
  133. data/test/dummy_rails/app/views/pages/root.html +89 -0
  134. data/test/dummy_rails/config/application.rb +0 -3
  135. data/test/gemfiles/rails_5_2.gemfile +8 -0
  136. data/test/gemfiles/rails_6_0.gemfile +7 -0
  137. data/test/gemfiles/rails_6_1.gemfile +7 -0
  138. data/test/gemfiles/rails_7_0.gemfile +7 -0
  139. data/test/support/dummy_rails_integration.rb +3 -1
  140. data/test/test_helper.rb +18 -12
  141. metadata +86 -84
  142. data/.travis.yml +0 -17
  143. data/assets/javascripts/bootstrap/util.js +0 -171
  144. data/assets/stylesheets/bootstrap/_code.scss +0 -48
  145. data/assets/stylesheets/bootstrap/_custom-forms.scss +0 -507
  146. data/assets/stylesheets/bootstrap/_input-group.scss +0 -193
  147. data/assets/stylesheets/bootstrap/_jumbotron.scss +0 -17
  148. data/assets/stylesheets/bootstrap/_media.scss +0 -8
  149. data/assets/stylesheets/bootstrap/_print.scss +0 -141
  150. data/assets/stylesheets/bootstrap/mixins/_background-variant.scss +0 -21
  151. data/assets/stylesheets/bootstrap/mixins/_badge.scss +0 -17
  152. data/assets/stylesheets/bootstrap/mixins/_float.scss +0 -14
  153. data/assets/stylesheets/bootstrap/mixins/_grid-framework.scss +0 -66
  154. data/assets/stylesheets/bootstrap/mixins/_hover.scss +0 -37
  155. data/assets/stylesheets/bootstrap/mixins/_nav-divider.scss +0 -10
  156. data/assets/stylesheets/bootstrap/mixins/_screen-reader.scss +0 -33
  157. data/assets/stylesheets/bootstrap/mixins/_size.scss +0 -7
  158. data/assets/stylesheets/bootstrap/mixins/_table-row.scss +0 -39
  159. data/assets/stylesheets/bootstrap/mixins/_text-emphasis.scss +0 -16
  160. data/assets/stylesheets/bootstrap/mixins/_text-hide.scss +0 -11
  161. data/assets/stylesheets/bootstrap/mixins/_visibility.scss +0 -8
  162. data/assets/stylesheets/bootstrap/utilities/_align.scss +0 -8
  163. data/assets/stylesheets/bootstrap/utilities/_background.scss +0 -19
  164. data/assets/stylesheets/bootstrap/utilities/_borders.scss +0 -75
  165. data/assets/stylesheets/bootstrap/utilities/_display.scss +0 -26
  166. data/assets/stylesheets/bootstrap/utilities/_embed.scss +0 -39
  167. data/assets/stylesheets/bootstrap/utilities/_flex.scss +0 -51
  168. data/assets/stylesheets/bootstrap/utilities/_float.scss +0 -11
  169. data/assets/stylesheets/bootstrap/utilities/_overflow.scss +0 -5
  170. data/assets/stylesheets/bootstrap/utilities/_position.scss +0 -32
  171. data/assets/stylesheets/bootstrap/utilities/_screenreaders.scss +0 -11
  172. data/assets/stylesheets/bootstrap/utilities/_shadows.scss +0 -6
  173. data/assets/stylesheets/bootstrap/utilities/_sizing.scss +0 -20
  174. data/assets/stylesheets/bootstrap/utilities/_spacing.scss +0 -73
  175. data/assets/stylesheets/bootstrap/utilities/_stretched-link.scss +0 -19
  176. data/assets/stylesheets/bootstrap/utilities/_text.scss +0 -72
  177. data/assets/stylesheets/bootstrap/utilities/_visibility.scss +0 -13
  178. data/test/dummy_rails/app/views/pages/root.html.slim +0 -58
  179. /data/assets/stylesheets/bootstrap/{utilities → helpers}/_clearfix.scss +0 -0
@@ -1,507 +0,0 @@
1
- // Embedded icons from Open Iconic.
2
- // Released under MIT and copyright 2014 Waybury.
3
- // https://useiconic.com/open
4
-
5
-
6
- // Checkboxes and radios
7
- //
8
- // Base class takes care of all the key behavioral aspects.
9
-
10
- .custom-control {
11
- position: relative;
12
- display: block;
13
- min-height: $font-size-base * $line-height-base;
14
- padding-left: $custom-control-gutter + $custom-control-indicator-size;
15
- }
16
-
17
- .custom-control-inline {
18
- display: inline-flex;
19
- margin-right: $custom-control-spacer-x;
20
- }
21
-
22
- .custom-control-input {
23
- position: absolute;
24
- z-index: -1; // Put the input behind the label so it doesn't overlay text
25
- opacity: 0;
26
-
27
- &:checked ~ .custom-control-label::before {
28
- color: $custom-control-indicator-checked-color;
29
- border-color: $custom-control-indicator-checked-border-color;
30
- @include gradient-bg($custom-control-indicator-checked-bg);
31
- @include box-shadow($custom-control-indicator-checked-box-shadow);
32
- }
33
-
34
- &:focus ~ .custom-control-label::before {
35
- // the mixin is not used here to make sure there is feedback
36
- @if $enable-shadows {
37
- box-shadow: $input-box-shadow, $input-focus-box-shadow;
38
- } @else {
39
- box-shadow: $custom-control-indicator-focus-box-shadow;
40
- }
41
- }
42
-
43
- &:focus:not(:checked) ~ .custom-control-label::before {
44
- border-color: $custom-control-indicator-focus-border-color;
45
- }
46
-
47
- &:not(:disabled):active ~ .custom-control-label::before {
48
- color: $custom-control-indicator-active-color;
49
- background-color: $custom-control-indicator-active-bg;
50
- border-color: $custom-control-indicator-active-border-color;
51
- @include box-shadow($custom-control-indicator-active-box-shadow);
52
- }
53
-
54
- &:disabled {
55
- ~ .custom-control-label {
56
- color: $custom-control-label-disabled-color;
57
-
58
- &::before {
59
- background-color: $custom-control-indicator-disabled-bg;
60
- }
61
- }
62
- }
63
- }
64
-
65
- // Custom control indicators
66
- //
67
- // Build the custom controls out of pseudo-elements.
68
-
69
- .custom-control-label {
70
- position: relative;
71
- margin-bottom: 0;
72
- vertical-align: top;
73
-
74
- // Background-color and (when enabled) gradient
75
- &::before {
76
- position: absolute;
77
- top: ($font-size-base * $line-height-base - $custom-control-indicator-size) / 2;
78
- left: -($custom-control-gutter + $custom-control-indicator-size);
79
- display: block;
80
- width: $custom-control-indicator-size;
81
- height: $custom-control-indicator-size;
82
- pointer-events: none;
83
- content: "";
84
- background-color: $custom-control-indicator-bg;
85
- border: $custom-control-indicator-border-color solid $custom-control-indicator-border-width;
86
- @include box-shadow($custom-control-indicator-box-shadow);
87
- }
88
-
89
- // Foreground (icon)
90
- &::after {
91
- position: absolute;
92
- top: ($font-size-base * $line-height-base - $custom-control-indicator-size) / 2;
93
- left: -($custom-control-gutter + $custom-control-indicator-size);
94
- display: block;
95
- width: $custom-control-indicator-size;
96
- height: $custom-control-indicator-size;
97
- content: "";
98
- background: no-repeat 50% / #{$custom-control-indicator-bg-size};
99
- }
100
- }
101
-
102
-
103
- // Checkboxes
104
- //
105
- // Tweak just a few things for checkboxes.
106
-
107
- .custom-checkbox {
108
- .custom-control-label::before {
109
- @include border-radius($custom-checkbox-indicator-border-radius);
110
- }
111
-
112
- .custom-control-input:checked ~ .custom-control-label {
113
- &::after {
114
- background-image: $custom-checkbox-indicator-icon-checked;
115
- }
116
- }
117
-
118
- .custom-control-input:indeterminate ~ .custom-control-label {
119
- &::before {
120
- border-color: $custom-checkbox-indicator-indeterminate-border-color;
121
- @include gradient-bg($custom-checkbox-indicator-indeterminate-bg);
122
- @include box-shadow($custom-checkbox-indicator-indeterminate-box-shadow);
123
- }
124
- &::after {
125
- background-image: $custom-checkbox-indicator-icon-indeterminate;
126
- }
127
- }
128
-
129
- .custom-control-input:disabled {
130
- &:checked ~ .custom-control-label::before {
131
- background-color: $custom-control-indicator-checked-disabled-bg;
132
- }
133
- &:indeterminate ~ .custom-control-label::before {
134
- background-color: $custom-control-indicator-checked-disabled-bg;
135
- }
136
- }
137
- }
138
-
139
- // Radios
140
- //
141
- // Tweak just a few things for radios.
142
-
143
- .custom-radio {
144
- .custom-control-label::before {
145
- // stylelint-disable-next-line property-blacklist
146
- border-radius: $custom-radio-indicator-border-radius;
147
- }
148
-
149
- .custom-control-input:checked ~ .custom-control-label {
150
- &::after {
151
- background-image: $custom-radio-indicator-icon-checked;
152
- }
153
- }
154
-
155
- .custom-control-input:disabled {
156
- &:checked ~ .custom-control-label::before {
157
- background-color: $custom-control-indicator-checked-disabled-bg;
158
- }
159
- }
160
- }
161
-
162
-
163
- // switches
164
- //
165
- // Tweak a few things for switches
166
-
167
- .custom-switch {
168
- padding-left: $custom-switch-width + $custom-control-gutter;
169
-
170
- .custom-control-label {
171
- &::before {
172
- left: -($custom-switch-width + $custom-control-gutter);
173
- width: $custom-switch-width;
174
- pointer-events: all;
175
- // stylelint-disable-next-line property-blacklist
176
- border-radius: $custom-switch-indicator-border-radius;
177
- }
178
-
179
- &::after {
180
- top: calc(#{(($font-size-base * $line-height-base - $custom-control-indicator-size) / 2)} + #{$custom-control-indicator-border-width * 2});
181
- left: calc(#{-($custom-switch-width + $custom-control-gutter)} + #{$custom-control-indicator-border-width * 2});
182
- width: $custom-switch-indicator-size;
183
- height: $custom-switch-indicator-size;
184
- background-color: $custom-control-indicator-border-color;
185
- // stylelint-disable-next-line property-blacklist
186
- border-radius: $custom-switch-indicator-border-radius;
187
- @include transition(transform .15s ease-in-out, $custom-forms-transition);
188
- }
189
- }
190
-
191
- .custom-control-input:checked ~ .custom-control-label {
192
- &::after {
193
- background-color: $custom-control-indicator-bg;
194
- transform: translateX($custom-switch-width - $custom-control-indicator-size);
195
- }
196
- }
197
-
198
- .custom-control-input:disabled {
199
- &:checked ~ .custom-control-label::before {
200
- background-color: $custom-control-indicator-checked-disabled-bg;
201
- }
202
- }
203
- }
204
-
205
-
206
- // Select
207
- //
208
- // Replaces the browser default select with a custom one, mostly pulled from
209
- // https://primer.github.io/.
210
- //
211
-
212
- .custom-select {
213
- display: inline-block;
214
- width: 100%;
215
- height: $custom-select-height;
216
- padding: $custom-select-padding-y ($custom-select-padding-x + $custom-select-indicator-padding) $custom-select-padding-y $custom-select-padding-x;
217
- font-family: $custom-select-font-family;
218
- @include font-size($custom-select-font-size);
219
- font-weight: $custom-select-font-weight;
220
- line-height: $custom-select-line-height;
221
- color: $custom-select-color;
222
- vertical-align: middle;
223
- background: $custom-select-background;
224
- background-color: $custom-select-bg;
225
- border: $custom-select-border-width solid $custom-select-border-color;
226
- @include border-radius($custom-select-border-radius, 0);
227
- @include box-shadow($custom-select-box-shadow);
228
- appearance: none;
229
-
230
- &:focus {
231
- border-color: $custom-select-focus-border-color;
232
- outline: 0;
233
- @if $enable-shadows {
234
- box-shadow: $custom-select-box-shadow, $custom-select-focus-box-shadow;
235
- } @else {
236
- box-shadow: $custom-select-focus-box-shadow;
237
- }
238
-
239
- &::-ms-value {
240
- // For visual consistency with other platforms/browsers,
241
- // suppress the default white text on blue background highlight given to
242
- // the selected option text when the (still closed) <select> receives focus
243
- // in IE and (under certain conditions) Edge.
244
- // See https://github.com/twbs/bootstrap/issues/19398.
245
- color: $input-color;
246
- background-color: $input-bg;
247
- }
248
- }
249
-
250
- &[multiple],
251
- &[size]:not([size="1"]) {
252
- height: auto;
253
- padding-right: $custom-select-padding-x;
254
- background-image: none;
255
- }
256
-
257
- &:disabled {
258
- color: $custom-select-disabled-color;
259
- background-color: $custom-select-disabled-bg;
260
- }
261
-
262
- // Hides the default caret in IE11
263
- &::-ms-expand {
264
- display: none;
265
- }
266
- }
267
-
268
- .custom-select-sm {
269
- height: $custom-select-height-sm;
270
- padding-top: $custom-select-padding-y-sm;
271
- padding-bottom: $custom-select-padding-y-sm;
272
- padding-left: $custom-select-padding-x-sm;
273
- @include font-size($custom-select-font-size-sm);
274
- }
275
-
276
- .custom-select-lg {
277
- height: $custom-select-height-lg;
278
- padding-top: $custom-select-padding-y-lg;
279
- padding-bottom: $custom-select-padding-y-lg;
280
- padding-left: $custom-select-padding-x-lg;
281
- @include font-size($custom-select-font-size-lg);
282
- }
283
-
284
-
285
- // File
286
- //
287
- // Custom file input.
288
-
289
- .custom-file {
290
- position: relative;
291
- display: inline-block;
292
- width: 100%;
293
- height: $custom-file-height;
294
- margin-bottom: 0;
295
- }
296
-
297
- .custom-file-input {
298
- position: relative;
299
- z-index: 2;
300
- width: 100%;
301
- height: $custom-file-height;
302
- margin: 0;
303
- opacity: 0;
304
-
305
- &:focus ~ .custom-file-label {
306
- border-color: $custom-file-focus-border-color;
307
- box-shadow: $custom-file-focus-box-shadow;
308
- }
309
-
310
- &:disabled ~ .custom-file-label {
311
- background-color: $custom-file-disabled-bg;
312
- }
313
-
314
- @each $lang, $value in $custom-file-text {
315
- &:lang(#{$lang}) ~ .custom-file-label::after {
316
- content: $value;
317
- }
318
- }
319
-
320
- ~ .custom-file-label[data-browse]::after {
321
- content: attr(data-browse);
322
- }
323
- }
324
-
325
- .custom-file-label {
326
- position: absolute;
327
- top: 0;
328
- right: 0;
329
- left: 0;
330
- z-index: 1;
331
- height: $custom-file-height;
332
- padding: $custom-file-padding-y $custom-file-padding-x;
333
- font-family: $custom-file-font-family;
334
- font-weight: $custom-file-font-weight;
335
- line-height: $custom-file-line-height;
336
- color: $custom-file-color;
337
- background-color: $custom-file-bg;
338
- border: $custom-file-border-width solid $custom-file-border-color;
339
- @include border-radius($custom-file-border-radius);
340
- @include box-shadow($custom-file-box-shadow);
341
-
342
- &::after {
343
- position: absolute;
344
- top: 0;
345
- right: 0;
346
- bottom: 0;
347
- z-index: 3;
348
- display: block;
349
- height: $custom-file-height-inner;
350
- padding: $custom-file-padding-y $custom-file-padding-x;
351
- line-height: $custom-file-line-height;
352
- color: $custom-file-button-color;
353
- content: "Browse";
354
- @include gradient-bg($custom-file-button-bg);
355
- border-left: inherit;
356
- @include border-radius(0 $custom-file-border-radius $custom-file-border-radius 0);
357
- }
358
- }
359
-
360
- // Range
361
- //
362
- // Style range inputs the same across browsers. Vendor-specific rules for pseudo
363
- // elements cannot be mixed. As such, there are no shared styles for focus or
364
- // active states on prefixed selectors.
365
-
366
- .custom-range {
367
- width: 100%;
368
- height: calc(#{$custom-range-thumb-height} + #{$custom-range-thumb-focus-box-shadow-width * 2});
369
- padding: 0; // Need to reset padding
370
- background-color: transparent;
371
- appearance: none;
372
-
373
- &:focus {
374
- outline: none;
375
-
376
- // Pseudo-elements must be split across multiple rulesets to have an effect.
377
- // No box-shadow() mixin for focus accessibility.
378
- &::-webkit-slider-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
379
- &::-moz-range-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
380
- &::-ms-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
381
- }
382
-
383
- &::-moz-focus-outer {
384
- border: 0;
385
- }
386
-
387
- &::-webkit-slider-thumb {
388
- width: $custom-range-thumb-width;
389
- height: $custom-range-thumb-height;
390
- margin-top: ($custom-range-track-height - $custom-range-thumb-height) / 2; // Webkit specific
391
- @include gradient-bg($custom-range-thumb-bg);
392
- border: $custom-range-thumb-border;
393
- @include border-radius($custom-range-thumb-border-radius);
394
- @include box-shadow($custom-range-thumb-box-shadow);
395
- @include transition($custom-forms-transition);
396
- appearance: none;
397
-
398
- &:active {
399
- @include gradient-bg($custom-range-thumb-active-bg);
400
- }
401
- }
402
-
403
- &::-webkit-slider-runnable-track {
404
- width: $custom-range-track-width;
405
- height: $custom-range-track-height;
406
- color: transparent; // Why?
407
- cursor: $custom-range-track-cursor;
408
- background-color: $custom-range-track-bg;
409
- border-color: transparent;
410
- @include border-radius($custom-range-track-border-radius);
411
- @include box-shadow($custom-range-track-box-shadow);
412
- }
413
-
414
- &::-moz-range-thumb {
415
- width: $custom-range-thumb-width;
416
- height: $custom-range-thumb-height;
417
- @include gradient-bg($custom-range-thumb-bg);
418
- border: $custom-range-thumb-border;
419
- @include border-radius($custom-range-thumb-border-radius);
420
- @include box-shadow($custom-range-thumb-box-shadow);
421
- @include transition($custom-forms-transition);
422
- appearance: none;
423
-
424
- &:active {
425
- @include gradient-bg($custom-range-thumb-active-bg);
426
- }
427
- }
428
-
429
- &::-moz-range-track {
430
- width: $custom-range-track-width;
431
- height: $custom-range-track-height;
432
- color: transparent;
433
- cursor: $custom-range-track-cursor;
434
- background-color: $custom-range-track-bg;
435
- border-color: transparent; // Firefox specific?
436
- @include border-radius($custom-range-track-border-radius);
437
- @include box-shadow($custom-range-track-box-shadow);
438
- }
439
-
440
- &::-ms-thumb {
441
- width: $custom-range-thumb-width;
442
- height: $custom-range-thumb-height;
443
- margin-top: 0; // Edge specific
444
- margin-right: $custom-range-thumb-focus-box-shadow-width; // Workaround that overflowed box-shadow is hidden.
445
- margin-left: $custom-range-thumb-focus-box-shadow-width; // Workaround that overflowed box-shadow is hidden.
446
- @include gradient-bg($custom-range-thumb-bg);
447
- border: $custom-range-thumb-border;
448
- @include border-radius($custom-range-thumb-border-radius);
449
- @include box-shadow($custom-range-thumb-box-shadow);
450
- @include transition($custom-forms-transition);
451
- appearance: none;
452
-
453
- &:active {
454
- @include gradient-bg($custom-range-thumb-active-bg);
455
- }
456
- }
457
-
458
- &::-ms-track {
459
- width: $custom-range-track-width;
460
- height: $custom-range-track-height;
461
- color: transparent;
462
- cursor: $custom-range-track-cursor;
463
- background-color: transparent;
464
- border-color: transparent;
465
- border-width: $custom-range-thumb-height / 2;
466
- @include box-shadow($custom-range-track-box-shadow);
467
- }
468
-
469
- &::-ms-fill-lower {
470
- background-color: $custom-range-track-bg;
471
- @include border-radius($custom-range-track-border-radius);
472
- }
473
-
474
- &::-ms-fill-upper {
475
- margin-right: 15px; // arbitrary?
476
- background-color: $custom-range-track-bg;
477
- @include border-radius($custom-range-track-border-radius);
478
- }
479
-
480
- &:disabled {
481
- &::-webkit-slider-thumb {
482
- background-color: $custom-range-thumb-disabled-bg;
483
- }
484
-
485
- &::-webkit-slider-runnable-track {
486
- cursor: default;
487
- }
488
-
489
- &::-moz-range-thumb {
490
- background-color: $custom-range-thumb-disabled-bg;
491
- }
492
-
493
- &::-moz-range-track {
494
- cursor: default;
495
- }
496
-
497
- &::-ms-thumb {
498
- background-color: $custom-range-thumb-disabled-bg;
499
- }
500
- }
501
- }
502
-
503
- .custom-control-label::before,
504
- .custom-file-label,
505
- .custom-select {
506
- @include transition($custom-forms-transition);
507
- }
@@ -1,193 +0,0 @@
1
- // stylelint-disable selector-no-qualifying-type
2
-
3
- //
4
- // Base styles
5
- //
6
-
7
- .input-group {
8
- position: relative;
9
- display: flex;
10
- flex-wrap: wrap; // For form validation feedback
11
- align-items: stretch;
12
- width: 100%;
13
-
14
- > .form-control,
15
- > .form-control-plaintext,
16
- > .custom-select,
17
- > .custom-file {
18
- position: relative; // For focus state's z-index
19
- flex: 1 1 auto;
20
- // Add width 1% and flex-basis auto to ensure that button will not wrap out
21
- // the column. Applies to IE Edge+ and Firefox. Chrome does not require this.
22
- width: 1%;
23
- margin-bottom: 0;
24
-
25
- + .form-control,
26
- + .custom-select,
27
- + .custom-file {
28
- margin-left: -$input-border-width;
29
- }
30
- }
31
-
32
- // Bring the "active" form control to the top of surrounding elements
33
- > .form-control:focus,
34
- > .custom-select:focus,
35
- > .custom-file .custom-file-input:focus ~ .custom-file-label {
36
- z-index: 3;
37
- }
38
-
39
- // Bring the custom file input above the label
40
- > .custom-file .custom-file-input:focus {
41
- z-index: 4;
42
- }
43
-
44
- > .form-control,
45
- > .custom-select {
46
- &:not(:last-child) { @include border-right-radius(0); }
47
- &:not(:first-child) { @include border-left-radius(0); }
48
- }
49
-
50
- // Custom file inputs have more complex markup, thus requiring different
51
- // border-radius overrides.
52
- > .custom-file {
53
- display: flex;
54
- align-items: center;
55
-
56
- &:not(:last-child) .custom-file-label,
57
- &:not(:last-child) .custom-file-label::after { @include border-right-radius(0); }
58
- &:not(:first-child) .custom-file-label { @include border-left-radius(0); }
59
- }
60
- }
61
-
62
-
63
- // Prepend and append
64
- //
65
- // While it requires one extra layer of HTML for each, dedicated prepend and
66
- // append elements allow us to 1) be less clever, 2) simplify our selectors, and
67
- // 3) support HTML5 form validation.
68
-
69
- .input-group-prepend,
70
- .input-group-append {
71
- display: flex;
72
-
73
- // Ensure buttons are always above inputs for more visually pleasing borders.
74
- // This isn't needed for `.input-group-text` since it shares the same border-color
75
- // as our inputs.
76
- .btn {
77
- position: relative;
78
- z-index: 2;
79
-
80
- &:focus {
81
- z-index: 3;
82
- }
83
- }
84
-
85
- .btn + .btn,
86
- .btn + .input-group-text,
87
- .input-group-text + .input-group-text,
88
- .input-group-text + .btn {
89
- margin-left: -$input-border-width;
90
- }
91
- }
92
-
93
- .input-group-prepend { margin-right: -$input-border-width; }
94
- .input-group-append { margin-left: -$input-border-width; }
95
-
96
-
97
- // Textual addons
98
- //
99
- // Serves as a catch-all element for any text or radio/checkbox input you wish
100
- // to prepend or append to an input.
101
-
102
- .input-group-text {
103
- display: flex;
104
- align-items: center;
105
- padding: $input-padding-y $input-padding-x;
106
- margin-bottom: 0; // Allow use of <label> elements by overriding our default margin-bottom
107
- @include font-size($input-font-size); // Match inputs
108
- font-weight: $font-weight-normal;
109
- line-height: $input-line-height;
110
- color: $input-group-addon-color;
111
- text-align: center;
112
- white-space: nowrap;
113
- background-color: $input-group-addon-bg;
114
- border: $input-border-width solid $input-group-addon-border-color;
115
- @include border-radius($input-border-radius);
116
-
117
- // Nuke default margins from checkboxes and radios to vertically center within.
118
- input[type="radio"],
119
- input[type="checkbox"] {
120
- margin-top: 0;
121
- }
122
- }
123
-
124
-
125
- // Sizing
126
- //
127
- // Remix the default form control sizing classes into new ones for easier
128
- // manipulation.
129
-
130
- .input-group-lg > .form-control:not(textarea),
131
- .input-group-lg > .custom-select {
132
- height: $input-height-lg;
133
- }
134
-
135
- .input-group-lg > .form-control,
136
- .input-group-lg > .custom-select,
137
- .input-group-lg > .input-group-prepend > .input-group-text,
138
- .input-group-lg > .input-group-append > .input-group-text,
139
- .input-group-lg > .input-group-prepend > .btn,
140
- .input-group-lg > .input-group-append > .btn {
141
- padding: $input-padding-y-lg $input-padding-x-lg;
142
- @include font-size($input-font-size-lg);
143
- line-height: $input-line-height-lg;
144
- @include border-radius($input-border-radius-lg);
145
- }
146
-
147
- .input-group-sm > .form-control:not(textarea),
148
- .input-group-sm > .custom-select {
149
- height: $input-height-sm;
150
- }
151
-
152
- .input-group-sm > .form-control,
153
- .input-group-sm > .custom-select,
154
- .input-group-sm > .input-group-prepend > .input-group-text,
155
- .input-group-sm > .input-group-append > .input-group-text,
156
- .input-group-sm > .input-group-prepend > .btn,
157
- .input-group-sm > .input-group-append > .btn {
158
- padding: $input-padding-y-sm $input-padding-x-sm;
159
- @include font-size($input-font-size-sm);
160
- line-height: $input-line-height-sm;
161
- @include border-radius($input-border-radius-sm);
162
- }
163
-
164
- .input-group-lg > .custom-select,
165
- .input-group-sm > .custom-select {
166
- padding-right: $custom-select-padding-x + $custom-select-indicator-padding;
167
- }
168
-
169
-
170
- // Prepend and append rounded corners
171
- //
172
- // These rulesets must come after the sizing ones to properly override sm and lg
173
- // border-radius values when extending. They're more specific than we'd like
174
- // with the `.input-group >` part, but without it, we cannot override the sizing.
175
-
176
-
177
- .input-group > .input-group-prepend > .btn,
178
- .input-group > .input-group-prepend > .input-group-text,
179
- .input-group > .input-group-append:not(:last-child) > .btn,
180
- .input-group > .input-group-append:not(:last-child) > .input-group-text,
181
- .input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle),
182
- .input-group > .input-group-append:last-child > .input-group-text:not(:last-child) {
183
- @include border-right-radius(0);
184
- }
185
-
186
- .input-group > .input-group-append > .btn,
187
- .input-group > .input-group-append > .input-group-text,
188
- .input-group > .input-group-prepend:not(:first-child) > .btn,
189
- .input-group > .input-group-prepend:not(:first-child) > .input-group-text,
190
- .input-group > .input-group-prepend:first-child > .btn:not(:first-child),
191
- .input-group > .input-group-prepend:first-child > .input-group-text:not(:first-child) {
192
- @include border-left-radius(0);
193
- }
@@ -1,17 +0,0 @@
1
- .jumbotron {
2
- padding: $jumbotron-padding ($jumbotron-padding / 2);
3
- margin-bottom: $jumbotron-padding;
4
- color: $jumbotron-color;
5
- background-color: $jumbotron-bg;
6
- @include border-radius($border-radius-lg);
7
-
8
- @include media-breakpoint-up(sm) {
9
- padding: ($jumbotron-padding * 2) $jumbotron-padding;
10
- }
11
- }
12
-
13
- .jumbotron-fluid {
14
- padding-right: 0;
15
- padding-left: 0;
16
- @include border-radius(0);
17
- }