twitter-bootstrap-rails 2.0 → 2.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Potentially problematic release.


This version of twitter-bootstrap-rails might be problematic. Click here for more details.

Files changed (69) hide show
  1. data/README.md +27 -27
  2. data/Rakefile +1 -1
  3. data/lib/generators/bootstrap/install/install_generator.rb +1 -1
  4. data/lib/generators/bootstrap/install/templates/bootstrap.coffee +5 -15
  5. data/lib/generators/bootstrap/install/templates/bootstrap.less +4 -3
  6. data/lib/generators/bootstrap/layout/layout_generator.rb +14 -4
  7. data/lib/generators/bootstrap/layout/templates/layout.html.erb +112 -49
  8. data/lib/generators/bootstrap/layout/templates/layout.html.haml +90 -0
  9. data/lib/generators/bootstrap/layout/templates/layout.html.slim +77 -0
  10. data/lib/generators/bootstrap/themed/templates/_form.html.erb +1 -1
  11. data/lib/generators/bootstrap/themed/templates/_form.html.haml +11 -0
  12. data/lib/generators/bootstrap/themed/templates/_form.html.slim +11 -0
  13. data/lib/generators/bootstrap/themed/templates/edit.html.haml +3 -0
  14. data/lib/generators/bootstrap/themed/templates/edit.html.slim +3 -0
  15. data/lib/generators/bootstrap/themed/templates/index.html.erb +2 -2
  16. data/lib/generators/bootstrap/themed/templates/index.html.haml +25 -0
  17. data/lib/generators/bootstrap/themed/templates/index.html.slim +25 -0
  18. data/lib/generators/bootstrap/themed/templates/new.html.haml +2 -0
  19. data/lib/generators/bootstrap/themed/templates/new.html.slim +2 -0
  20. data/lib/generators/bootstrap/themed/templates/show.html.erb +5 -4
  21. data/lib/generators/bootstrap/themed/templates/show.html.haml +9 -0
  22. data/lib/generators/bootstrap/themed/templates/show.html.slim +9 -0
  23. data/lib/generators/bootstrap/themed/themed_generator.rb +13 -13
  24. data/lib/twitter/bootstrap/rails/version.rb +1 -1
  25. data/vendor/assets/images/twitter/bootstrap/glyphicons-halflings-white.png +0 -0
  26. data/vendor/assets/images/twitter/bootstrap/glyphicons-halflings.png +0 -0
  27. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-alert.js +9 -3
  28. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-button.js +1 -1
  29. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-carousel.js +3 -3
  30. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-collapse.js +6 -4
  31. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-dropdown.js +15 -6
  32. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-modal.js +7 -3
  33. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-popover.js +3 -3
  34. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-scrollspy.js +3 -2
  35. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-tab.js +10 -5
  36. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-transition.js +1 -1
  37. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-typeahead.js +39 -20
  38. data/vendor/toolkit/twitter/bootstrap/accordion.less +5 -4
  39. data/vendor/toolkit/twitter/bootstrap/alerts.less +1 -0
  40. data/vendor/toolkit/twitter/bootstrap/bootstrap.less +10 -8
  41. data/vendor/toolkit/twitter/bootstrap/button-groups.less +48 -18
  42. data/vendor/toolkit/twitter/bootstrap/buttons.less +137 -88
  43. data/vendor/toolkit/twitter/bootstrap/carousel.less +12 -5
  44. data/vendor/toolkit/twitter/bootstrap/code.less +44 -0
  45. data/vendor/toolkit/twitter/bootstrap/dropdowns.less +23 -2
  46. data/vendor/toolkit/twitter/bootstrap/forms.less +83 -64
  47. data/vendor/toolkit/twitter/bootstrap/grid.less +8 -0
  48. data/vendor/toolkit/twitter/bootstrap/hero-unit.less +20 -0
  49. data/vendor/toolkit/twitter/bootstrap/labels.less +4 -4
  50. data/vendor/toolkit/twitter/bootstrap/layouts.less +17 -0
  51. data/vendor/toolkit/twitter/bootstrap/mixins.less +202 -38
  52. data/vendor/toolkit/twitter/bootstrap/modals.less +9 -2
  53. data/vendor/toolkit/twitter/bootstrap/navbar.less +70 -29
  54. data/vendor/toolkit/twitter/bootstrap/navs.less +70 -64
  55. data/vendor/toolkit/twitter/bootstrap/pager.less +7 -2
  56. data/vendor/toolkit/twitter/bootstrap/pagination.less +1 -0
  57. data/vendor/toolkit/twitter/bootstrap/popovers.less +25 -25
  58. data/vendor/toolkit/twitter/bootstrap/progress-bars.less +14 -18
  59. data/vendor/toolkit/twitter/bootstrap/reset.less +2 -3
  60. data/vendor/toolkit/twitter/bootstrap/responsive.less +219 -164
  61. data/vendor/toolkit/twitter/bootstrap/scaffolding.less +6 -89
  62. data/vendor/toolkit/twitter/bootstrap/sprites.less +137 -99
  63. data/vendor/toolkit/twitter/bootstrap/tables.less +1 -54
  64. data/vendor/toolkit/twitter/bootstrap/thumbnails.less +2 -0
  65. data/vendor/toolkit/twitter/bootstrap/type.less +12 -42
  66. data/vendor/toolkit/twitter/bootstrap/variables.less +23 -14
  67. metadata +34 -18
  68. data/vendor/toolkit/twitter/bootstrap/patterns.less +0 -30
  69. data/vendor/toolkit/twitter/bootstrap/print.less +0 -18
