flipper-ui 0.12.2 → 0.13.0.beta1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (166) hide show
  1. checksums.yaml +4 -4
  2. data/docs/ui/README.md +21 -3
  3. data/docs/ui/images/configured-ui.png +0 -0
  4. data/docs/ui/images/environment-banner.png +0 -0
  5. data/docs/ui/images/feature.png +0 -0
  6. data/docs/ui/images/features.png +0 -0
  7. data/lib/flipper/ui/assets/javascripts/application.coffee +3 -0
  8. data/lib/flipper/ui/assets/stylesheets/.DS_Store +0 -0
  9. data/lib/flipper/ui/assets/stylesheets/application.scss +9 -48
  10. data/lib/flipper/ui/assets/stylesheets/bootstrap/_alert.scss +51 -0
  11. data/lib/flipper/ui/assets/stylesheets/bootstrap/_badge.scss +47 -0
  12. data/lib/flipper/ui/assets/stylesheets/bootstrap/_breadcrumb.scss +38 -0
  13. data/lib/flipper/ui/assets/stylesheets/bootstrap/_button-group.scss +166 -0
  14. data/lib/flipper/ui/assets/stylesheets/bootstrap/_buttons.scss +78 -95
  15. data/lib/flipper/ui/assets/stylesheets/bootstrap/_card.scss +270 -0
  16. data/lib/flipper/ui/assets/stylesheets/bootstrap/_carousel.scss +122 -200
  17. data/lib/flipper/ui/assets/stylesheets/bootstrap/_close.scss +12 -14
  18. data/lib/flipper/ui/assets/stylesheets/bootstrap/_code.scss +15 -28
  19. data/lib/flipper/ui/assets/stylesheets/bootstrap/_custom-forms.scss +297 -0
  20. data/lib/flipper/ui/assets/stylesheets/bootstrap/_dropdown.scss +131 -0
  21. data/lib/flipper/ui/assets/stylesheets/bootstrap/_forms.scss +210 -455
  22. data/lib/flipper/ui/assets/stylesheets/bootstrap/_functions.scss +86 -0
  23. data/lib/flipper/ui/assets/stylesheets/bootstrap/_grid.scss +29 -61
  24. data/lib/flipper/ui/assets/stylesheets/bootstrap/_images.scss +42 -0
  25. data/lib/flipper/ui/assets/stylesheets/bootstrap/_input-group.scss +159 -0
  26. data/lib/flipper/ui/assets/stylesheets/bootstrap/_jumbotron.scss +8 -42
  27. data/lib/flipper/ui/assets/stylesheets/bootstrap/_list-group.scss +64 -73
  28. data/lib/flipper/ui/assets/stylesheets/bootstrap/_media.scss +3 -56
  29. data/lib/flipper/ui/assets/stylesheets/bootstrap/_mixins.scss +21 -18
  30. data/lib/flipper/ui/assets/stylesheets/bootstrap/_modal.scss +168 -0
  31. data/lib/flipper/ui/assets/stylesheets/bootstrap/_nav.scss +118 -0
  32. data/lib/flipper/ui/assets/stylesheets/bootstrap/_navbar.scss +203 -554
  33. data/lib/flipper/ui/assets/stylesheets/bootstrap/_pagination.scss +58 -69
  34. data/lib/flipper/ui/assets/stylesheets/bootstrap/_popover.scss +183 -0
  35. data/lib/flipper/ui/assets/stylesheets/bootstrap/_print.scss +71 -54
  36. data/lib/flipper/ui/assets/stylesheets/bootstrap/_progress.scss +33 -0
  37. data/lib/flipper/ui/assets/stylesheets/bootstrap/_reboot.scss +482 -0
  38. data/lib/flipper/ui/assets/stylesheets/bootstrap/_root.scss +19 -0
  39. data/lib/flipper/ui/assets/stylesheets/bootstrap/_tables.scss +109 -163
  40. data/lib/flipper/ui/assets/stylesheets/bootstrap/_tooltip.scss +97 -84
  41. data/lib/flipper/ui/assets/stylesheets/bootstrap/_transitions.scss +36 -0
  42. data/lib/flipper/ui/assets/stylesheets/bootstrap/_type.scss +66 -239
  43. data/lib/flipper/ui/assets/stylesheets/bootstrap/_utilities.scss +14 -55
  44. data/lib/flipper/ui/assets/stylesheets/bootstrap/_variables.scss +726 -698
  45. data/lib/flipper/ui/assets/stylesheets/bootstrap/bootstrap-grid.scss +32 -0
  46. data/lib/flipper/ui/assets/stylesheets/bootstrap/bootstrap-reboot.scss +12 -0
  47. data/lib/flipper/ui/assets/stylesheets/bootstrap/bootstrap.scss +42 -0
  48. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_alert.scss +13 -0
  49. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_background-variant.scss +14 -4
  50. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_badge.scss +12 -0
  51. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_border-radius.scss +25 -8
  52. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_box-shadow.scss +5 -0
  53. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_breakpoints.scss +123 -0
  54. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_buttons.scss +89 -32
  55. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_caret.scss +65 -0
  56. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_clearfix.scss +3 -18
  57. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_float.scss +11 -0
  58. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_forms.scss +115 -66
  59. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_gradients.scss +14 -27
  60. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_grid-framework.scss +52 -66
  61. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_grid.scss +37 -107
  62. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_hover.scss +39 -0
  63. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_image.scss +18 -15
  64. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_list-group.scss +10 -20
  65. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_lists.scss +7 -0
  66. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_nav-divider.scss +3 -3
  67. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_navbar-align.scss +10 -0
  68. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_pagination.scss +10 -11
  69. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_reset-text.scss +17 -0
  70. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_resize.scss +1 -1
  71. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_screen-reader.scss +35 -0
  72. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_size.scss +1 -5
  73. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_table-row.scss +16 -14
  74. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_text-emphasis.scss +7 -4
  75. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_text-hide.scss +9 -0
  76. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/{_text-overflow.scss → _text-truncate.scss} +2 -2
  77. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_transition.scss +9 -0
  78. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_visibility.scss +7 -0
  79. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_align.scss +8 -0
  80. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_background.scss +19 -0
  81. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_borders.scss +59 -0
  82. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_clearfix.scss +3 -0
  83. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_display.scss +38 -0
  84. data/lib/flipper/ui/assets/stylesheets/bootstrap/{_responsive-embed.scss → utilities/_embed.scss} +26 -9
  85. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_flex.scss +46 -0
  86. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_float.scss +9 -0
  87. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_position.scss +36 -0
  88. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_screenreaders.scss +11 -0
  89. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_sizing.scss +12 -0
  90. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_spacing.scss +51 -0
  91. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_text.scss +52 -0
  92. data/lib/flipper/ui/assets/stylesheets/bootstrap/utilities/_visibility.scss +11 -0
  93. data/lib/flipper/ui/configuration.rb +24 -0
  94. data/lib/flipper/ui/decorators/feature.rb +3 -3
  95. data/lib/flipper/ui/public/css/application.css +6237 -2339
  96. data/lib/flipper/ui/public/js/application.js +3 -2
  97. data/lib/flipper/ui/views/add_actor.erb +7 -9
  98. data/lib/flipper/ui/views/add_feature.erb +8 -10
  99. data/lib/flipper/ui/views/add_group.erb +7 -9
  100. data/lib/flipper/ui/views/feature.erb +181 -141
  101. data/lib/flipper/ui/views/feature_creation_disabled.erb +1 -1
  102. data/lib/flipper/ui/views/feature_removal_disabled.erb +1 -1
  103. data/lib/flipper/ui/views/features.erb +12 -15
  104. data/lib/flipper/ui/views/layout.erb +25 -15
  105. data/lib/flipper/version.rb +1 -1
  106. data/spec/flipper/ui/actions/actors_gate_spec.rb +2 -1
  107. data/spec/flipper/ui/actions/add_feature_spec.rb +2 -1
  108. data/spec/flipper/ui/actions/groups_gate_spec.rb +2 -1
  109. data/spec/flipper/ui/configuration_spec.rb +27 -0
  110. data/spec/flipper/ui_spec.rb +24 -0
  111. metadata +58 -64
  112. data/lib/flipper/ui/assets/stylesheets/_bootstrap-compass.scss +0 -9
  113. data/lib/flipper/ui/assets/stylesheets/_bootstrap-mincer.scss +0 -19
  114. data/lib/flipper/ui/assets/stylesheets/_bootstrap-sprockets.scss +0 -9
  115. data/lib/flipper/ui/assets/stylesheets/_bootstrap.scss +0 -50
  116. data/lib/flipper/ui/assets/stylesheets/bootstrap/_alerts.scss +0 -73
  117. data/lib/flipper/ui/assets/stylesheets/bootstrap/_badges.scss +0 -68
  118. data/lib/flipper/ui/assets/stylesheets/bootstrap/_breadcrumbs.scss +0 -26
  119. data/lib/flipper/ui/assets/stylesheets/bootstrap/_button-groups.scss +0 -243
  120. data/lib/flipper/ui/assets/stylesheets/bootstrap/_component-animations.scss +0 -37
  121. data/lib/flipper/ui/assets/stylesheets/bootstrap/_dropdowns.scss +0 -214
  122. data/lib/flipper/ui/assets/stylesheets/bootstrap/_glyphicons.scss +0 -305
  123. data/lib/flipper/ui/assets/stylesheets/bootstrap/_input-groups.scss +0 -166
  124. data/lib/flipper/ui/assets/stylesheets/bootstrap/_labels.scss +0 -66
  125. data/lib/flipper/ui/assets/stylesheets/bootstrap/_modals.scss +0 -150
  126. data/lib/flipper/ui/assets/stylesheets/bootstrap/_navs.scss +0 -242
  127. data/lib/flipper/ui/assets/stylesheets/bootstrap/_normalize.scss +0 -427
  128. data/lib/flipper/ui/assets/stylesheets/bootstrap/_pager.scss +0 -54
  129. data/lib/flipper/ui/assets/stylesheets/bootstrap/_panels.scss +0 -265
  130. data/lib/flipper/ui/assets/stylesheets/bootstrap/_popovers.scss +0 -135
  131. data/lib/flipper/ui/assets/stylesheets/bootstrap/_progress-bars.scss +0 -87
  132. data/lib/flipper/ui/assets/stylesheets/bootstrap/_responsive-utilities.scss +0 -177
  133. data/lib/flipper/ui/assets/stylesheets/bootstrap/_scaffolding.scss +0 -162
  134. data/lib/flipper/ui/assets/stylesheets/bootstrap/_theme.scss +0 -273
  135. data/lib/flipper/ui/assets/stylesheets/bootstrap/_thumbnails.scss +0 -38
  136. data/lib/flipper/ui/assets/stylesheets/bootstrap/_wells.scss +0 -29
  137. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_alerts.scss +0 -14
  138. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_center-block.scss +0 -7
  139. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_hide-text.scss +0 -21
  140. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_labels.scss +0 -12
  141. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_nav-vertical-align.scss +0 -9
  142. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_opacity.scss +0 -8
  143. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_panels.scss +0 -24
  144. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_progress-bar.scss +0 -10
  145. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_reset-filter.scss +0 -8
  146. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_responsive-visibility.scss +0 -21
  147. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_tab-focus.scss +0 -9
  148. data/lib/flipper/ui/assets/stylesheets/bootstrap/mixins/_vendor-prefixes.scss +0 -222
  149. data/lib/flipper/ui/public/css/primer.css +0 -1
  150. data/lib/flipper/ui/public/css/primer/primer.css +0 -1933
  151. data/lib/flipper/ui/public/css/scss/primer.css +0 -1933
  152. data/lib/flipper/ui/public/js/bootstrap-sprockets.js +0 -12
  153. data/lib/flipper/ui/public/js/bootstrap.js +0 -2317
  154. data/lib/flipper/ui/public/js/bootstrap.min.js +0 -7
  155. data/lib/flipper/ui/public/js/bootstrap/affix.js +0 -162
  156. data/lib/flipper/ui/public/js/bootstrap/alert.js +0 -94
  157. data/lib/flipper/ui/public/js/bootstrap/button.js +0 -116
  158. data/lib/flipper/ui/public/js/bootstrap/carousel.js +0 -237
  159. data/lib/flipper/ui/public/js/bootstrap/collapse.js +0 -211
  160. data/lib/flipper/ui/public/js/bootstrap/dropdown.js +0 -161
  161. data/lib/flipper/ui/public/js/bootstrap/modal.js +0 -339
  162. data/lib/flipper/ui/public/js/bootstrap/popover.js +0 -108
  163. data/lib/flipper/ui/public/js/bootstrap/scrollspy.js +0 -172
  164. data/lib/flipper/ui/public/js/bootstrap/tab.js +0 -153
  165. data/lib/flipper/ui/public/js/bootstrap/tooltip.js +0 -476
  166. data/lib/flipper/ui/public/js/bootstrap/transition.js +0 -59
