comfortable_mexican_sofa 2.0.9 → 2.0.10

Sign up to get free protection for your applications and to get access to all the features.
Files changed (192) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/javascripts/comfy/vendor/bootstrap.min.js +3 -3
  3. data/app/assets/stylesheets/comfy/admin/cms/application.sass +1 -2
  4. data/app/assets/stylesheets/comfy/admin/cms/base.sass +12 -13
  5. data/app/assets/stylesheets/comfy/vendor/bootstrap/_alert.scss +3 -1
  6. data/app/assets/stylesheets/comfy/vendor/bootstrap/_button-group.scss +31 -72
  7. data/app/assets/stylesheets/comfy/vendor/bootstrap/_buttons.scss +26 -19
  8. data/app/assets/stylesheets/comfy/vendor/bootstrap/_card.scss +23 -12
  9. data/app/assets/stylesheets/comfy/vendor/bootstrap/_carousel.scss +2 -2
  10. data/app/assets/stylesheets/comfy/vendor/bootstrap/_close.scss +6 -1
  11. data/app/assets/stylesheets/comfy/vendor/bootstrap/_code.scss +4 -12
  12. data/app/assets/stylesheets/comfy/vendor/bootstrap/_custom-forms.scss +124 -84
  13. data/app/assets/stylesheets/comfy/vendor/bootstrap/_dropdown.scss +30 -2
  14. data/app/assets/stylesheets/comfy/vendor/bootstrap/_forms.scss +46 -71
  15. data/app/assets/stylesheets/comfy/vendor/bootstrap/_functions.scss +4 -4
  16. data/app/assets/stylesheets/comfy/vendor/bootstrap/_images.scss +0 -1
  17. data/app/assets/stylesheets/comfy/vendor/bootstrap/_input-group.scss +99 -126
  18. data/app/assets/stylesheets/comfy/vendor/bootstrap/_list-group.scss +2 -1
  19. data/app/assets/stylesheets/comfy/vendor/bootstrap/_modal.scss +24 -9
  20. data/app/assets/stylesheets/comfy/vendor/bootstrap/_nav.scss +2 -2
  21. data/app/assets/stylesheets/comfy/vendor/bootstrap/_navbar.scss +8 -3
  22. data/app/assets/stylesheets/comfy/vendor/bootstrap/_pagination.scss +32 -19
  23. data/app/assets/stylesheets/comfy/vendor/bootstrap/_popover.scss +106 -117
  24. data/app/assets/stylesheets/comfy/vendor/bootstrap/_print.scss +17 -3
  25. data/app/assets/stylesheets/comfy/vendor/bootstrap/_progress.scss +4 -1
  26. data/app/assets/stylesheets/comfy/vendor/bootstrap/_reboot.scss +3 -25
  27. data/app/assets/stylesheets/comfy/vendor/bootstrap/_tables.scss +1 -1
  28. data/app/assets/stylesheets/comfy/vendor/bootstrap/_tooltip.scss +65 -57
  29. data/app/assets/stylesheets/comfy/vendor/bootstrap/_type.scss +2 -2
  30. data/app/assets/stylesheets/comfy/vendor/bootstrap/_variables.scss +174 -108
  31. data/app/assets/stylesheets/comfy/vendor/bootstrap/bootstrap-grid.scss +32 -0
  32. data/app/assets/stylesheets/comfy/vendor/bootstrap/bootstrap-reboot.scss +12 -0
  33. data/app/assets/stylesheets/comfy/vendor/bootstrap/bootstrap.scss +42 -0
  34. data/app/assets/stylesheets/comfy/vendor/bootstrap/mixins/_background-variant.scss +2 -1
  35. data/app/assets/stylesheets/comfy/vendor/bootstrap/mixins/_breakpoints.scss +11 -7
  36. data/app/assets/stylesheets/comfy/vendor/bootstrap/mixins/_buttons.scss +37 -22
  37. data/app/assets/stylesheets/comfy/vendor/bootstrap/mixins/_caret.scss +30 -0
  38. data/app/assets/stylesheets/comfy/vendor/bootstrap/mixins/_forms.scss +48 -19
  39. data/app/assets/stylesheets/comfy/vendor/bootstrap/mixins/_grid-framework.scss +5 -7
  40. data/app/assets/stylesheets/comfy/vendor/bootstrap/mixins/_hover.scss +24 -46
  41. data/app/assets/stylesheets/comfy/vendor/bootstrap/mixins/_list-group.scss +10 -13
  42. data/app/assets/stylesheets/comfy/vendor/bootstrap/mixins/_screen-reader.scss +1 -1
  43. data/app/assets/stylesheets/comfy/vendor/bootstrap/mixins/_text-hide.scss +1 -0
  44. data/app/assets/stylesheets/comfy/vendor/bootstrap/utilities/_borders.scss +6 -1
  45. data/app/assets/stylesheets/comfy/vendor/bootstrap/utilities/_display.scss +10 -28
  46. data/app/controllers/comfy/admin/cms/files_controller.rb +6 -7
  47. data/app/helpers/comfy/admin/cms_helper.rb +5 -4
  48. data/app/models/concerns/comfy/cms/with_categories.rb +20 -9
  49. data/app/views/comfy/admin/cms/categories/_edit.html.haml +3 -3
  50. data/app/views/comfy/admin/cms/categories/_form.html.haml +3 -9
  51. data/app/views/comfy/admin/cms/categories/_index.html.haml +2 -2
  52. data/app/views/comfy/admin/cms/categories/_show.html.haml +4 -3
  53. data/app/views/comfy/admin/cms/categories/create.js.erb +1 -1
  54. data/app/views/comfy/admin/cms/files/_form.html.haml +11 -12
  55. data/app/views/comfy/admin/cms/files/edit.html.haml +2 -2
  56. data/app/views/comfy/admin/cms/files/new.html.haml +2 -2
  57. data/app/views/comfy/admin/cms/fragments/_form_fragment_attachments.html.haml +7 -5
  58. data/app/views/comfy/admin/cms/fragments/_form_fragments.html.haml +1 -1
  59. data/app/views/comfy/admin/cms/layouts/_form.html.haml +3 -2
  60. data/app/views/comfy/admin/cms/layouts/edit.html.haml +1 -1
  61. data/app/views/comfy/admin/cms/layouts/new.html.haml +2 -2
  62. data/app/views/comfy/admin/cms/pages/_form.html.haml +3 -5
  63. data/app/views/comfy/admin/cms/pages/edit.html.haml +1 -1
  64. data/app/views/comfy/admin/cms/pages/new.html.haml +1 -1
  65. data/app/views/comfy/admin/cms/revisions/show.html.haml +2 -2
  66. data/app/views/comfy/admin/cms/sites/_form.html.haml +4 -4
  67. data/app/views/comfy/admin/cms/sites/edit.html.haml +1 -1
  68. data/app/views/comfy/admin/cms/sites/new.html.haml +2 -2
  69. data/app/views/comfy/admin/cms/snippets/_form.html.haml +2 -2
  70. data/app/views/comfy/admin/cms/snippets/edit.html.haml +1 -1
  71. data/app/views/comfy/admin/cms/snippets/new.html.haml +2 -2
  72. data/app/views/comfy/admin/cms/translations/_form.html.haml +5 -7
  73. data/app/views/comfy/admin/cms/translations/edit.html.haml +1 -1
  74. data/app/views/comfy/admin/cms/translations/new.html.haml +2 -2
  75. data/comfortable_mexican_sofa.gemspec +6 -3
  76. data/config/locales/fr.yml +33 -33
  77. data/lib/comfortable_mexican_sofa/content/tags/file.rb +1 -1
  78. data/lib/comfortable_mexican_sofa/content/tags/files.rb +1 -1
  79. data/lib/comfortable_mexican_sofa/form_builder.rb +10 -15
  80. data/lib/comfortable_mexican_sofa/seeds.rb +2 -5
  81. data/lib/comfortable_mexican_sofa/version.rb +1 -1
  82. metadata +9 -116
  83. data/app/assets/stylesheets/comfy/vendor/_bootstrap.scss +0 -42
  84. data/doc/preview.jpg +0 -0
  85. data/test/controllers/comfy/admin/cms/base_controller_test.rb +0 -18
  86. data/test/controllers/comfy/admin/cms/categories_controller_test.rb +0 -74
  87. data/test/controllers/comfy/admin/cms/files_controller_test.rb +0 -242
  88. data/test/controllers/comfy/admin/cms/layouts_controller_test.rb +0 -137
  89. data/test/controllers/comfy/admin/cms/pages_controller_test.rb +0 -580
  90. data/test/controllers/comfy/admin/cms/revisions/layout_controller_test.rb +0 -62
  91. data/test/controllers/comfy/admin/cms/revisions/page_controller_test.rb +0 -87
  92. data/test/controllers/comfy/admin/cms/revisions/snippet_controller_test.rb +0 -60
  93. data/test/controllers/comfy/admin/cms/revisions/translation_controller_test.rb +0 -68
  94. data/test/controllers/comfy/admin/cms/sites_controller_test.rb +0 -106
  95. data/test/controllers/comfy/admin/cms/snippets_controller_test.rb +0 -156
  96. data/test/controllers/comfy/admin/cms/translations_controller_test.rb +0 -182
  97. data/test/controllers/comfy/cms/assets_controller_test.rb +0 -61
  98. data/test/controllers/comfy/cms/content_controller_test.rb +0 -249
  99. data/test/fixtures/active_storage/attachments.yml +0 -9
  100. data/test/fixtures/active_storage/blobs.yml +0 -13
  101. data/test/fixtures/comfy/cms/categories.yml +0 -4
  102. data/test/fixtures/comfy/cms/categorizations.yml +0 -3
  103. data/test/fixtures/comfy/cms/files.yml +0 -5
  104. data/test/fixtures/comfy/cms/fragments.yml +0 -25
  105. data/test/fixtures/comfy/cms/layouts.yml +0 -34
  106. data/test/fixtures/comfy/cms/pages.yml +0 -24
  107. data/test/fixtures/comfy/cms/revisions.yml +0 -29
  108. data/test/fixtures/comfy/cms/sites.yml +0 -5
  109. data/test/fixtures/comfy/cms/snippets.yml +0 -6
  110. data/test/fixtures/comfy/cms/translations.yml +0 -7
  111. data/test/fixtures/files/data.zip +0 -0
  112. data/test/fixtures/files/document.pdf +0 -0
  113. data/test/fixtures/files/image.gif +0 -0
  114. data/test/fixtures/files/image.jpg +0 -0
  115. data/test/fixtures/generators/cms/application.rb +0 -7
  116. data/test/fixtures/generators/cms/routes.rb +0 -5
  117. data/test/fixtures/generators/scaffold/controller.rb +0 -62
  118. data/test/fixtures/generators/scaffold/migration.rb +0 -9
  119. data/test/fixtures/generators/scaffold/model.rb +0 -21
  120. data/test/fixtures/generators/scaffold/routes.rb +0 -6
  121. data/test/fixtures/generators/scaffold/tests/controller.rb +0 -111
  122. data/test/fixtures/generators/scaffold/tests/fixture +0 -2
  123. data/test/fixtures/generators/scaffold/tests/model.rb +0 -24
  124. data/test/fixtures/generators/scaffold/views/_form.haml +0 -5
  125. data/test/fixtures/generators/scaffold/views/edit.haml +0 -5
  126. data/test/fixtures/generators/scaffold/views/index.haml +0 -21
  127. data/test/fixtures/generators/scaffold/views/new.haml +0 -5
  128. data/test/fixtures/generators/scaffold/views/show.haml +0 -4
  129. data/test/fixtures/views/_nav_hook.html.erb +0 -1
  130. data/test/fixtures/views/_nav_hook_2.html.erb +0 -1
  131. data/test/fixtures/views/render_test/_test.html.erb +0 -1
  132. data/test/fixtures/views/render_test/new.html.erb +0 -1
  133. data/test/fixtures/views/render_test/render_layout.html.erb +0 -1
  134. data/test/gemfiles/5.2.gemfile +0 -19
  135. data/test/generators/cms_assets_generator_test.rb +0 -14
  136. data/test/generators/cms_controllers_generator_test.rb +0 -14
  137. data/test/generators/cms_generator_test.rb +0 -26
  138. data/test/generators/cms_models_generator_test.rb +0 -14
  139. data/test/generators/cms_views_generator_test.rb +0 -14
  140. data/test/generators/scaffold_generator_test.rb +0 -32
  141. data/test/helpers/cms_helper_test.rb +0 -106
  142. data/test/integration/access_control_test.rb +0 -179
  143. data/test/integration/i18n_test.rb +0 -38
  144. data/test/integration/meta_variables_test.rb +0 -27
  145. data/test/integration/render_cms_test.rb +0 -255
  146. data/test/integration/routing_test.rb +0 -19
  147. data/test/integration/seeds_test.rb +0 -75
  148. data/test/integration/sites_test.rb +0 -107
  149. data/test/integration/view_hooks_test.rb +0 -47
  150. data/test/lib/configuration_test.rb +0 -38
  151. data/test/lib/content/block_test.rb +0 -26
  152. data/test/lib/content/params_parser_test.rb +0 -126
  153. data/test/lib/content/renderer_test.rb +0 -276
  154. data/test/lib/content/tag_test.rb +0 -58
  155. data/test/lib/content/tags/asset_test.rb +0 -104
  156. data/test/lib/content/tags/checkbox_test.rb +0 -21
  157. data/test/lib/content/tags/date_test.rb +0 -21
  158. data/test/lib/content/tags/datetime_test.rb +0 -21
  159. data/test/lib/content/tags/file_link_test.rb +0 -91
  160. data/test/lib/content/tags/file_test.rb +0 -69
  161. data/test/lib/content/tags/files_test.rb +0 -52
  162. data/test/lib/content/tags/fragment_test.rb +0 -68
  163. data/test/lib/content/tags/helper_test.rb +0 -62
  164. data/test/lib/content/tags/markdown_test.rb +0 -37
  165. data/test/lib/content/tags/number_test.rb +0 -14
  166. data/test/lib/content/tags/partial_test.rb +0 -65
  167. data/test/lib/content/tags/snippet_test.rb +0 -37
  168. data/test/lib/content/tags/template_test.rb +0 -51
  169. data/test/lib/content/tags/text_test.rb +0 -14
  170. data/test/lib/content/tags/textarea_test.rb +0 -14
  171. data/test/lib/content/tags/wysiwyg_test.rb +0 -14
  172. data/test/lib/revisions_test.rb +0 -222
  173. data/test/lib/seeds/files_test.rb +0 -97
  174. data/test/lib/seeds/layouts_test.rb +0 -156
  175. data/test/lib/seeds/pages_test.rb +0 -230
  176. data/test/lib/seeds/snippets_test.rb +0 -99
  177. data/test/lib/seeds_test.rb +0 -51
  178. data/test/models/categorization_test.rb +0 -76
  179. data/test/models/category_test.rb +0 -39
  180. data/test/models/file_test.rb +0 -43
  181. data/test/models/fragment_test.rb +0 -132
  182. data/test/models/layout_test.rb +0 -194
  183. data/test/models/page_test.rb +0 -575
  184. data/test/models/site_test.rb +0 -190
  185. data/test/models/snippet_test.rb +0 -56
  186. data/test/models/translation_test.rb +0 -67
  187. data/test/system/layouts_frontend_test.rb +0 -15
  188. data/test/system/pages_frontend_test.rb +0 -15
  189. data/test/system/sites_frontend_test.rb +0 -11
  190. data/test/system/snippets_frontend_test.rb +0 -15
  191. data/test/tasks/cms_seeds_test.rb +0 -34
  192. data/test/test_helper.rb +0 -201