@@ -38,8 +38,8 @@
38
38
  , title = this.getTitle()
39
39
  , content = this.getContent()
40
40
 
41
- $tip.find('.title')[ $.type(title) == 'object' ? 'append' : 'html' ](title)
42
- $tip.find('.content > *')[ $.type(content) == 'object' ? 'append' : 'html' ](content)
41
+ $tip.find('.popover-title')[ $.type(title) == 'object' ? 'append' : 'html' ](title)
42
+ $tip.find('.popover-content > *')[ $.type(content) == 'object' ? 'append' : 'html' ](content)
43
43
 
44
44
  $tip.removeClass('fade top bottom left right in')
45
45
  }
@@ -89,7 +89,7 @@
89
89
  $.fn.popover.defaults = $.extend({} , $.fn.tooltip.defaults, {
90
90
  placement: 'right'
91
91
  , content: ''
92
- , template: '<div class="popover"><div class="arrow"></div><div class="inner"><h3 class="title"></h3><div class="content"><p></p></div></div></div>'
92
+ , template: '<div class="popover"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>'
93
93
  })
94
94
 
95
95
  }( window.jQuery )
@@ -27,10 +27,11 @@
27
27
  function ScrollSpy( element, options) {
28
28
  var process = $.proxy(this.process, this)
29
29
  , $element = $(element).is('body') ? $(window) : $(element)
30
+ , href
30
31
  this.options = $.extend({}, $.fn.scrollspy.defaults, options)
31
32
  this.$scrollElement = $element.on('scroll.scroll.data-api', process)
32
33
  this.selector = (this.options.target
33
- || $(element).attr('href')
34
+ || ((href = $(element).attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
34
35
  || '') + ' .nav li > a'
35
36
  this.$body = $('body').on('click.scroll.data-api', this.selector, process)
36
37
  this.refresh()
@@ -121,4 +122,4 @@
121
122
  })
122
123
  })
123
124
 
124
- }( window.jQuery )
125
+ }( window.jQuery )
@@ -36,9 +36,14 @@
36
36
  , show: function () {
37
37
  var $this = this.element
38
38
  , $ul = $this.closest('ul:not(.dropdown-menu)')
39
- , href = $this.attr('data-target') || $this.attr('href')
39
+ , selector = $this.attr('data-target')
40
40
  , previous
41
- , $href
41
+ , $target
42
+
43
+ if (!selector) {
44
+ selector = $this.attr('href')
45
+ selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7
46
+ }
42
47
 
43
48
  if ( $this.parent('li').hasClass('active') ) return
44
49
 
@@ -49,10 +54,10 @@
49
54
  , relatedTarget: previous
50
55
  })
