flipper-ui 0.2.0.beta2 → 0.2.0.beta3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (218) hide show
  1. checksums.yaml +4 -4
  2. data/Gemfile +12 -11
  3. data/README.md +5 -7
  4. data/examples/basic.ru +27 -26
  5. data/flipper-ui.gemspec +5 -3
  6. data/lib/flipper-ui.rb +1 -0
  7. data/lib/flipper/ui.rb +11 -2
  8. data/lib/flipper/ui/action.rb +45 -4
  9. data/lib/flipper/ui/actions/actors_gate.rb +48 -0
  10. data/lib/flipper/ui/actions/add_feature.rb +20 -0
  11. data/lib/flipper/ui/actions/boolean_gate.rb +26 -0
  12. data/lib/flipper/ui/actions/feature.rb +32 -0
  13. data/lib/flipper/ui/actions/features.rb +23 -3
  14. data/lib/flipper/ui/actions/file.rb +1 -1
  15. data/lib/flipper/ui/actions/gate.rb +11 -117
  16. data/lib/flipper/ui/actions/groups_gate.rb +43 -0
  17. data/lib/flipper/ui/actions/{index.rb → home.rb} +3 -3
  18. data/lib/flipper/ui/actions/percentage_of_actors_gate.rb +27 -0
  19. data/lib/flipper/ui/actions/percentage_of_time_gate.rb +27 -0
  20. data/lib/flipper/ui/actor.rb +13 -0
  21. data/lib/flipper/ui/assets/javascripts/application.coffee +0 -305
  22. data/lib/flipper/ui/assets/stylesheets/_bootstrap-compass.scss +9 -0
  23. data/lib/flipper/ui/assets/stylesheets/_bootstrap-mincer.scss +19 -0
  24. data/lib/flipper/ui/assets/stylesheets/_bootstrap-sprockets.scss +9 -0
  25. data/lib/flipper/ui/assets/stylesheets/_bootstrap.scss +50 -0
  26. data/lib/flipper/ui/assets/stylesheets/application.scss +33 -216
  27. data/lib/flipper/ui/assets/stylesheets/bootstrap/_alerts.scss +73 -0
  28. data/lib/flipper/ui/assets/stylesheets/bootstrap/_badges.scss +68 -0
  29. data/lib/flipper/ui/assets/stylesheets/bootstrap/_breadcrumbs.scss +26 -0
  30. data/lib/flipper/ui/assets/stylesheets/bootstrap/_button-groups.scss +243 -0
  31. data/lib/flipper/ui/assets/stylesheets/bootstrap/_buttons.scss +160 -0
  32. data/lib/flipper/ui/assets/stylesheets/bootstrap/_carousel.scss +269 -0
  33. data/lib/flipper/ui/assets/stylesheets/bootstrap/_close.scss +36 -0
  34. data/lib/flipper/ui/assets/stylesheets/bootstrap/_code.scss +69 -0
  35. data/lib/flipper/ui/assets/stylesheets/bootstrap/_component-animations.scss +37 -0
  36. data/lib/flipper/ui/assets/stylesheets/bootstrap/_dropdowns.scss +214 -0
  37. data/lib/flipper/ui/assets/stylesheets/bootstrap/_forms.scss +578 -0
  38. data/lib/flipper/ui/assets/stylesheets/bootstrap/_glyphicons.scss +305 -0
  39. data/lib/flipper/ui/assets/stylesheets/bootstrap/_grid.scss +84 -0
  40. data/lib/flipper/ui/assets/stylesheets/bootstrap/_input-groups.scss +166 -0
  41. data/lib/flipper/ui/assets/stylesheets/bootstrap/_jumbotron.scss +50 -0
  42. data/lib/flipper/ui/assets/stylesheets/bootstrap/_labels.scss +66 -0
  43. data/lib/flipper/ui/assets/stylesheets/bootstrap/_list-group.scss +124 -0
  44. data/lib/flipper/ui/assets/stylesheets/bootstrap/_media.scss +61 -0
  45. data/lib/flipper/ui/assets/stylesheets/bootstrap/_mixins.scss +39 -0
  46. data/lib/flipper/ui/assets/stylesheets/bootstrap/_modals.scss +150 -0
  47. data/lib/flipper/ui/assets/stylesheets/bootstrap/_navbar.scss +662 -0
  48. data/lib/flipper/ui/assets/stylesheets/bootstrap/_navs.scss +242 -0
  49. data/lib/flipper/ui/assets/stylesheets/bootstrap/_normalize.scss +427 -0
  50. data/lib/flipper/ui/assets/stylesheets/bootstrap/_pager.scss +54 -0
  51. data/lib/flipper/ui/assets/stylesheets/bootstrap/_pagination.scss +88 -0
  52. data/lib/flipper/ui/assets/stylesheets/bootstrap/_panels.scss +265 -0
  53. data/lib/flipper/ui/assets/stylesheets/bootstrap/_popovers.scss +135 -0
  54. data/lib/flipper/ui/assets/stylesheets/bootstrap/_print.scss +107 -0
  55. data/lib/flipper/ui/assets/stylesheets/bootstrap/_progress-bars.scss +87 -0
  56. data/lib/flipper/ui/assets/stylesheets/bootstrap/_responsive-embed.scss +35 -0
  57. data/lib/flipper/ui/assets/stylesheets/bootstrap/_responsive-utilities.scss +177 -0
  58. data/lib/flipper/ui/assets/stylesheets/bootstrap/_scaffolding.scss +162 -0
  59. data/lib/flipper/ui/assets/stylesheets/bootstrap/_tables.scss +234 -0
  60. data/lib/flipper/ui/assets/stylesheets/bootstrap/_theme.scss +273 -0
  61. data/lib/flipper/ui/assets/stylesheets/bootstrap/_thumbnails.scss +38 -0
  62. data/lib/flipper/ui/assets/stylesheets/bootstrap/_tooltip.scss +102 -0
  63. data/lib/flipper/ui/assets/stylesheets/bootstrap/_type.scss +298 -0
  64. data/lib/flipper/ui/assets/stylesheets/bootstrap/_utilities.scss +55 -0
  65. data/lib/flipper/ui/assets/stylesheets/bootstrap/_variables.scss +866 -0
  66. data/lib/flipper/ui/assets/stylesheets/bootstrap/_wells.scss +29 -0
  67. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_alerts.scss +14 -0
  68. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_background-variant.scss +11 -0
  69. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_border-radius.scss +18 -0
  70. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_buttons.scss +52 -0
  71. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_center-block.scss +7 -0
  72. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_clearfix.scss +22 -0
  73. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_forms.scss +88 -0
  74. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_gradients.scss +58 -0
  75. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_grid-framework.scss +81 -0
  76. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_grid.scss +122 -0
  77. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_hide-text.scss +21 -0
  78. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_image.scss +33 -0
  79. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_labels.scss +12 -0
  80. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_list-group.scss +31 -0
  81. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_nav-divider.scss +10 -0
  82. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_nav-vertical-align.scss +9 -0
  83. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_opacity.scss +8 -0
  84. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_pagination.scss +23 -0
  85. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_panels.scss +24 -0
  86. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_progress-bar.scss +10 -0
  87. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_reset-filter.scss +8 -0
  88. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_resize.scss +6 -0
  89. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_responsive-visibility.scss +21 -0
  90. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_size.scss +10 -0
  91. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_tab-focus.scss +9 -0
  92. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_table-row.scss +28 -0
  93. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_text-emphasis.scss +11 -0
  94. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_text-overflow.scss +8 -0
  95. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_vendor-prefixes.scss +222 -0
  96. data/lib/flipper/ui/assets/stylesheets/primer/.scss-lint.yml +446 -0
  97. data/lib/flipper/ui/assets/stylesheets/primer/_alerts.scss +106 -0
  98. data/lib/flipper/ui/assets/stylesheets/primer/_avatars.scss +36 -0
  99. data/lib/flipper/ui/assets/stylesheets/primer/_base.scss +40 -0
  100. data/lib/flipper/ui/assets/stylesheets/primer/_blankslate.scss +96 -0
  101. data/lib/flipper/ui/assets/stylesheets/primer/_buttons.scss +404 -0
  102. data/lib/flipper/ui/assets/stylesheets/primer/_counter.scss +10 -0
  103. data/lib/flipper/ui/assets/stylesheets/primer/_filter-list.scss +68 -0
  104. data/lib/flipper/ui/assets/stylesheets/primer/_flex-table.scss +20 -0
  105. data/lib/flipper/ui/assets/stylesheets/primer/_forms.scss +756 -0
  106. data/lib/flipper/ui/assets/stylesheets/primer/_layout.scss +69 -0
  107. data/lib/flipper/ui/assets/stylesheets/primer/_menu.scss +113 -0
  108. data/lib/flipper/ui/assets/stylesheets/primer/_mixins.scss +53 -0
  109. data/lib/flipper/ui/assets/stylesheets/primer/_normalize.scss +425 -0
  110. data/lib/flipper/ui/assets/stylesheets/primer/_states.scss +32 -0
  111. data/lib/flipper/ui/assets/stylesheets/primer/_tabnav.scss +65 -0
  112. data/lib/flipper/ui/assets/stylesheets/primer/_tooltips.scss +255 -0
  113. data/lib/flipper/ui/assets/stylesheets/primer/_truncate.scss +27 -0
  114. data/lib/flipper/ui/assets/stylesheets/primer/_type.scss +92 -0
  115. data/lib/flipper/ui/assets/stylesheets/primer/_utility.scss +73 -0
  116. data/lib/flipper/ui/assets/stylesheets/primer/_variables.scss +34 -0
  117. data/lib/flipper/ui/assets/stylesheets/primer/primer.scss +39 -0
  118. data/lib/flipper/ui/decorators/feature.rb +37 -4
  119. data/lib/flipper/ui/middleware.rb +12 -3
  120. data/lib/flipper/ui/public/css/application.css +2563 -144
  121. data/lib/flipper/ui/public/css/primer.css +1 -0
  122. data/lib/flipper/ui/public/css/primer/primer.css +1933 -0
  123. data/lib/flipper/ui/public/css/scss/primer.css +1933 -0
  124. data/lib/flipper/ui/public/fonts/bootstrap/glyphicons-halflings-regular.eot +0 -0
  125. data/lib/flipper/ui/public/fonts/bootstrap/glyphicons-halflings-regular.svg +288 -0
  126. data/lib/flipper/ui/public/fonts/bootstrap/glyphicons-halflings-regular.ttf +0 -0
  127. data/lib/flipper/ui/public/fonts/bootstrap/glyphicons-halflings-regular.woff +0 -0
  128. data/lib/flipper/ui/public/fonts/bootstrap/glyphicons-halflings-regular.woff2 +0 -0
  129. data/lib/flipper/ui/public/js/application.js +0 -539
  130. data/lib/flipper/ui/public/js/bootstrap-sprockets.js +12 -0
  131. data/lib/flipper/ui/public/js/bootstrap.js +2317 -0
  132. data/lib/flipper/ui/public/js/bootstrap.min.js +7 -0
  133. data/lib/flipper/ui/public/js/bootstrap/affix.js +162 -0
  134. data/lib/flipper/ui/public/js/bootstrap/alert.js +94 -0
  135. data/lib/flipper/ui/public/js/bootstrap/button.js +116 -0
  136. data/lib/flipper/ui/public/js/bootstrap/carousel.js +237 -0
  137. data/lib/flipper/ui/public/js/bootstrap/collapse.js +211 -0
  138. data/lib/flipper/ui/public/js/bootstrap/dropdown.js +161 -0
  139. data/lib/flipper/ui/public/js/bootstrap/modal.js +339 -0
  140. data/lib/flipper/ui/public/js/bootstrap/popover.js +108 -0
  141. data/lib/flipper/ui/public/js/bootstrap/scrollspy.js +172 -0
  142. data/lib/flipper/ui/public/js/bootstrap/tab.js +153 -0
  143. data/lib/flipper/ui/public/js/bootstrap/tooltip.js +476 -0
  144. data/lib/flipper/ui/public/js/bootstrap/transition.js +59 -0
  145. data/lib/flipper/ui/public/octicons/LICENSE.txt +9 -0
  146. data/lib/flipper/ui/public/octicons/README.md +1 -0
  147. data/lib/flipper/ui/public/octicons/octicons-local.ttf +0 -0
  148. data/lib/flipper/ui/public/octicons/octicons.css +236 -0
  149. data/lib/flipper/ui/public/octicons/octicons.eot +0 -0
  150. data/lib/flipper/ui/public/octicons/octicons.less +235 -0
  151. data/lib/flipper/ui/public/octicons/octicons.svg +200 -0
  152. data/lib/flipper/ui/public/octicons/octicons.ttf +0 -0
  153. data/lib/flipper/ui/public/octicons/octicons.woff +0 -0
  154. data/lib/flipper/ui/public/octicons/sprockets-octicons.scss +232 -0
  155. data/lib/flipper/ui/util.rb +4 -0
  156. data/lib/flipper/ui/version.rb +1 -1
  157. data/lib/flipper/ui/views/add_actor.erb +22 -0
  158. data/lib/flipper/ui/views/add_feature.erb +18 -0
  159. data/lib/flipper/ui/views/add_group.erb +31 -0
  160. data/lib/flipper/ui/views/feature.erb +209 -0
  161. data/lib/flipper/ui/views/features.erb +46 -0
  162. data/lib/flipper/ui/views/layout.erb +31 -149
  163. data/script/release +15 -0
  164. data/spec/flipper/ui/actions/actors_gate_spec.rb +68 -0
  165. data/spec/flipper/ui/actions/add_feature_spec.rb +17 -0
  166. data/spec/flipper/ui/actions/boolean_gate_spec.rb +41 -0
  167. data/spec/flipper/ui/actions/feature_spec.rb +59 -0
  168. data/spec/flipper/ui/actions/features_spec.rb +37 -0
  169. data/spec/flipper/ui/actions/file_spec.rb +43 -0
  170. data/spec/flipper/ui/actions/gate_spec.rb +24 -0
  171. data/spec/flipper/ui/actions/groups_gate_spec.rb +80 -0
  172. data/spec/flipper/ui/actions/home_spec.rb +16 -0
  173. data/spec/flipper/ui/actions/percentage_of_actors_gate_spec.rb +40 -0
  174. data/spec/flipper/ui/actions/percentage_of_time_gate_spec.rb +39 -0
  175. data/spec/flipper/ui/decorators/feature_spec.rb +38 -1
  176. data/spec/flipper/ui/decorators/gate_spec.rb +1 -1
  177. data/spec/flipper/ui_spec.rb +18 -441
  178. data/spec/helper.rb +22 -7
  179. metadata +199 -52
  180. data/examples/flipper.html +0 -14
  181. data/examples/flipper.png +0 -0
  182. data/lib/flipper/ui/assets/javascripts/spine/ajax.coffee +0 -223
  183. data/lib/flipper/ui/assets/javascripts/spine/list.coffee +0 -43
  184. data/lib/flipper/ui/assets/javascripts/spine/local.coffee +0 -16
  185. data/lib/flipper/ui/assets/javascripts/spine/manager.coffee +0 -83
  186. data/lib/flipper/ui/assets/javascripts/spine/relation.coffee +0 -148
  187. data/lib/flipper/ui/assets/javascripts/spine/route.coffee +0 -146
  188. data/lib/flipper/ui/assets/javascripts/spine/spine.coffee +0 -542
  189. data/lib/flipper/ui/assets/javascripts/spine/version +0 -1
  190. data/lib/flipper/ui/public/css/images/animated-overlay.gif +0 -0
  191. data/lib/flipper/ui/public/css/images/ui-bg_diagonals-thick_18_b81900_40x40.png +0 -0
  192. data/lib/flipper/ui/public/css/images/ui-bg_diagonals-thick_20_666666_40x40.png +0 -0
  193. data/lib/flipper/ui/public/css/images/ui-bg_flat_10_000000_40x100.png +0 -0
  194. data/lib/flipper/ui/public/css/images/ui-bg_glass_100_f6f6f6_1x400.png +0 -0
  195. data/lib/flipper/ui/public/css/images/ui-bg_glass_100_fdf5ce_1x400.png +0 -0
  196. data/lib/flipper/ui/public/css/images/ui-bg_glass_65_ffffff_1x400.png +0 -0
  197. data/lib/flipper/ui/public/css/images/ui-bg_gloss-wave_35_f6a828_500x100.png +0 -0
  198. data/lib/flipper/ui/public/css/images/ui-bg_highlight-soft_100_eeeeee_1x100.png +0 -0
  199. data/lib/flipper/ui/public/css/images/ui-bg_highlight-soft_75_ffe45c_1x100.png +0 -0
  200. data/lib/flipper/ui/public/css/images/ui-icons_222222_256x240.png +0 -0
  201. data/lib/flipper/ui/public/css/images/ui-icons_228ef1_256x240.png +0 -0
  202. data/lib/flipper/ui/public/css/images/ui-icons_ef8c08_256x240.png +0 -0
  203. data/lib/flipper/ui/public/css/images/ui-icons_ffd27a_256x240.png +0 -0
  204. data/lib/flipper/ui/public/css/images/ui-icons_ffffff_256x240.png +0 -0
  205. data/lib/flipper/ui/public/css/jquery-ui-1.10.3.slider.min.css +0 -5
  206. data/lib/flipper/ui/public/js/handlebars.js +0 -1992
  207. data/lib/flipper/ui/public/js/jquery-ui-1.10.3.slider.min.js +0 -6
  208. data/lib/flipper/ui/public/js/jquery.js +0 -9555
  209. data/lib/flipper/ui/public/js/jquery.min.js +0 -4
  210. data/lib/flipper/ui/public/js/jquery.min.map +0 -1
  211. data/lib/flipper/ui/public/js/spine/ajax.js +0 -320
  212. data/lib/flipper/ui/public/js/spine/list.js +0 -72
  213. data/lib/flipper/ui/public/js/spine/local.js +0 -29
  214. data/lib/flipper/ui/public/js/spine/manager.js +0 -157
  215. data/lib/flipper/ui/public/js/spine/relation.js +0 -260
  216. data/lib/flipper/ui/public/js/spine/route.js +0 -223
  217. data/lib/flipper/ui/public/js/spine/spine.js +0 -927
  218. data/lib/flipper/ui/views/index.erb +0 -9