@@ -1,19 +0,0 @@
1
- // Mincer asset helper functions
2
- //
3
- // This must be imported into a .css.ejs.scss file.
4
- // Then, <% %>-interpolations will be parsed as strings by Sass, and evaluated by EJS after Sass compilation.
5
-
6
-
7
- @function twbs-font-path($path) {
8
- // do something like following
9
- // from "path/to/font.ext#suffix" to "<%- asset_path(path/to/font.ext)) + #suffix %>"
10
- // from "path/to/font.ext?#suffix" to "<%- asset_path(path/to/font.ext)) + ?#suffix %>"
11
- // or from "path/to/font.ext" just "<%- asset_path(path/to/font.ext)) %>"
12
- @return "<%- asset_path('#{$path}'.replace(/[#?].*$/, '')) + '#{$path}'.replace(/(^[^#?]*)([#?]?.*$)/, '$2') %>";
13
- }
14
-
15
- @function twbs-image-path($file) {
16
- @return "<%- asset_path('#{$file}') %>";
17
- }
18
-
19
- $bootstrap-sass-asset-helper: true;
@@ -1,9 +0,0 @@
1
- @function twbs-font-path($path) {
2
- @return font-path($path);
3
- }
4
-
5
- @function twbs-image-path($path) {
6
- @return image-path($path);
7
- }
8
-
9
- $bootstrap-sass-asset-helper: true;
@@ -1,50 +0,0 @@
1
- // Core variables and mixins
2
- @import "bootstrap/variables";
3
- @import "bootstrap/mixins";
4
-
5
- // Reset and dependencies
6
- @import "bootstrap/normalize";
7
- @import "bootstrap/print";
8
- @import "bootstrap/glyphicons";
9
-
10
- // Core CSS
11
- @import "bootstrap/scaffolding";
12
- @import "bootstrap/type";
13
- @import "bootstrap/code";
14
- @import "bootstrap/grid";
15
- @import "bootstrap/tables";
16
- @import "bootstrap/forms";
17
- @import "bootstrap/buttons";
18
-
19
- // Components
20
- @import "bootstrap/component-animations";
21
- @import "bootstrap/dropdowns";
22
- @import "bootstrap/button-groups";
23
- @import "bootstrap/input-groups";
24
- @import "bootstrap/navs";
25
- @import "bootstrap/navbar";
26
- @import "bootstrap/breadcrumbs";
27
- @import "bootstrap/pagination";
28
- @import "bootstrap/pager";
29
- @import "bootstrap/labels";
30
- @import "bootstrap/badges";
31
- @import "bootstrap/jumbotron";
32
- @import "bootstrap/thumbnails";
33
- @import "bootstrap/alerts";
34
- @import "bootstrap/progress-bars";
35
- @import "bootstrap/media";
36
- @import "bootstrap/list-group";
37
- @import "bootstrap/panels";
38
- @import "bootstrap/responsive-embed";
39
- @import "bootstrap/wells";
40
- @import "bootstrap/close";
41
-
42
- // Components w/ JavaScript
43
- @import "bootstrap/modals";
44
- @import "bootstrap/tooltip";
45
- @import "bootstrap/popovers";
46
- @import "bootstrap/carousel";
47
-
48
- // Utility classes
49
- @import "bootstrap/utilities";
50
- @import "bootstrap/responsive-utilities";
@@ -1,73 +0,0 @@
1
- //
2
- // Alerts
3
- // --------------------------------------------------
4
-
5
-
6
- // Base styles
7
- // -------------------------
8
-
9
- .alert {
10
- padding: $alert-padding;
11
- margin-bottom: $line-height-computed;
12
- border: 1px solid transparent;
13
- border-radius: $alert-border-radius;
14
-
15
- // Headings for larger alerts
16
- h4 {
17
- margin-top: 0;
18
- // Specified for the h4 to prevent conflicts of changing $headings-color
19
- color: inherit;
20
- }
21
-
22
- // Provide class for links that match alerts
23
- .alert-link {
24
- font-weight: $alert-link-font-weight;
25
- }
26
-
27
- // Improve alignment and spacing of inner content
28
- > p,
29
- > ul {
30
- margin-bottom: 0;
31
- }
32
-
33
- > p + p {
34
- margin-top: 5px;
35
- }
36
- }
37
-
38
- // Dismissible alerts
39
- //
40
- // Expand the right padding and account for the close button's positioning.
41
-
42
- .alert-dismissable, // The misspelled .alert-dismissable was deprecated in 3.2.0.
43
- .alert-dismissible {
44
- padding-right: ($alert-padding + 20);
45
-
46
- // Adjust close link position
47
- .close {
48
- position: relative;
49
- top: -2px;
50
- right: -21px;
51
- color: inherit;
52
- }
53
- }
54
-
55
- // Alternate styles
56
- //
57
- // Generate contextual modifier classes for colorizing the alert.
58
-
59
- .alert-success {
60
- @include alert-variant($alert-success-bg, $alert-success-border, $alert-success-text);
61
- }
62
-
63
- .alert-info {
64
- @include alert-variant($alert-info-bg, $alert-info-border, $alert-info-text);
65
- }
66
-
67
- .alert-warning {
68
- @include alert-variant($alert-warning-bg, $alert-warning-border, $alert-warning-text);
69
- }
70
-
71
- .alert-danger {
72
- @include alert-variant($alert-danger-bg, $alert-danger-border, $alert-danger-text);
73
- }
@@ -1,68 +0,0 @@
1
- //
2
- // Badges
3
- // --------------------------------------------------
4
-
5
-
6
- // Base class
7
- .badge {
8
- display: inline-block;
9
- min-width: 10px;
10
- padding: 3px 7px;
11
- font-size: $font-size-small;
12
- font-weight: $badge-font-weight;
13
- color: $badge-color;
14
- line-height: $badge-line-height;
15
- vertical-align: baseline;
16
- white-space: nowrap;
17
- text-align: center;
18
- background-color: $badge-bg;
19
- border-radius: $badge-border-radius;
20
-
21
- // Empty badges collapse automatically (not available in IE8)
22
- &:empty {
23
- display: none;
24
- }
25
-
26
- // Quick fix for badges in buttons
27
- .btn & {
28
- position: relative;
29
- top: -1px;
30
- }
31
-
32
- .btn-xs &,
33
- .btn-group-xs > .btn & {
34
- top: 0;
35
- padding: 1px 5px;
36
- }
37
-
38
- // [converter] extracted a& to a.badge
39
-
40
- // Account for badges in navs
41
- .list-group-item.active > &,
42
- .nav-pills > .active > a > & {
43
- color: $badge-active-color;
44
- background-color: $badge-active-bg;
45
- }
46
-
47
- .list-group-item > & {
48
- float: right;
49
- }
50
-
51
- .list-group-item > & + & {
52
- margin-right: 5px;
53
- }
54
-
55
- .nav-pills > li > a > & {
56
- margin-left: 3px;
57
- }
58
- }
59
-
60
- // Hover state, but only for links
61
- a.badge {
62
- &:hover,
63
- &:focus {
64
- color: $badge-link-hover-color;
65
- text-decoration: none;
66
- cursor: pointer;
67
- }
68
- }
@@ -1,26 +0,0 @@
1
- //
2
- // Breadcrumbs
3
- // --------------------------------------------------
4
-
5
-
6
- .breadcrumb {
7
- padding: $breadcrumb-padding-vertical $breadcrumb-padding-horizontal;
8
- margin-bottom: $line-height-computed;
9
- list-style: none;
10
- background-color: $breadcrumb-bg;
11
- border-radius: $border-radius-base;
12
-
13
- > li {
14
- display: inline-block;
15
-
16
- + li:before {
17
- content: "#{$breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space
18
- padding: 0 5px;
19
- color: $breadcrumb-color;
20
- }
21
- }
22
-
23
- > .active {
24
- color: $breadcrumb-active-color;
25
- }
26
- }
@@ -1,243 +0,0 @@
1
- //
2
- // Button groups
3
- // --------------------------------------------------
4
-
5
- // Make the div behave like a button
6
- .btn-group,
7
- .btn-group-vertical {
8
- position: relative;
9
- display: inline-block;
10
- vertical-align: middle; // match .btn alignment given font-size hack above
11
- > .btn {
12
- position: relative;
13
- float: left;
14
- // Bring the "active" button to the front
15
- &:hover,
16
- &:focus,
17
- &:active,
18
- &.active {
19
- z-index: 2;
20
- }
21
- }
22
- }
23
-
24
- // Prevent double borders when buttons are next to each other
25
- .btn-group {
26
- .btn + .btn,
27
- .btn + .btn-group,
28
- .btn-group + .btn,
29
- .btn-group + .btn-group {
30
- margin-left: -1px;
31
- }
32
- }
33
-
34
- // Optional: Group multiple button groups together for a toolbar
35
- .btn-toolbar {
36
- margin-left: -5px; // Offset the first child's margin
37
- @include clearfix;
38
-
39
- .btn-group,
40
- .input-group {
41
- float: left;
42
- }
43
- > .btn,
44
- > .btn-group,
45
- > .input-group {
46
- margin-left: 5px;
47
- }
48
- }
49
-
50
- .btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
51
- border-radius: 0;
52
- }
53
-
54
- // Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match
55
- .btn-group > .btn:first-child {
56
- margin-left: 0;
57
- &:not(:last-child):not(.dropdown-toggle) {
58
- @include border-right-radius(0);
59
- }
60
- }
61
- // Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it
62
- .btn-group > .btn:last-child:not(:first-child),
63
- .btn-group > .dropdown-toggle:not(:first-child) {
64
- @include border-left-radius(0);
65
- }
66
-
67
- // Custom edits for including btn-groups within btn-groups (useful for including dropdown buttons within a btn-group)
68
- .btn-group > .btn-group {
69
- float: left;
70
- }
71
- .btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
72
- border-radius: 0;
73
- }
74
- .btn-group > .btn-group:first-child:not(:last-child) {
75
- > .btn:last-child,
76
- > .dropdown-toggle {
77
- @include border-right-radius(0);
78
- }
79
- }
80
- .btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
81
- @include border-left-radius(0);
82
- }
83
-
84
- // On active and open, don't show outline
85
- .btn-group .dropdown-toggle:active,
86
- .btn-group.open .dropdown-toggle {
87
- outline: 0;
88
- }
89
-
90
-
91
- // Sizing
92
- //
93
- // Remix the default button sizing classes into new ones for easier manipulation.
94
-
95
- .btn-group-xs > .btn { @extend .btn-xs; }
96
- .btn-group-sm > .btn { @extend .btn-sm; }
97
- .btn-group-lg > .btn { @extend .btn-lg; }
98
-
99
-
100
- // Split button dropdowns
101
- // ----------------------
102
-
103
- // Give the line between buttons some depth
104
- .btn-group > .btn + .dropdown-toggle {
105
- padding-left: 8px;
106
- padding-right: 8px;
107
- }
108
- .btn-group > .btn-lg + .dropdown-toggle {
109
- padding-left: 12px;
110
- padding-right: 12px;
111
- }
112
-
113
- // The clickable button for toggling the menu
114
- // Remove the gradient and set the same inset shadow as the :active state
115
- .btn-group.open .dropdown-toggle {
116
- @include box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
117
-
118
- // Show no shadow for `.btn-link` since it has no other button styles.
119
- &.btn-link {
120
- @include box-shadow(none);
121
- }
122
- }
123
-
124
-
125
- // Reposition the caret
126
- .btn .caret {
127
- margin-left: 0;
128
- }
129
- // Carets in other button sizes
130
- .btn-lg .caret {
131
- border-width: $caret-width-large $caret-width-large 0;
132
- border-bottom-width: 0;
133
- }
134
- // Upside down carets for .dropup
135
- .dropup .btn-lg .caret {
136
- border-width: 0 $caret-width-large $caret-width-large;
137
- }
138
-
139
-
140
- // Vertical button groups
141
- // ----------------------
142
-
143
- .btn-group-vertical {
144
- > .btn,
145
- > .btn-group,
146
- > .btn-group > .btn {
147
- display: block;
148
- float: none;
149
- width: 100%;
150
- max-width: 100%;
151
- }
152
-
153
- // Clear floats so dropdown menus can be properly placed
154
- > .btn-group {
155
- @include clearfix;
156
- > .btn {
157
- float: none;
158
- }
159
- }
160
-
161
- > .btn + .btn,
162
- > .btn + .btn-group,
163
- > .btn-group + .btn,
164
- > .btn-group + .btn-group {
165
- margin-top: -1px;
166
- margin-left: 0;
167
- }
168
- }
169
-
170
- .btn-group-vertical > .btn {
171
- &:not(:first-child):not(:last-child) {
172
- border-radius: 0;
173
- }
174
- &:first-child:not(:last-child) {
175
- border-top-right-radius: $border-radius-base;
176
- @include border-bottom-radius(0);
177
- }
178
- &:last-child:not(:first-child) {
179
- border-bottom-left-radius: $border-radius-base;
180
- @include border-top-radius(0);
181
- }
182
- }
183
- .btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
184
- border-radius: 0;
185
- }
186
- .btn-group-vertical > .btn-group:first-child:not(:last-child) {
187
- > .btn:last-child,
188
- > .dropdown-toggle {
189
- @include border-bottom-radius(0);
190
- }
191
- }
192
- .btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
193
- @include border-top-radius(0);
194
- }
195
-
196
-
197
- // Justified button groups
198
- // ----------------------
199
-
200
- .btn-group-justified {
201
- display: table;
202
- width: 100%;
203
- table-layout: fixed;
204
- border-collapse: separate;
205
- > .btn,
206
- > .btn-group {
207
- float: none;
208
- display: table-cell;
209
- width: 1%;
210
- }
211
- > .btn-group .btn {
212
- width: 100%;
213
- }
214
-
215
- > .btn-group .dropdown-menu {
216
- left: auto;
217
- }
218
- }
219
-
220
-
221
- // Checkbox and radio options
222
- //
223
- // In order to support the browser's form validation feedback, powered by the
224
- // `required` attribute, we have to "hide" the inputs via `clip`. We cannot use
225
- // `display: none;` or `visibility: hidden;` as that also hides the popover.
226
- // Simply visually hiding the inputs via `opacity` would leave them clickable in
227
- // certain cases which is prevented by using `clip` and `pointer-events`.
228
- // This way, we ensure a DOM element is visible to position the popover from.
229
- //
230
- // See https://github.com/twbs/bootstrap/pull/12794 and
231
- // https://github.com/twbs/bootstrap/pull/14559 for more information.
232
-
233
- [data-toggle="buttons"] {
234
- > .btn,
235
- > .btn-group > .btn {
236
- input[type="radio"],
237
- input[type="checkbox"] {
238
- position: absolute;
239
- clip: rect(0,0,0,0);
240
- pointer-events: none;
241
- }
242
- }
243
- }