51
56
 
52
- $href = $(href)
57
+ $target = $(selector)
53
58
 
54
59
  this.activate($this.parent('li'), $ul)
55
- this.activate($href, $href.parent(), function () {
60
+ this.activate($target, $target.parent(), function () {
56
61
  $this.trigger({
57
62
  type: 'shown'
58
63
  , relatedTarget: previous
@@ -122,4 +127,4 @@
122
127
  })
123
128
  })
124
129
 
125
- }( window.jQuery )
130
+ }( window.jQuery )
@@ -48,4 +48,4 @@
48
48
 
49
49
  })
50
50
 
51
- }( window.jQuery )
51
+ }( window.jQuery )
@@ -24,8 +24,11 @@
24
24
  var Typeahead = function ( element, options ) {
25
25
  this.$element = $(element)
26
26
  this.options = $.extend({}, $.fn.typeahead.defaults, options)
27
+ this.matcher = this.options.matcher || this.matcher
28
+ this.sorter = this.options.sorter || this.sorter
29
+ this.highlighter = this.options.highlighter || this.highlighter
27
30
  this.$menu = $(this.options.menu).appendTo('body')
28
- this.data = this.options.data
31
+ this.source = this.options.source
29
32
  this.shown = false
30
33
  this.listen()
31
34
  }
@@ -34,11 +37,6 @@
34
37
 
35
38
  constructor: Typeahead
36
39
 
37
- , matcher: function (item, query) {
38
- // ;_; http://jsperf.com/asdfdfasdfa
39
- return ~item.toLowerCase().indexOf(query)
40
- }
41
-
42
40
  , select: function () {
43
41
  var val = this.$menu.find('.active').attr('data-value')
44
42
  this.$element.val(val)
@@ -77,12 +75,12 @@
77
75
  return this.shown ? this.hide() : this
78
76
  }
79
77
 
80
- q = this.query.toLowerCase()
81
-
82
- items = this.data.filter(function (item) {
83
- if (that.matcher(item, q)) return item
78
+ items = $.grep(this.source, function (item) {
79
+ if (that.matcher(item)) return item
84
80
  })
85
81
 
82
+ items = this.sorter(items)
83
+
86
84
  if (!items.length) {
87
85
  return this.shown ? this.hide() : this
88
86
  }
@@ -90,17 +88,37 @@
90
88
  return this.render(items.slice(0, this.options.items)).show()
91
89
  }
92
90
 
91
+ , matcher: function (item) {
92
+ return ~item.toLowerCase().indexOf(this.query.toLowerCase())
93
+ }
94
+
95
+ , sorter: function (items) {
96
+ var beginswith = []
97
+ , caseSensitive = []
98
+ , caseInsensitive = []
99
+ , item
100
+
101
+ while (item = items.shift()) {
102
+ if (!item.toLowerCase().indexOf(this.query.toLowerCase())) beginswith.push(item)
103
+ else if (~item.indexOf(this.query)) caseSensitive.push(item)
104
+ else caseInsensitive.push(item)
105
+ }
106
+
107
+ return beginswith.concat(caseSensitive, caseInsensitive)
108
+ }
109
+
110
+ , highlighter: function (item) {
111
+ return item.replace(new RegExp('(' + this.query + ')', 'ig'), function ($1, match) {
112
+ return '<strong>' + match + '</strong>'
113
+ })
114
+ }
115
+
93
116
  , render: function (items) {
94
117
  var that = this
95
- , QUERY = new RegExp('(' + this.query + ')', 'ig')
96
118
 
97
119
  items = $(items).map(function (i, item) {
98
120
  i = $(that.options.item).attr('data-value', item)
99
-
100
- i.find('a').html(item.replace(QUERY, function ($1, match) {
101
- return '<strong>' + match + '</strong>'
102
- }))
103
-
121
+ i.find('a').html(that.highlighter(item))
104
122
  return i[0]
105
123
  })
106
124
 
@@ -157,6 +175,7 @@
157
175
 
158
176
  case 9: // tab
159
177
  case 13: // enter
178
+ if (!this.shown) return
160
179
  this.select()
161
180
  break
162
181
 
@@ -172,6 +191,7 @@
172
191
 
173
192
  , keypress: function (e) {
174
193
  e.stopPropagation()
194
+ if (!this.shown) return
175
195
 
176
196
  switch(e.keyCode) {
177
197
  case 9: // tab
@@ -181,13 +201,11 @@
181
201
  break
182
202
 
183
203
  case 38: // up arrow
184
- if (!this.shown) return
185
204
  e.preventDefault()
186
205
  this.prev()
187
206
  break
188
207
 
189
208
  case 40: // down arrow
190
- if (!this.shown) return
191
209
  e.preventDefault()
192
210
  this.next()
193
211
  break
@@ -229,7 +247,8 @@
229
247
  }
230
248
 
231
249
  $.fn.typeahead.defaults = {
232
- items: 8
250
+ source: []
251
+ , items: 8
233
252
  , menu: '<ul class="typeahead dropdown-menu"></ul>'
234
253
  , item: '<li><a href="#"></a></li>'
235
254
  }
@@ -249,4 +268,4 @@
249
268
  })
250
269
  })