@@ -7,15 +7,13 @@
7
7
  .form-control {
8
8
  display: block;
9
9
  width: 100%;
10
- padding: $input-btn-padding-y $input-btn-padding-x;
10
+ padding: $input-padding-y $input-padding-x;
11
11
  font-size: $font-size-base;
12
- line-height: $input-btn-line-height;
12
+ line-height: $input-line-height;
13
13
  color: $input-color;
14
14
  background-color: $input-bg;
15
- // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214.
16
- background-image: none;
17
15
  background-clip: padding-box;
18
- border: $input-btn-border-width solid $input-border-color;
16
+ border: $input-border-width solid $input-border-color;
19
17
 
20
18
  // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
21
19
  @if $enable-rounded {
@@ -78,6 +76,7 @@ select.form-control {
78
76
  .form-control-file,
79
77
  .form-control-range {
80
78
  display: block;
79
+ width: 100%;
81
80
  }
82
81
 
83
82
 
@@ -85,41 +84,28 @@ select.form-control {
85
84
  // Labels
86
85
  //
87
86
 
88
- // For use with horizontal and inline forms, when you need the label text to
89
- // align with the form controls.
87
+ // For use with horizontal and inline forms, when you need the label (or legend)
88
+ // text to align with the form controls.
90
89
  .col-form-label {
91
- padding-top: calc(#{$input-btn-padding-y} + #{$input-btn-border-width});
92
- padding-bottom: calc(#{$input-btn-padding-y} + #{$input-btn-border-width});
93
- margin-bottom: 0; // Override the `<label>` default
94
- line-height: $input-btn-line-height;
90
+ padding-top: calc(#{$input-padding-y} + #{$input-border-width});
91
+ padding-bottom: calc(#{$input-padding-y} + #{$input-border-width});
92
+ margin-bottom: 0; // Override the `<label>/<legend>` default
93
+ font-size: inherit; // Override the `<legend>` default
94
+ line-height: $input-line-height;
95
95
  }
96
96
 
97
97
  .col-form-label-lg {
98
- padding-top: calc(#{$input-btn-padding-y-lg} + #{$input-btn-border-width});
99
- padding-bottom: calc(#{$input-btn-padding-y-lg} + #{$input-btn-border-width});
98
+ padding-top: calc(#{$input-padding-y-lg} + #{$input-border-width});
99
+ padding-bottom: calc(#{$input-padding-y-lg} + #{$input-border-width});
100
100
  font-size: $font-size-lg;
101
- line-height: $input-btn-line-height-lg;
101
+ line-height: $input-line-height-lg;
102
102
  }
103
103
 
104
104
  .col-form-label-sm {
105
- padding-top: calc(#{$input-btn-padding-y-sm} + #{$input-btn-border-width});
106
- padding-bottom: calc(#{$input-btn-padding-y-sm} + #{$input-btn-border-width});
105
+ padding-top: calc(#{$input-padding-y-sm} + #{$input-border-width});
106
+ padding-bottom: calc(#{$input-padding-y-sm} + #{$input-border-width});
107
107
  font-size: $font-size-sm;
108
- line-height: $input-btn-line-height-sm;
109
- }
110
-
111
-
112
- //
113
- // Legends
114
- //
115
-
116
- // For use with horizontal and inline forms, when you need the legend text to
117
- // be the same size as regular labels, and to align with the form controls.
118
- .col-form-legend {
119
- padding-top: $input-btn-padding-y;
120
- padding-bottom: $input-btn-padding-y;
121
- margin-bottom: 0;
122
- font-size: $font-size-base;
108
+ line-height: $input-line-height-sm;
123
109
  }
124
110
 
125
111
 
@@ -129,13 +115,15 @@ select.form-control {
129
115
  // text (without any border, background color, focus indicator)
130
116
 
131
117
  .form-control-plaintext {
132
- padding-top: $input-btn-padding-y;
133
- padding-bottom: $input-btn-padding-y;
118
+ display: block;
119
+ width: 100%;
120
+ padding-top: $input-padding-y;
121
+ padding-bottom: $input-padding-y;
134
122
  margin-bottom: 0; // match inputs if this class comes on inputs with default margins
135
- line-height: $input-btn-line-height;
123
+ line-height: $input-line-height;
136
124
  background-color: transparent;
137
125
  border: solid transparent;
138
- border-width: $input-btn-border-width 0;
126
+ border-width: $input-border-width 0;
139
127
 
140
128
  &.form-control-sm,
141
129
  &.form-control-lg {
@@ -154,9 +142,9 @@ select.form-control {
154
142
  // issue documented in https://github.com/twbs/bootstrap/issues/15074.
155
143
 
156
144
  .form-control-sm {
157
- padding: $input-btn-padding-y-sm $input-btn-padding-x-sm;
145
+ padding: $input-padding-y-sm $input-padding-x-sm;
158
146
  font-size: $font-size-sm;
159
- line-height: $input-btn-line-height-sm;
147
+ line-height: $input-line-height-sm;
160
148
  @include border-radius($input-border-radius-sm);
161
149
  }
162
150
 
@@ -167,9 +155,9 @@ select.form-control-sm {
167
155
  }
168
156
 
169
157
  .form-control-lg {
170
- padding: $input-btn-padding-y-lg $input-btn-padding-x-lg;
158
+ padding: $input-padding-y-lg $input-padding-x-lg;
171
159
  font-size: $font-size-lg;
172
- line-height: $input-btn-line-height-lg;
160
+ line-height: $input-line-height-lg;
173
161
  @include border-radius($input-border-radius-lg);
174
162
  }
175
163
 
@@ -220,33 +208,35 @@ select.form-control-lg {
220
208
  .form-check {
221
209
  position: relative;
222
210
  display: block;
223
- margin-bottom: $form-check-margin-bottom;
224
-
225
- &.disabled {
226
- .form-check-label {
227
- color: $text-muted;
228
- }
229
- }
230
- }
231
-
232
- .form-check-label {
233
211
  padding-left: $form-check-input-gutter;
234
- margin-bottom: 0; // Override default `<label>` bottom margin
235
212
  }
236
213
 
237
214
  .form-check-input {
238
215
  position: absolute;
239
216
  margin-top: $form-check-input-margin-y;
240
217
  margin-left: -$form-check-input-gutter;
218
+
219
+ &:disabled ~ .form-check-label {
220
+ color: $text-muted;
221
+ }
222
+ }
223
+
224
+ .form-check-label {
225
+ margin-bottom: 0; // Override default `<label>` bottom margin
241
226
  }
242
227
 
243
- // Radios and checkboxes on same line
244
228
  .form-check-inline {
245
- display: inline-block;
229
+ display: inline-flex;
230
+ align-items: center;
231
+ padding-left: 0; // Override base .form-check
246
232
  margin-right: $form-check-inline-margin-x;
247
233
 
248
- .form-check-label {
249
- vertical-align: middle;
234
+ // Undo .form-check-input defaults and add some `margin-right`.
235
+ .form-check-input {
236
+ position: static;
237
+ margin-top: 0;
238
+ margin-right: $form-check-inline-input-margin-x;
239
+ margin-left: 0;
250
240
  }
251
241
  }
252
242
 
@@ -323,10 +313,6 @@ select.form-control-lg {
323
313
  align-items: center;
324
314
  justify-content: center;
325
315
  width: auto;
326
- margin-top: 0;
327
- margin-bottom: 0;
328
- }
329
- .form-check-label {
330
316
  padding-left: 0;
331
317
  }
332
318
  .form-check-input {
@@ -336,23 +322,12 @@ select.form-control-lg {
336
322
  margin-left: 0;
337
323
  }
338
324
 
339
- // Custom form controls
340
325
  .custom-control {
341
- display: flex;
342
326
  align-items: center;
343
327
  justify-content: center;
344
- padding-left: 0;
345
328
  }
346
- .custom-control-indicator {
347
- position: static;
348
- display: inline-block;
349
- margin-right: $form-check-input-margin-x; // Flexbox alignment means we lose our HTML space here, so we compensate.
350
- vertical-align: text-bottom;
351
- }
352
-
353
- // Re-override the feedback icon.
354
- .has-feedback .form-control-feedback {
355
- top: 0;
329
+ .custom-control-label {
330
+ margin-bottom: 0;
356
331
  }
357
332
  }
358
333
  }
@@ -56,14 +56,14 @@
56
56
 
57
57
  $yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000;
58
58
 
59
- @if ($yiq >= 150) {
60
- @return #111;
59
+ @if ($yiq >= $yiq-contrasted-threshold) {
60
+ @return $yiq-text-dark;
61
61
  } @else {
62
- @return #fff;
62
+ @return $yiq-text-light;
63
63
  }
64
64
  }
65
65
 
66
- // Retreive color Sass maps
66
+ // Retrieve color Sass maps
67
67
  @function color($key: "blue") {
68
68
  @return map-get($colors, $key);
69
69
  }
@@ -16,7 +16,6 @@
16
16
  background-color: $thumbnail-bg;
17
17
  border: $thumbnail-border-width solid $thumbnail-border-color;
18
18
  @include border-radius($thumbnail-border-radius);
19
- @include transition($thumbnail-transition);
20
19
  @include box-shadow($thumbnail-box-shadow);
21
20
 
22
21
  // Keep them at most 100% wide
@@ -7,89 +7,102 @@
7
7
  .input-group {
8
8
  position: relative;
9
9
  display: flex;
10
+ flex-wrap: wrap; // For form validation feedback
10
11
  align-items: stretch;
11
12
  width: 100%;
12
13
 
13
- .form-control {
14
- // Ensure that the input is always above the *appended* addon button for
15
- // proper border colors.
16
- position: relative;
17
- z-index: 2;
14
+ > .form-control,
15
+ > .custom-select,
16
+ > .custom-file {
17
+ position: relative; // For focus state's z-index
18
18
  flex: 1 1 auto;
19
19
  // Add width 1% and flex-basis auto to ensure that button will not wrap out
20
20
  // the column. Applies to IE Edge+ and Firefox. Chrome does not require this.
21
21
  width: 1%;
22
22
  margin-bottom: 0;
23
23
 
24
- // Bring the "active" form control to the front
25
- @include hover-focus-active {
24
+ // Bring the "active" form control to the top of surrounding elements
25
+ &:focus {
26
26
  z-index: 3;
27
27
  }
28
+
29
+ + .form-control,
30
+ + .custom-select,
31
+ + .custom-file {
32
+ margin-left: -$input-border-width;
33
+ }
28
34
  }
29
- }
30
35
 
31
- .input-group-addon,
32
- .input-group-btn,
33
- .input-group .form-control {
34
- display: flex;
35
- align-items: center;
36
- &:not(:first-child):not(:last-child) {
37
- @include border-radius(0);
36
+ > .form-control,
37
+ > .custom-select {
38
+ &:not(:last-child) { @include border-right-radius(0); }
39
+ &:not(:first-child) { @include border-left-radius(0); }
38
40
  }
39
- }
40
41
 
41
- .input-group-addon,
42
- .input-group-btn {
43
- white-space: nowrap;
42
+ // Custom file inputs have more complex markup, thus requiring different
43
+ // border-radius overrides.
44
+ > .custom-file {
45
+ display: flex;
46
+ align-items: center;
47
+
48
+ &:not(:last-child) .custom-file-label,
49
+ &:not(:last-child) .custom-file-label::before { @include border-right-radius(0); }
50
+ &:not(:first-child) .custom-file-label,
51
+ &:not(:first-child) .custom-file-label::before { @include border-left-radius(0); }
52
+ }
44
53
  }
45
54
 
46
55
 
47
- // Sizing options
56
+ // Prepend and append
48
57
  //
49
- // Remix the default form control sizing classes into new ones for easier
50
- // manipulation.
58
+ // While it requires one extra layer of HTML for each, dedicated prepend and
59
+ // append elements allow us to 1) be less clever, 2) simplify our selectors, and
60
+ // 3) support HTML5 form validation.
51
61
 
52
- .input-group-lg > .form-control,
53
- .input-group-lg > .input-group-addon,
54
- .input-group-lg > .input-group-btn > .btn {
55
- @extend .form-control-lg;
56
- }
57
- .input-group-sm > .form-control,
58
- .input-group-sm > .input-group-addon,
59
- .input-group-sm > .input-group-btn > .btn {
60
- @extend .form-control-sm;
62
+ .input-group-prepend,
63
+ .input-group-append {
64
+ display: flex;
65
+
66
+ // Ensure buttons are always above inputs for more visually pleasing borders.
67
+ // This isn't needed for `.input-group-text` since it shares the same border-color
68
+ // as our inputs.
69
+ .btn {
70
+ position: relative;
71
+ z-index: 2;
72
+ }
73
+
74
+ .btn + .btn,
75
+ .btn + .input-group-text,
76
+ .input-group-text + .input-group-text,
77
+ .input-group-text + .btn {
78
+ margin-left: -$input-border-width;
79
+ }
61
80
  }
62
81
 
82
+ .input-group-prepend { margin-right: -$input-border-width; }
83
+ .input-group-append { margin-left: -$input-border-width; }
63
84
 
85
+
86
+ // Textual addons
64
87
  //
65
- // Text input groups
66
- //
88
+ // Serves as a catch-all element for any text or radio/checkbox input you wish
89
+ // to prepend or append to an input.
67
90
 
68
- .input-group-addon {
69
- padding: $input-btn-padding-y $input-btn-padding-x;
91
+ .input-group-text {
92
+ display: flex;
93
+ align-items: center;
94
+ padding: $input-padding-y $input-padding-x;
70
95
  margin-bottom: 0; // Allow use of <label> elements by overriding our default margin-bottom
71
96
  font-size: $font-size-base; // Match inputs
72
97
  font-weight: $font-weight-normal;
73
- line-height: $input-btn-line-height;
98
+ line-height: $input-line-height;
74
99
  color: $input-group-addon-color;
75
100
  text-align: center;
101
+ white-space: nowrap;
76
102
  background-color: $input-group-addon-bg;
77
- border: $input-btn-border-width solid $input-group-addon-border-color;
103
+ border: $input-border-width solid $input-group-addon-border-color;
78
104
  @include border-radius($input-border-radius);
79
105
 
80
- // Sizing
81
- &.form-control-sm {
82
- padding: $input-btn-padding-y-sm $input-btn-padding-x-sm;
83
- font-size: $font-size-sm;
84
- @include border-radius($input-border-radius-sm);
85
- }
86
-
87
- &.form-control-lg {
88
- padding: $input-btn-padding-y-lg $input-btn-padding-x-lg;
89
- font-size: $font-size-lg;
90
- @include border-radius($input-border-radius-lg);
91
- }
92
-
93
106
  // Nuke default margins from checkboxes and radios to vertically center within.
94
107
  input[type="radio"],
95
108
  input[type="checkbox"] {
@@ -98,89 +111,49 @@
98
111
  }
99
112
 
100
113
 
114
+ // Sizing
101
115
  //
102
- // Reset rounded corners
103
- //
116
+ // Remix the default form control sizing classes into new ones for easier
117
+ // manipulation.
104
118
 
105
- .input-group .form-control:not(:last-child),
106
- .input-group-addon:not(:last-child),
107
- .input-group-btn:not(:last-child) > .btn,
108
- .input-group-btn:not(:last-child) > .btn-group > .btn,
109
- .input-group-btn:not(:last-child) > .dropdown-toggle,
110
- .input-group-btn:not(:first-child) > .btn:not(:last-child):not(.dropdown-toggle),
111
- .input-group-btn:not(:first-child) > .btn-group:not(:last-child) > .btn {
112
- @include border-right-radius(0);
113
- }
114
- .input-group-addon:not(:last-child) {
115
- border-right: 0;
116
- }
117
- .input-group .form-control:not(:first-child),
118
- .input-group-addon:not(:first-child),
119
- .input-group-btn:not(:first-child) > .btn,
120
- .input-group-btn:not(:first-child) > .btn-group > .btn,
121
- .input-group-btn:not(:first-child) > .dropdown-toggle,
122
- .input-group-btn:not(:last-child) > .btn:not(:first-child),
123
- .input-group-btn:not(:last-child) > .btn-group:not(:first-child) > .btn {
124
- @include border-left-radius(0);
125
- }
126
- .form-control + .input-group-addon:not(:first-child) {
127
- border-left: 0;
119
+ .input-group-lg > .form-control,
120
+ .input-group-lg > .input-group-prepend > .input-group-text,
121
+ .input-group-lg > .input-group-append > .input-group-text,
122
+ .input-group-lg > .input-group-prepend > .btn,
123
+ .input-group-lg > .input-group-append > .btn {
124
+ @extend .form-control-lg;
128
125
  }
129
126
 
130
- //
131
- // Button input groups
132
- //
133
-
134
- .input-group-btn {
135
- position: relative;
136
- align-items: stretch;
137
- // Jankily prevent input button groups from wrapping with `white-space` and
138
- // `font-size` in combination with `inline-block` on buttons.
139
- font-size: 0;
140
- white-space: nowrap;
127
+ .input-group-sm > .form-control,
128
+ .input-group-sm > .input-group-prepend > .input-group-text,
129
+ .input-group-sm > .input-group-append > .input-group-text,
130
+ .input-group-sm > .input-group-prepend > .btn,
131
+ .input-group-sm > .input-group-append > .btn {
132
+ @extend .form-control-sm;
133
+ }
141
134
 
142
- // Negative margin for spacing, position for bringing hovered/focused/actived
143
- // element above the siblings.
144
- > .btn {
145
- position: relative;
146
135
 
147
- + .btn {
148
- margin-left: (-$input-btn-border-width);
149
- }
136
+ // Prepend and append rounded corners
137
+ //
138
+ // These rulesets must come after the sizing ones to properly override sm and lg
139
+ // border-radius values when extending. They're more specific than we'd like
140
+ // with the `.input-group >` part, but without it, we cannot override the sizing.
150
141
 
151
- // Bring the "active" button to the front
152
- @include hover-focus-active {
153
- z-index: 3;
154
- }
155
- }
156
142
 
157
- &:first-child > .btn + .btn {
158
- margin-left: 0;
159
- }
143
+ .input-group > .input-group-prepend > .btn,
144
+ .input-group > .input-group-prepend > .input-group-text,
145
+ .input-group > .input-group-append:not(:last-child) > .btn,
146
+ .input-group > .input-group-append:not(:last-child) > .input-group-text,
147
+ .input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle),
148
+ .input-group > .input-group-append:last-child > .input-group-text:not(:last-child) {
149
+ @include border-right-radius(0);
150
+ }
160
151
 
161
- // Negative margin to only have a single, shared border between the two
162
- &:not(:last-child) {
163
- > .btn,
164
- > .btn-group {
165
- margin-right: (-$input-btn-border-width);
166
- }
167
- }
168
- &:not(:first-child) {
169
- > .btn,
170
- > .btn-group {
171
- z-index: 2;
172
- // remove nagative margin ($input-btn-border-width) to solve overlapping issue with button.
173
- margin-left: 0;
174
-
175
- // When input is first, overlap the right side of it with the button(-group)
176
- &:first-child {
177
- margin-left: (-$input-btn-border-width);
178
- }
179
-
180
- // Because specificity
181
- @include hover-focus-active {
182
- z-index: 3;
183
- }
184
- }
185
- }
152
+ .input-group > .input-group-append > .btn,
153
+ .input-group > .input-group-append > .input-group-text,
154
+ .input-group > .input-group-prepend:not(:first-child) > .btn,
155
+ .input-group > .input-group-prepend:not(:first-child) > .input-group-text,
156
+ .input-group > .input-group-prepend:first-child > .btn:not(:first-child),
157
+ .input-group > .input-group-prepend:first-child > .input-group-text:not(:first-child) {
158
+ @include border-left-radius(0);
186
159
  }