@@ -0,0 +1,36 @@
1
+ //
2
+ // Close icons
3
+ // --------------------------------------------------
4
+
5
+
6
+ .close {
7
+ float: right;
8
+ font-size: ($font-size-base * 1.5);
9
+ font-weight: $close-font-weight;
10
+ line-height: 1;
11
+ color: $close-color;
12
+ text-shadow: $close-text-shadow;
13
+ @include opacity(.2);
14
+
15
+ &:hover,
16
+ &:focus {
17
+ color: $close-color;
18
+ text-decoration: none;
19
+ cursor: pointer;
20
+ @include opacity(.5);
21
+ }
22
+
23
+ // [converter] extracted button& to button.close
24
+ }
25
+
26
+ // Additional properties for button version
27
+ // iOS requires the button element instead of an anchor tag.
28
+ // If you want the anchor version, it requires `href="#"`.
29
+ // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
30
+ button.close {
31
+ padding: 0;
32
+ cursor: pointer;
33
+ background: transparent;
34
+ border: 0;
35
+ -webkit-appearance: none;
36
+ }
@@ -0,0 +1,69 @@
1
+ //
2
+ // Code (inline and block)
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Inline and block code styles
7
+ code,
8
+ kbd,
9
+ pre,
10
+ samp {
11
+ font-family: $font-family-monospace;
12
+ }
13
+
14
+ // Inline code
15
+ code {
16
+ padding: 2px 4px;
17
+ font-size: 90%;
18
+ color: $code-color;
19
+ background-color: $code-bg;
20
+ border-radius: $border-radius-base;
21
+ }
22
+
23
+ // User input typically entered via keyboard
24
+ kbd {
25
+ padding: 2px 4px;
26
+ font-size: 90%;
27
+ color: $kbd-color;
28
+ background-color: $kbd-bg;
29
+ border-radius: $border-radius-small;
30
+ box-shadow: inset 0 -1px 0 rgba(0,0,0,.25);
31
+
32
+ kbd {
33
+ padding: 0;
34
+ font-size: 100%;
35
+ font-weight: bold;
36
+ box-shadow: none;
37
+ }
38
+ }
39
+
40
+ // Blocks of code
41
+ pre {
42
+ display: block;
43
+ padding: (($line-height-computed - 1) / 2);
44
+ margin: 0 0 ($line-height-computed / 2);
45
+ font-size: ($font-size-base - 1); // 14px to 13px
46
+ line-height: $line-height-base;
47
+ word-break: break-all;
48
+ word-wrap: break-word;
49
+ color: $pre-color;
50
+ background-color: $pre-bg;
51
+ border: 1px solid $pre-border-color;
52
+ border-radius: $border-radius-base;
53
+
54
+ // Account for some code outputs that place code tags in pre tags
55
+ code {
56
+ padding: 0;
57
+ font-size: inherit;
58
+ color: inherit;
59
+ white-space: pre-wrap;
60
+ background-color: transparent;
61
+ border-radius: 0;
62
+ }
63
+ }
64
+
65
+ // Enable scrollable blocks of code
66
+ .pre-scrollable {
67
+ max-height: $pre-scrollable-max-height;
68
+ overflow-y: scroll;
69
+ }
@@ -0,0 +1,37 @@
1
+ //
2
+ // Component animations
3
+ // --------------------------------------------------
4
+
5
+ // Heads up!
6
+ //
7
+ // We don't use the `.opacity()` mixin here since it causes a bug with text
8
+ // fields in IE7-8. Source: https://github.com/twbs/bootstrap/pull/3552.
9
+
10
+ .fade {
11
+ opacity: 0;
12
+ @include transition(opacity .15s linear);
13
+ &.in {
14
+ opacity: 1;
15
+ }
16
+ }
17
+
18
+ .collapse {
19
+ display: none;
20
+
21
+ &.in { display: block; }
22
+ // [converter] extracted tr&.in to tr.collapse.in
23
+ // [converter] extracted tbody&.in to tbody.collapse.in
24
+ }
25
+
26
+ tr.collapse.in { display: table-row; }
27
+
28
+ tbody.collapse.in { display: table-row-group; }
29
+
30
+ .collapsing {
31
+ position: relative;
32
+ height: 0;
33
+ overflow: hidden;
34
+ @include transition-property(height, visibility);
35
+ @include transition-duration(.35s);
36
+ @include transition-timing-function(ease);
37
+ }
@@ -0,0 +1,214 @@
1
+ //
2
+ // Dropdown menus
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Dropdown arrow/caret
7
+ .caret {
8
+ display: inline-block;
9
+ width: 0;
10
+ height: 0;
11
+ margin-left: 2px;
12
+ vertical-align: middle;
13
+ border-top: $caret-width-base dashed;
14
+ border-right: $caret-width-base solid transparent;
15
+ border-left: $caret-width-base solid transparent;
16
+ }
17
+
18
+ // The dropdown wrapper (div)
19
+ .dropup,
20
+ .dropdown {
21
+ position: relative;
22
+ }
23
+
24
+ // Prevent the focus on the dropdown toggle when closing dropdowns
25
+ .dropdown-toggle:focus {
26
+ outline: 0;
27
+ }
28
+
29
+ // The dropdown menu (ul)
30
+ .dropdown-menu {
31
+ position: absolute;
32
+ top: 100%;
33
+ left: 0;
34
+ z-index: $zindex-dropdown;
35
+ display: none; // none by default, but block on "open" of the menu
36
+ float: left;
37
+ min-width: 160px;
38
+ padding: 5px 0;
39
+ margin: 2px 0 0; // override default ul
40
+ list-style: none;
41
+ font-size: $font-size-base;
42
+ text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
43
+ background-color: $dropdown-bg;
44
+ border: 1px solid $dropdown-fallback-border; // IE8 fallback
45
+ border: 1px solid $dropdown-border;
46
+ border-radius: $border-radius-base;
47
+ @include box-shadow(0 6px 12px rgba(0,0,0,.175));
48
+ background-clip: padding-box;
49
+
50
+ // Aligns the dropdown menu to right
51
+ //
52
+ // Deprecated as of 3.1.0 in favor of `.dropdown-menu-[dir]`
53
+ &.pull-right {
54
+ right: 0;
55
+ left: auto;
56
+ }
57
+
58
+ // Dividers (basically an hr) within the dropdown
59
+ .divider {
60
+ @include nav-divider($dropdown-divider-bg);
61
+ }
62
+
63
+ // Links within the dropdown menu
64
+ > li > a {
65
+ display: block;
66
+ padding: 3px 20px;
67
+ clear: both;
68
+ font-weight: normal;
69
+ line-height: $line-height-base;
70
+ color: $dropdown-link-color;
71
+ white-space: nowrap; // prevent links from randomly breaking onto new lines
72
+ }
73
+ }
74
+
75
+ // Hover/Focus state
76
+ .dropdown-menu > li > a {
77
+ &:hover,
78
+ &:focus {
79
+ text-decoration: none;
80
+ color: $dropdown-link-hover-color;
81
+ background-color: $dropdown-link-hover-bg;
82
+ }
83
+ }
84
+
85
+ // Active state
86
+ .dropdown-menu > .active > a {
87
+ &,
88
+ &:hover,
89
+ &:focus {
90
+ color: $dropdown-link-active-color;
91
+ text-decoration: none;
92
+ outline: 0;
93
+ background-color: $dropdown-link-active-bg;
94
+ }
95
+ }
96
+
97
+ // Disabled state
98
+ //
99
+ // Gray out text and ensure the hover/focus state remains gray
100
+
101
+ .dropdown-menu > .disabled > a {
102
+ &,
103
+ &:hover,
104
+ &:focus {
105
+ color: $dropdown-link-disabled-color;
106
+ }
107
+
108
+ // Nuke hover/focus effects
109
+ &:hover,
110
+ &:focus {
111
+ text-decoration: none;
112
+ background-color: transparent;
113
+ background-image: none; // Remove CSS gradient
114
+ @include reset-filter;
115
+ cursor: $cursor-disabled;
116
+ }
117
+ }
118
+
119
+ // Open state for the dropdown
120
+ .open {
121
+ // Show the menu
122
+ > .dropdown-menu {
123
+ display: block;
124
+ }
125
+
126
+ // Remove the outline when :focus is triggered
127
+ > a {
128
+ outline: 0;
129
+ }
130
+ }
131
+
132
+ // Menu positioning
133
+ //
134
+ // Add extra class to `.dropdown-menu` to flip the alignment of the dropdown
135
+ // menu with the parent.
136
+ .dropdown-menu-right {
137
+ left: auto; // Reset the default from `.dropdown-menu`
138
+ right: 0;
139
+ }
140
+ // With v3, we enabled auto-flipping if you have a dropdown within a right
141
+ // aligned nav component. To enable the undoing of that, we provide an override
142
+ // to restore the default dropdown menu alignment.
143
+ //
144
+ // This is only for left-aligning a dropdown menu within a `.navbar-right` or
145
+ // `.pull-right` nav component.
146
+ .dropdown-menu-left {
147
+ left: 0;
148
+ right: auto;
149
+ }
150
+
151
+ // Dropdown section headers
152
+ .dropdown-header {
153
+ display: block;
154
+ padding: 3px 20px;
155
+ font-size: $font-size-small;
156
+ line-height: $line-height-base;
157
+ color: $dropdown-header-color;
158
+ white-space: nowrap; // as with > li > a
159
+ }
160
+
161
+ // Backdrop to catch body clicks on mobile, etc.
162
+ .dropdown-backdrop {
163
+ position: fixed;
164
+ left: 0;
165
+ right: 0;
166
+ bottom: 0;
167
+ top: 0;
168
+ z-index: ($zindex-dropdown - 10);
169
+ }
170
+
171
+ // Right aligned dropdowns
172
+ .pull-right > .dropdown-menu {
173
+ right: 0;
174
+ left: auto;
175
+ }
176
+
177
+ // Allow for dropdowns to go bottom up (aka, dropup-menu)
178
+ //
179
+ // Just add .dropup after the standard .dropdown class and you're set, bro.
180
+ // TODO: abstract this so that the navbar fixed styles are not placed here?
181
+
182
+ .dropup,
183
+ .navbar-fixed-bottom .dropdown {
184
+ // Reverse the caret
185
+ .caret {
186
+ border-top: 0;
187
+ border-bottom: $caret-width-base solid;
188
+ content: "";
189
+ }
190
+ // Different positioning for bottom up menu
191
+ .dropdown-menu {
192
+ top: auto;
193
+ bottom: 100%;
194
+ margin-bottom: 2px;
195
+ }
196
+ }
197
+
198
+
199
+ // Component alignment
200
+ //
201
+ // Reiterate per navbar.less and the modified component alignment there.
202
+
203
+ @media (min-width: $grid-float-breakpoint) {
204
+ .navbar-right {
205
+ .dropdown-menu {
206
+ right: 0; left: auto;
207
+ }
208
+ // Necessary for overrides of the default right aligned menu.
209
+ // Will remove come v4 in all likelihood.
210
+ .dropdown-menu-left {
211
+ left: 0; right: auto;
212
+ }
213
+ }
214
+ }
@@ -0,0 +1,578 @@
1
+ //
2
+ // Forms
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Normalize non-controls
7
+ //
8
+ // Restyle and baseline non-control form elements.
9
+
10
+ fieldset {
11
+ padding: 0;
12
+ margin: 0;
13
+ border: 0;
14
+ // Chrome and Firefox set a `min-width: min-content;` on fieldsets,
15
+ // so we reset that to ensure it behaves more like a standard block element.
16
+ // See https://github.com/twbs/bootstrap/issues/12359.
17
+ min-width: 0;
18
+ }
19
+
20
+ legend {
21
+ display: block;
22
+ width: 100%;
23
+ padding: 0;
24
+ margin-bottom: $line-height-computed;
25
+ font-size: ($font-size-base * 1.5);
26
+ line-height: inherit;
27
+ color: $legend-color;
28
+ border: 0;
29
+ border-bottom: 1px solid $legend-border-color;
30
+ }
31
+
32
+ label {
33
+ display: inline-block;
34
+ max-width: 100%; // Force IE8 to wrap long content (see https://github.com/twbs/bootstrap/issues/13141)
35
+ margin-bottom: 5px;
36
+ font-weight: bold;
37
+ }
38
+
39
+
40
+ // Normalize form controls
41
+ //
42
+ // While most of our form styles require extra classes, some basic normalization
43
+ // is required to ensure optimum display with or without those classes to better
44
+ // address browser inconsistencies.
45
+
46
+ // Override content-box in Normalize (* isn't specific enough)
47
+ input[type="search"] {
48
+ @include box-sizing(border-box);
49
+ }
50
+
51
+ // Position radios and checkboxes better
52
+ input[type="radio"],
53
+ input[type="checkbox"] {
54
+ margin: 4px 0 0;
55
+ margin-top: 1px \9; // IE8-9
56
+ line-height: normal;
57
+ }
58
+
59
+ // Set the height of file controls to match text inputs
60
+ input[type="file"] {
61
+ display: block;
62
+ }
63
+
64
+ // Make range inputs behave like textual form controls
65
+ input[type="range"] {
66
+ display: block;
67
+ width: 100%;
68
+ }
69
+
70
+ // Make multiple select elements height not fixed
71
+ select[multiple],
72
+ select[size] {
73
+ height: auto;
74
+ }
75
+
76
+ // Focus for file, radio, and checkbox
77
+ input[type="file"]:focus,
78
+ input[type="radio"]:focus,
79
+ input[type="checkbox"]:focus {
80
+ @include tab-focus;
81
+ }
82
+
83
+ // Adjust output element
84
+ output {
85
+ display: block;
86
+ padding-top: ($padding-base-vertical + 1);
87
+ font-size: $font-size-base;
88
+ line-height: $line-height-base;
89
+ color: $input-color;
90
+ }
91
+
92
+
93
+ // Common form controls
94
+ //
95
+ // Shared size and type resets for form controls. Apply `.form-control` to any
96
+ // of the following form controls:
97
+ //
98
+ // select
99
+ // textarea
100
+ // input[type="text"]
101
+ // input[type="password"]
102
+ // input[type="datetime"]
103
+ // input[type="datetime-local"]
104
+ // input[type="date"]
105
+ // input[type="month"]
106
+ // input[type="time"]
107
+ // input[type="week"]
108
+ // input[type="number"]
109
+ // input[type="email"]
110
+ // input[type="url"]
111
+ // input[type="search"]
112
+ // input[type="tel"]
113
+ // input[type="color"]
114
+
115
+ .form-control {
116
+ display: block;
117
+ width: 100%;
118
+ height: $input-height-base; // Make inputs at least the height of their button counterpart (base line-height + padding + border)
119
+ padding: $padding-base-vertical $padding-base-horizontal;
120
+ font-size: $font-size-base;
121
+ line-height: $line-height-base;
122
+ color: $input-color;
123
+ background-color: $input-bg;
124
+ background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
125
+ border: 1px solid $input-border;
126
+ border-radius: $input-border-radius; // Note: This has no effect on <select>s in some browsers, due to the limited stylability of <select>s in CSS.
127
+ @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
128
+ @include transition(border-color ease-in-out .15s, box-shadow ease-in-out .15s);
129
+
130
+ // Customize the `:focus` state to imitate native WebKit styles.
131
+ @include form-control-focus;
132
+
133
+ // Placeholder
134
+ @include placeholder;
135
+
136
+ // Disabled and read-only inputs
137
+ //
138
+ // HTML5 says that controls under a fieldset > legend:first-child won't be
139
+ // disabled if the fieldset is disabled. Due to implementation difficulty, we
140
+ // don't honor that edge case; we style them as disabled anyway.
141
+ &[disabled],
142
+ &[readonly],
143
+ fieldset[disabled] & {
144
+ background-color: $input-bg-disabled;
145
+ opacity: 1; // iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655
146
+ }
147
+
148
+ &[disabled],
149
+ fieldset[disabled] & {
150
+ cursor: $cursor-disabled;
151
+ }
152
+
153
+ // [converter] extracted textarea& to textarea.form-control
154
+ }
155
+
156
+ // Reset height for `textarea`s
157
+ textarea.form-control {
158
+ height: auto;
159
+ }
160
+
161
+
162
+ // Search inputs in iOS
163
+ //
164
+ // This overrides the extra rounded corners on search inputs in iOS so that our
165
+ // `.form-control` class can properly style them. Note that this cannot simply
166
+ // be added to `.form-control` as it's not specific enough. For details, see
167
+ // https://github.com/twbs/bootstrap/issues/11586.
168
+
169
+ input[type="search"] {
170
+ -webkit-appearance: none;
171
+ }
172
+
173
+
174
+ // Special styles for iOS temporal inputs
175
+ //
176
+ // In Mobile Safari, setting `display: block` on temporal inputs causes the
177
+ // text within the input to become vertically misaligned. As a workaround, we
178
+ // set a pixel line-height that matches the given height of the input, but only
179
+ // for Safari. See https://bugs.webkit.org/show_bug.cgi?id=139848
180
+
181
+ @media screen and (-webkit-min-device-pixel-ratio: 0) {
182
+ input[type="date"],
183
+ input[type="time"],
184
+ input[type="datetime-local"],
185
+ input[type="month"] {
186
+ line-height: $input-height-base;
187
+
188
+ &.input-sm,
189
+ .input-group-sm & {
190
+ line-height: $input-height-small;
191
+ }
192
+
193
+ &.input-lg,
194
+ .input-group-lg & {
195
+ line-height: $input-height-large;
196
+ }
197
+ }
198
+ }
199
+
200
+
201
+ // Form groups
202
+ //
203
+ // Designed to help with the organization and spacing of vertical forms. For
204
+ // horizontal forms, use the predefined grid classes.
205
+
206
+ .form-group {
207
+ margin-bottom: $form-group-margin-bottom;
208
+ }
209
+
210
+
211
+ // Checkboxes and radios
212
+ //
213
+ // Indent the labels to position radios/checkboxes as hanging controls.
214
+
215
+ .radio,
216
+ .checkbox {
217
+ position: relative;
218
+ display: block;
219
+ margin-top: 10px;
220
+ margin-bottom: 10px;
221
+
222
+ label {
223
+ min-height: $line-height-computed; // Ensure the input doesn't jump when there is no text
224
+ padding-left: 20px;
225
+ margin-bottom: 0;
226
+ font-weight: normal;
227
+ cursor: pointer;
228
+ }
229
+ }
230
+ .radio input[type="radio"],
231
+ .radio-inline input[type="radio"],
232
+ .checkbox input[type="checkbox"],
233
+ .checkbox-inline input[type="checkbox"] {
234
+ position: absolute;
235
+ margin-left: -20px;
236
+ margin-top: 4px \9;
237
+ }
238
+
239
+ .radio + .radio,
240
+ .checkbox + .checkbox {
241
+ margin-top: -5px; // Move up sibling radios or checkboxes for tighter spacing
242
+ }
243
+
244
+ // Radios and checkboxes on same line
245
+ .radio-inline,
246
+ .checkbox-inline {
247
+ position: relative;
248
+ display: inline-block;
249
+ padding-left: 20px;
250
+ margin-bottom: 0;
251
+ vertical-align: middle;
252
+ font-weight: normal;
253
+ cursor: pointer;
254
+ }
255
+ .radio-inline + .radio-inline,
256
+ .checkbox-inline + .checkbox-inline {
257
+ margin-top: 0;
258
+ margin-left: 10px; // space out consecutive inline controls
259
+ }
260
+
261
+ // Apply same disabled cursor tweak as for inputs
262
+ // Some special care is needed because <label>s don't inherit their parent's `cursor`.
263
+ //
264
+ // Note: Neither radios nor checkboxes can be readonly.
265
+ input[type="radio"],
266
+ input[type="checkbox"] {
267
+ &[disabled],
268
+ &.disabled,
269
+ fieldset[disabled] & {
270
+ cursor: $cursor-disabled;
271
+ }
272
+ }
273
+ // These classes are used directly on <label>s
274
+ .radio-inline,
275
+ .checkbox-inline {
276
+ &.disabled,
277
+ fieldset[disabled] & {
278
+ cursor: $cursor-disabled;
279
+ }
280
+ }
281
+ // These classes are used on elements with <label> descendants
282
+ .radio,
283
+ .checkbox {
284
+ &.disabled,
285
+ fieldset[disabled] & {
286
+ label {
287
+ cursor: $cursor-disabled;
288
+ }
289
+ }
290
+ }
291
+
292
+
293
+ // Static form control text
294
+ //
295
+ // Apply class to a `p` element to make any string of text align with labels in
296
+ // a horizontal form layout.
297
+
298
+ .form-control-static {
299
+ // Size it appropriately next to real form controls
300
+ padding-top: ($padding-base-vertical + 1);
301
+ padding-bottom: ($padding-base-vertical + 1);
302
+ // Remove default margin from `p`
303
+ margin-bottom: 0;
304
+ min-height: ($line-height-computed + $font-size-base);
305
+
306
+ &.input-lg,
307
+ &.input-sm {
308
+ padding-left: 0;
309
+ padding-right: 0;
310
+ }
311
+ }
312
+
313
+
314
+ // Form control sizing
315
+ //
316
+ // Build on `.form-control` with modifier classes to decrease or increase the
317
+ // height and font-size of form controls.
318
+ //
319
+ // The `.form-group-* form-control` variations are sadly duplicated to avoid the
320
+ // issue documented in https://github.com/twbs/bootstrap/issues/15074.
321
+
322
+ @include input-size('.input-sm', $input-height-small, $padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $input-border-radius-small);
323
+ .form-group-sm {
324
+
325
+ @include input-size('.form-control', $input-height-small, $padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $input-border-radius-small);
326
+
327
+ .form-control-static {
328
+ height: $input-height-small;
329
+ padding: $padding-small-vertical $padding-small-horizontal;
330
+ font-size: $font-size-small;
331
+ line-height: $line-height-small;
332
+ min-height: ($line-height-computed + $font-size-small);
333
+ }
334
+ }
335
+
336
+ @include input-size('.input-lg', $input-height-large, $padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $input-border-radius-large);
337
+ .form-group-lg {
338
+
339
+ @include input-size('.form-control', $input-height-large, $padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $input-border-radius-large);
340
+
341
+ .form-control-static {
342
+ height: $input-height-large;
343
+ padding: $padding-large-vertical $padding-large-horizontal;
344
+ font-size: $font-size-large;
345
+ line-height: $line-height-large;
346
+ min-height: ($line-height-computed + $font-size-large);
347
+ }
348
+ }
349
+
350
+
351
+ // Form control feedback states
352
+ //
353
+ // Apply contextual and semantic states to individual form controls.
354
+
355
+ .has-feedback {
356
+ // Enable absolute positioning
357
+ position: relative;
358
+
359
+ // Ensure icons don't overlap text
360
+ .form-control {
361
+ padding-right: ($input-height-base * 1.25);
362
+ }
363
+ }
364
+ // Feedback icon (requires .glyphicon classes)
365
+ .form-control-feedback {
366
+ position: absolute;
367
+ top: 0;
368
+ right: 0;
369
+ z-index: 2; // Ensure icon is above input groups
370
+ display: block;
371
+ width: $input-height-base;
372
+ height: $input-height-base;
373
+ line-height: $input-height-base;
374
+ text-align: center;
375
+ pointer-events: none;
376
+ }
377
+ .input-lg + .form-control-feedback {
378
+ width: $input-height-large;
379
+ height: $input-height-large;
380
+ line-height: $input-height-large;
381
+ }
382
+ .input-sm + .form-control-feedback {
383
+ width: $input-height-small;
384
+ height: $input-height-small;
385
+ line-height: $input-height-small;
386
+ }
387
+
388
+ // Feedback states
389
+ .has-success {
390
+ @include form-control-validation($state-success-text, $state-success-text, $state-success-bg);
391
+ }
392
+ .has-warning {
393
+ @include form-control-validation($state-warning-text, $state-warning-text, $state-warning-bg);
394
+ }
395
+ .has-error {
396
+ @include form-control-validation($state-danger-text, $state-danger-text, $state-danger-bg);
397
+ }
398
+
399
+ // Reposition feedback icon if input has visible label above
400
+ .has-feedback label {
401
+
402
+ & ~ .form-control-feedback {
403
+ top: ($line-height-computed + 5); // Height of the `label` and its margin
404
+ }
405
+ &.sr-only ~ .form-control-feedback {
406
+ top: 0;
407
+ }
408
+ }
409
+
410
+
411
+ // Help text
412
+ //
413
+ // Apply to any element you wish to create light text for placement immediately
414
+ // below a form control. Use for general help, formatting, or instructional text.
415
+
416
+ .help-block {
417
+ display: block; // account for any element using help-block
418
+ margin-top: 5px;
419
+ margin-bottom: 10px;
420
+ color: lighten($text-color, 25%); // lighten the text some for contrast
421
+ }
422
+
423
+
424
+ // Inline forms
425
+ //
426
+ // Make forms appear inline(-block) by adding the `.form-inline` class. Inline
427
+ // forms begin stacked on extra small (mobile) devices and then go inline when
428
+ // viewports reach <768px.
429
+ //
430
+ // Requires wrapping inputs and labels with `.form-group` for proper display of
431
+ // default HTML form controls and our custom form controls (e.g., input groups).
432
+ //
433
+ // Heads up! This is mixin-ed into `.navbar-form` in navbars.less.
434
+
435
+ // [converter] extracted from `.form-inline` for libsass compatibility
436
+ @mixin form-inline {
437
+
438
+ // Kick in the inline
439
+ @media (min-width: $screen-sm-min) {
440
+ // Inline-block all the things for "inline"
441
+ .form-group {
442
+ display: inline-block;
443
+ margin-bottom: 0;
444
+ vertical-align: middle;
445
+ }
446
+
447
+ // In navbar-form, allow folks to *not* use `.form-group`
448
+ .form-control {
449
+ display: inline-block;
450
+ width: auto; // Prevent labels from stacking above inputs in `.form-group`
451
+ vertical-align: middle;
452
+ }
453
+
454
+ // Make static controls behave like regular ones
455
+ .form-control-static {
456
+ display: inline-block;
457
+ }
458
+
459
+ .input-group {
460
+ display: inline-table;
461
+ vertical-align: middle;
462
+
463
+ .input-group-addon,
464
+ .input-group-btn,
465
+ .form-control {
466
+ width: auto;
467
+ }
468
+ }
469
+
470
+ // Input groups need that 100% width though
471
+ .input-group > .form-control {
472
+ width: 100%;
473
+ }
474
+
475
+ .control-label {
476
+ margin-bottom: 0;
477
+ vertical-align: middle;
478
+ }
479
+
480
+ // Remove default margin on radios/checkboxes that were used for stacking, and
481
+ // then undo the floating of radios and checkboxes to match.
482
+ .radio,
483
+ .checkbox {
484
+ display: inline-block;
485
+ margin-top: 0;
486
+ margin-bottom: 0;
487
+ vertical-align: middle;
488
+
489
+ label {
490
+ padding-left: 0;
491
+ }
492
+ }
493
+ .radio input[type="radio"],
494
+ .checkbox input[type="checkbox"] {
495
+ position: relative;
496
+ margin-left: 0;
497
+ }
498
+
499
+ // Re-override the feedback icon.
500
+ .has-feedback .form-control-feedback {
501
+ top: 0;
502
+ }
503
+ }
504
+ }
505
+ // [converter] extracted as `@mixin form-inline` for libsass compatibility
506
+ .form-inline {
507
+ @include form-inline;
508
+ }
509
+
510
+
511
+
512
+ // Horizontal forms
513
+ //
514
+ // Horizontal forms are built on grid classes and allow you to create forms with
515
+ // labels on the left and inputs on the right.
516
+
517
+ .form-horizontal {
518
+
519
+ // Consistent vertical alignment of radios and checkboxes
520
+ //
521
+ // Labels also get some reset styles, but that is scoped to a media query below.
522
+ .radio,
523
+ .checkbox,
524
+ .radio-inline,
525
+ .checkbox-inline {
526
+ margin-top: 0;
527
+ margin-bottom: 0;
528
+ padding-top: ($padding-base-vertical + 1); // Default padding plus a border
529
+ }
530
+ // Account for padding we're adding to ensure the alignment and of help text
531
+ // and other content below items
532
+ .radio,
533
+ .checkbox {
534
+ min-height: ($line-height-computed + ($padding-base-vertical + 1));
535
+ }
536
+
537
+ // Make form groups behave like rows
538
+ .form-group {
539
+ @include make-row;
540
+ }
541
+
542
+ // Reset spacing and right align labels, but scope to media queries so that
543
+ // labels on narrow viewports stack the same as a default form example.
544
+ @media (min-width: $screen-sm-min) {
545
+ .control-label {
546
+ text-align: right;
547
+ margin-bottom: 0;
548
+ padding-top: ($padding-base-vertical + 1); // Default padding plus a border
549
+ }
550
+ }
551
+
552
+ // Validation states
553
+ //
554
+ // Reposition the icon because it's now within a grid column and columns have
555
+ // `position: relative;` on them. Also accounts for the grid gutter padding.
556
+ .has-feedback .form-control-feedback {
557
+ right: ($grid-gutter-width / 2);
558
+ }
559
+
560
+ // Form group sizes
561
+ //
562
+ // Quick utility class for applying `.input-lg` and `.input-sm` styles to the
563
+ // inputs and labels within a `.form-group`.
564
+ .form-group-lg {
565
+ @media (min-width: $screen-sm-min) {
566
+ .control-label {
567
+ padding-top: (($padding-large-vertical * $line-height-large) + 1);
568
+ }
569
+ }
570
+ }
571
+ .form-group-sm {
572
+ @media (min-width: $screen-sm-min) {
573
+ .control-label {
574
+ padding-top: ($padding-small-vertical + 1);
575
+ }
576
+ }
577
+ }
578
+ }