251
270
 
252
- }( window.jQuery )
271
+ }( window.jQuery )
@@ -9,15 +9,16 @@
9
9
 
10
10
  // Group == heading + body
11
11
  .accordion-group {
12
- background-color: #f5f5f5;
12
+ margin-bottom: 2px;
13
+ border: 1px solid #e5e5e5;
13
14
  .border-radius(4px);
14
15
  }
15
16
  .accordion-heading {
16
- padding: 8px 15px;
17
17
  border-bottom: 0;
18
18
  }
19
- .accordion-body {
20
- margin-bottom: 2px;
19
+ .accordion-heading .accordion-toggle {
20
+ display: block;
21
+ padding: 8px 15px;
21
22
  }
22
23
 
23
24
  // Inner needs the styles because you can't animate properly with any styles on the element
@@ -18,6 +18,7 @@
18
18
  // Adjust close link position
19
19
  .alert .close {
20
20
  position: relative;
21
+ top: -2px;
21
22
  right: -21px;
22
23
  line-height: 18px;
23
24
  }
@@ -1,12 +1,11 @@
1
1
  /*!
2
- * Bootstrap @VERSION
2
+ * Bootstrap v2.0.0
3
3
  *
4
4
  * Copyright 2012 Twitter, Inc
5
5
  * Licensed under the Apache License v2.0
6
6
  * http://www.apache.org/licenses/LICENSE-2.0
7
7
  *
8
8
  * Designed and built with all the love in the world @twitter by @mdo and @fat.
9
- * Date: @DATE
10
9
  */
11
10
 
12
11
  // CSS Reset
@@ -18,9 +17,12 @@
18
17
 
19
18
  // Grid system and page structure
20
19
  @import "scaffolding.less";
20
+ @import "grid.less";
21
+ @import "layouts.less";
21
22
 
22
23
  // Base CSS
23
24
  @import "type.less";
25
+ @import "code.less";
24
26
  @import "forms.less";
25
27
  @import "tables.less";
26
28
 
@@ -31,6 +33,11 @@
31
33
  @import "component-animations.less";
32
34
  @import "close.less";
33
35
 
36
+ // Components: Buttons & Alerts
37
+ @import "buttons.less";
38
+ @import "button-groups.less";
39
+ @import "alerts.less"; // Note: alerts share common CSS with buttons and thus have styles in buttons.less
40
+
34
41
  // Components: Nav
35
42
  @import "navs.less";
36
43
  @import "navbar.less";
@@ -43,18 +50,13 @@
43
50
  @import "tooltip.less";
44
51
  @import "popovers.less";
45
52
 
46
- // Components: Buttons & Alerts
47
- @import "buttons.less";
48
- @import "button-groups.less";
49
- @import "alerts.less"; // Note: alerts share common CSS with buttons and thus have styles in buttons.less
50
-
51
53
  // Components: Misc
52
54
  @import "thumbnails.less";
53
55
  @import "labels.less";
54
56
  @import "progress-bars.less";
55
57
  @import "accordion.less";
56
58
  @import "carousel.less";
57
- @import "responsive.less";
59
+ @import "hero-unit.less";
58
60
 
59
61
  // Utility classes
60
62
  @import "utilities.less"; // Has to be last to override when necessary
@@ -6,6 +6,7 @@
6
6
  .btn-group {
7
7
  position: relative;
8
8
  .clearfix(); // clears the floated buttons
9
+ .ie7-restore-left-whitespace();
9
10
  }
10
11
 
11
12
  // Space out series of button groups
@@ -15,8 +16,11 @@
15
16
 
16
17
  // Optional: Group multiple button groups together for a toolbar
17
18
  .btn-toolbar {
19
+ margin-top: @baseLineHeight / 2;
20
+ margin-bottom: @baseLineHeight / 2;
18
21
  .btn-group {
19
22
  display: inline-block;
23
+ .ie7-inline-block();
20
24
  }
21
25
  }
22
26
 
@@ -25,7 +29,7 @@
25
29
  position: relative;
26
30
  float: left;
27
31
  margin-left: -1px;
28
- .border-radius(0);
32
+ .border-radius(0px);
29
33
  }
30
34
  // 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
31
35
  .btn-group .btn:first-child {
@@ -69,10 +73,18 @@
69
73
  // On hover/focus/active, bring the proper btn to front
70
74
  .btn-group .btn:hover,
71
75
  .btn-group .btn:focus,
72
- .btn-group .btn:active {
76
+ .btn-group .btn:active,
77
+ .btn-group .btn.active {
73
78
  z-index: 2;
74
79
  }
75
80
 
81
+ // On active and open, don't show outline
82
+ .btn-group .dropdown-toggle:active,
83
+ .btn-group.open .dropdown-toggle {
84
+ outline: 0;
85
+ }
86
+
87
+
76
88
 
77
89
  // Split button dropdowns
78
90
  // ----------------------
@@ -81,36 +93,54 @@
81
93
  .btn-group .dropdown-toggle {
82
94
  padding-left: 8px;
83
95
  padding-right: 8px;
84
- @shadow: inset 1px 0 0 rgba(255,255,255,.125), 0 1px 2px rgba(0,0,0,.05);
96
+ @shadow: inset 1px 0 0 rgba(255,255,255,.125), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
85
97
  .box-shadow(@shadow);
98
+ *padding-top: 5px;
99
+ *padding-bottom: 5px;
86
100
  }
87
101
 
88
- // Reposition menu on open and round all corners
89
- .btn-group.open .dropdown-menu {
90
- display: block;
91
- margin-top: 1px;
92
- .border-radius(5px);
93
- }
94
- .btn-group.open .dropdown-toggle {
95
- background-image: none;
96
- @shadow: inset 0 1px 6px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
97
- .box-shadow(@shadow);
102
+ .btn-group.open {
103
+ // IE7's z-index only goes to the nearest positioned ancestor, which would
104
+ // make the menu appear below buttons that appeared later on the page
105
+ *z-index: @zindexDropdown;
106
+
107
+ // Reposition menu on open and round all corners
108
+ .dropdown-menu {
109
+ display: block;
110
+ margin-top: 1px;
111
+ .border-radius(5px);
112
+ }
113
+
114
+ .dropdown-toggle {
115
+ background-image: none;
116
+ @shadow: inset 0 1px 6px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
117
+ .box-shadow(@shadow);
118
+ }
98
119
  }
99
120
 
100
121
  // Reposition the caret
101
122
  .btn .caret {
102
- margin-top: 6px;
123
+ margin-top: 7px;
103
124
  margin-left: 0;
104
125
  }
126
+ .btn:hover .caret,
127
+ .open.btn-group .caret {
128
+ .opacity(100);
129
+ }
130
+
105
131
 
106
132
  // Account for other colors
107
- .primary,
108
- .danger,
109
- .info,
110
- .success {
133
+ .btn-primary,
134
+ .btn-danger,
135
+ .btn-info,
136
+ .btn-success {
111
137
  .caret {
112
138
  border-top-color: @white;
113
139
  .opacity(75);
114
140
  }
115
141
  }
116
142
 
143
+ // Small button dropdowns
144
+ .btn-small .caret {
145
+ margin-top: 4px;
146
+ }
@@ -1,40 +1,18 @@
1
1
  // BUTTON STYLES
2
2
  // -------------
3
3
 
4
- // Shared colors for buttons and alerts
5
- .btn {
6
- // Set text color
7
- &.danger,
8
- &.danger:hover,
9
- &.success,
10
- &.success:hover,
11
- &.info,
12
- &.info:hover {
13
- text-shadow: 0 -1px 0 rgba(0,0,0,.25);
14
- color: @white
15
- }
16
- // Danger and error appear as red
17
- &.danger {
18
- .gradientBar(#ee5f5b, #c43c35);
19
- }
20
- // Success appears as green
21
- &.success {
22
- .gradientBar(#62c462, #57a957);
23
- }
24
- // Info appears as a neutral blue
25
- &.info {
26
- .gradientBar(#5bc0de, #339bb9);
27
- }
28
- }
29
4
 
30
- // Base .btn styles
5
+ // Base styles
6
+ // --------------------------------------------------
7
+
8
+ // Core
31
9
  .btn {
32
- // Button Base
33
10
  display: inline-block;
34
- padding: 5px 10px 6px;
11
+ padding: 4px 10px 4px;
35
12
  font-size: @baseFontSize;
36
- line-height: normal;
13
+ line-height: @baseLineHeight;
37
14
  color: @grayDark;
15
+ text-align: center;
38
16
  text-shadow: 0 1px 1px rgba(255,255,255,.75);
39
17
  #gradient > .vertical-three-colors(@white, @white, 25%, darken(@white, 10%)); // Don't use .gradientbar() here since it does a three-color gradient
40
18
  border: 1px solid #ccc;
@@ -44,73 +22,144 @@
44
22
  .box-shadow(@shadow);
45
23
  cursor: pointer;
46
24
 
47
- &:hover {
48
- color: @grayDark;
49
- text-decoration: none;
50
- background-position: 0 -15px;
51
- }
25
+ // Give IE7 some love
26
+ .ie7-restore-left-whitespace();
27
+ }
52
28
 
53
- // Focus state for keyboard and accessibility
54
- &:focus {
55
- outline: 1px dotted #666;
56
- }
29
+ // Hover state
30
+ .btn:hover {
31
+ color: @grayDark;
32
+ text-decoration: none;
33
+ background-color: darken(@white, 10%);
34
+ background-position: 0 -15px;
57
35
 
58
- // Primary Button Type
59
- &.primary {
60
- color: @white;
61
- text-shadow: 0 -1px 0 rgba(0,0,0,.25);
62
- .gradientBar(@blue, @blueDark)
63
- }
36
+ // transition is only when going to hover, otherwise the background
37
+ // behind the gradient (there for IE<=9 fallback) gets mismatched
38
+ .transition(background-position .1s linear);
39
+ }
64
40
 
65
- // Transitions
66
- .transition(.1s linear all);
41
+ // Focus state for keyboard and accessibility
42
+ .btn:focus {
43
+ .tab-focus();
44
+ }
67
45
 
68
- // Active and Disabled states
69
- &.active,
70
- &:active {
71
- background-image: none;
72
- @shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
73
- .box-shadow(@shadow);
74
- }
75
- &.disabled {
76
- cursor: default;
77
- background-image: none;
78
- .reset-filter();
79
- .opacity(65);
80
- .box-shadow(none);
81
- }
82
- &[disabled] {
83
- // disabled pseudo can't be included with .disabled
84
- // def because IE8 and below will drop it ;_;
85
- cursor: default;
86
- background-image: none;
87
- .reset-filter();
88
- .opacity(65);
89
- .box-shadow(none);
90
- }
46
+ // Active state
47
+ .btn.active,
48
+ .btn:active {
49
+ background-image: none;
50
+ @shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
51
+ .box-shadow(@shadow);
52
+ background-color: darken(@white, 10%);
53
+ background-color: darken(@white, 15%) e("\9");
54
+ color: rgba(0,0,0,.5);
55
+ outline: 0;
56
+ }
91
57
 
92
- // Button Sizes
93
- &.large {
94
- padding: 9px 14px 9px;
95
- font-size: @baseFontSize + 2px;
96
- line-height: normal;
97
- .border-radius(5px);
98
- }
99
- &.small {
100
- padding: 7px 9px 7px;
101
- font-size: @baseFontSize - 2px;
102
- }
58
+ // Disabled state
59
+ .btn.disabled,
60
+ .btn[disabled] {
61
+ cursor: default;
62
+ background-image: none;
63
+ background-color: darken(@white, 10%);
64
+ .opacity(65);
65
+ .box-shadow(none);
103
66
  }
104
- // Super jank hack for removing border-radius from IE9 so we can keep filter gradients on alerts and buttons
105
- :root .btn {
106
- border-radius: 0 \0;
67
+
68
+
69
+ // Button Sizes
70
+ // --------------------------------------------------
71
+
72
+ // Large
73
+ .btn-large {
74
+ padding: 9px 14px;
75
+ font-size: @baseFontSize + 2px;
76
+ line-height: normal;
77
+ .border-radius(5px);
107
78
  }
79
+ .btn-large .icon {
80
+ margin-top: 1px;
81
+ }
82
+
83
+ // Small
84
+ .btn-small {
85
+ padding: 5px 9px;
86
+ font-size: @baseFontSize - 2px;
87
+ line-height: @baseLineHeight - 2px;
88
+ }
89
+ .btn-small .icon {
90
+ margin-top: -1px;
91
+ }
92
+
93
+
94
+ // Alternate buttons
95
+ // --------------------------------------------------
96
+
97
+ // Set text color
98
+ // -------------------------
99
+ .btn-primary,
100
+ .btn-primary:hover,
101
+ .btn-warning,
102
+ .btn-warning:hover,
103
+ .btn-danger,
104
+ .btn-danger:hover,
105
+ .btn-success,
106
+ .btn-success:hover,
107
+ .btn-info,
108
+ .btn-info:hover {
109
+ text-shadow: 0 -1px 0 rgba(0,0,0,.25);
110
+ color: @white;
111
+ }
112
+ // Provide *some* extra contrast for those who can get it
113
+ .btn-primary.active,
114
+ .btn-warning.active,
115
+ .btn-danger.active,
116
+ .btn-success.active,
117
+ .btn-info.active {
118
+ color: rgba(255,255,255,.75);
119
+ }
120
+
121
+ // Set the backgrounds
122
+ // -------------------------
123
+ .btn-primary {
124
+ .buttonBackground(@primaryButtonBackground, spin(@primaryButtonBackground, 20));
125
+ }
126
+ // Warning appears are orange
127
+ .btn-warning {
128
+ .buttonBackground(lighten(@orange, 15%), @orange);
129
+ }
130
+ // Danger and error appear as red
131
+ .btn-danger {
132
+ .buttonBackground(#ee5f5b, #bd362f);
133
+ }
134
+ // Success appears as green
135
+ .btn-success {
136
+ .buttonBackground(#62c462, #51a351);
137
+ }
138
+ // Info appears as a neutral blue
139
+ .btn-info {
140
+ .buttonBackground(#5bc0de, #2f96b4);
141
+ }
142
+
143
+
144
+ // Cross-browser Jank
145
+ // --------------------------------------------------
108
146
 
109
- // Help Firefox not be a jerk about adding extra padding to buttons
110
147
  button.btn,
111
- input[type=submit].btn {
148
+ input[type="submit"].btn {
112
149
  &::-moz-focus-inner {
113
- padding: 0;
114
- border: 0;
150
+ padding: 0;
151
+ border: 0;
115
152
  }
116
- }
153
+
154
+ // IE7 has some default padding on button controls
155
+ *padding-top: 2px;
156
+ *padding-bottom: 2px;
157
+ &.large {
158
+ *padding-top: 7px;
159
+ *padding-bottom: 7px;
160
+ }
161
+ &.small {
162
+ *padding-top: 3px;
163
+ *padding-bottom: 3px;
164
+ }
165
+ }