sass-twitter-bootstrap-rails 0.1 → 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (70) hide show
  1. data/README.md +24 -12
  2. data/lib/generators/bootstrap/install/install_generator.rb +26 -0
  3. data/lib/generators/bootstrap/install/templates/application.css.scss +1 -0
  4. data/lib/generators/bootstrap/install/templates/application.js +9 -0
  5. data/lib/sass-twitter-bootstrap/rails/version.rb +2 -3
  6. data/sass-twitter-bootstrap-rails.gemspec +1 -1
  7. data/vendor/assets/javascripts/twitter/bootstrap.js +1 -1
  8. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-alert.js +91 -0
  9. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-button.js +98 -0
  10. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-carousel.js +154 -0
  11. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-collapse.js +136 -0
  12. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-dropdown.js +92 -0
  13. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-modal.js +209 -0
  14. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-popover.js +95 -0
  15. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-scrollspy.js +125 -0
  16. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-tab.js +130 -0
  17. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-tooltip.js +270 -0
  18. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-transition.js +51 -0
  19. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-typeahead.js +271 -0
  20. data/vendor/assets/stylesheets/twitter/bootstrap.scss +49 -16
  21. data/vendor/assets/stylesheets/twitter/bootstrap/accordion.scss +28 -0
  22. data/vendor/assets/stylesheets/twitter/bootstrap/alerts.scss +70 -0
  23. data/vendor/assets/stylesheets/twitter/bootstrap/breadcrumbs.scss +22 -0
  24. data/vendor/assets/stylesheets/twitter/bootstrap/button-groups.scss +146 -0
  25. data/vendor/assets/stylesheets/twitter/bootstrap/buttons.scss +165 -0
  26. data/vendor/assets/stylesheets/twitter/bootstrap/carousel.scss +121 -0
  27. data/vendor/assets/stylesheets/twitter/bootstrap/close.scss +18 -0
  28. data/vendor/assets/stylesheets/twitter/bootstrap/code.scss +43 -0
  29. data/vendor/assets/stylesheets/twitter/bootstrap/component-animations.scss +18 -0
  30. data/vendor/assets/stylesheets/twitter/bootstrap/dropdowns.scss +131 -0
  31. data/vendor/assets/stylesheets/twitter/bootstrap/forms.scss +497 -0
  32. data/vendor/assets/stylesheets/twitter/bootstrap/grid.scss +8 -0
  33. data/vendor/assets/stylesheets/twitter/bootstrap/hero-unit.scss +20 -0
  34. data/vendor/assets/stylesheets/twitter/bootstrap/labels.scss +16 -0
  35. data/vendor/assets/stylesheets/twitter/bootstrap/layout.scss +15 -0
  36. data/vendor/assets/stylesheets/twitter/bootstrap/mixins.scss +461 -0
  37. data/vendor/assets/stylesheets/twitter/bootstrap/modals.scss +73 -0
  38. data/vendor/assets/stylesheets/twitter/bootstrap/navbar.scss +292 -0
  39. data/vendor/assets/stylesheets/twitter/bootstrap/navs.scss +344 -0
  40. data/vendor/assets/stylesheets/twitter/bootstrap/pager.scss +30 -0
  41. data/vendor/assets/stylesheets/twitter/bootstrap/pagination.scss +55 -0
  42. data/vendor/assets/stylesheets/twitter/bootstrap/popovers.scss +49 -0
  43. data/vendor/assets/stylesheets/twitter/bootstrap/progress-bars.scss +95 -0
  44. data/vendor/assets/stylesheets/twitter/{reset.scss → bootstrap/reset.scss} +37 -52
  45. data/vendor/assets/stylesheets/twitter/bootstrap/responsive.scss +323 -0
  46. data/vendor/assets/stylesheets/twitter/bootstrap/scaffolding.scss +27 -0
  47. data/vendor/assets/stylesheets/twitter/bootstrap/sprites.scss +156 -0
  48. data/vendor/assets/stylesheets/twitter/bootstrap/tables.scss +123 -0
  49. data/vendor/assets/stylesheets/twitter/bootstrap/thumbnails.scss +35 -0
  50. data/vendor/assets/stylesheets/twitter/bootstrap/tooltip.scss +35 -0
  51. data/vendor/assets/stylesheets/twitter/bootstrap/type.scss +214 -0
  52. data/vendor/assets/stylesheets/twitter/bootstrap/utilities.scss +23 -0
  53. data/vendor/assets/stylesheets/twitter/bootstrap/variables.scss +75 -0
  54. data/vendor/assets/stylesheets/twitter/bootstrap/wells.scss +17 -0
  55. metadata +56 -23
  56. data/vendor/assets/javascripts/twitter/bootstrap-alerts.js +0 -113
  57. data/vendor/assets/javascripts/twitter/bootstrap-buttons.js +0 -62
  58. data/vendor/assets/javascripts/twitter/bootstrap-dropdown.js +0 -55
  59. data/vendor/assets/javascripts/twitter/bootstrap-modal.js +0 -260
  60. data/vendor/assets/javascripts/twitter/bootstrap-popover.js +0 -86
  61. data/vendor/assets/javascripts/twitter/bootstrap-scrollspy.js +0 -107
  62. data/vendor/assets/javascripts/twitter/bootstrap-tabs.js +0 -80
  63. data/vendor/assets/javascripts/twitter/bootstrap-twipsy.js +0 -310
  64. data/vendor/assets/stylesheets/twitter/forms.scss +0 -478
  65. data/vendor/assets/stylesheets/twitter/mixins.scss +0 -220
  66. data/vendor/assets/stylesheets/twitter/patterns.scss +0 -1060
  67. data/vendor/assets/stylesheets/twitter/scaffolding.scss +0 -108
  68. data/vendor/assets/stylesheets/twitter/tables.scss +0 -224
  69. data/vendor/assets/stylesheets/twitter/type.scss +0 -187
  70. data/vendor/assets/stylesheets/twitter/variables.scss +0 -60
@@ -1,80 +0,0 @@
1
- /* ========================================================
2
- * bootstrap-tabs.js v1.4.0
3
- * http://twitter.github.com/bootstrap/javascript.html#tabs
4
- * ========================================================
5
- * Copyright 2011 Twitter, Inc.
6
- *
7
- * Licensed under the Apache License, Version 2.0 (the "License");
8
- * you may not use this file except in compliance with the License.
9
- * You may obtain a copy of the License at
10
- *
11
- * http://www.apache.org/licenses/LICENSE-2.0
12
- *
13
- * Unless required by applicable law or agreed to in writing, software
14
- * distributed under the License is distributed on an "AS IS" BASIS,
15
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16
- * See the License for the specific language governing permissions and
17
- * limitations under the License.
18
- * ======================================================== */
19
-
20
-
21
- !function( $ ){
22
-
23
- "use strict"
24
-
25
- function activate ( element, container ) {
26
- container
27
- .find('> .active')
28
- .removeClass('active')
29
- .find('> .dropdown-menu > .active')
30
- .removeClass('active')
31
-
32
- element.addClass('active')
33
-
34
- if ( element.parent('.dropdown-menu') ) {
35
- element.closest('li.dropdown').addClass('active')
36
- }
37
- }
38
-
39
- function tab( e ) {
40
- var $this = $(this)
41
- , $ul = $this.closest('ul:not(.dropdown-menu)')
42
- , href = $this.attr('href')
43
- , previous
44
- , $href
45
-
46
- if ( /^#\w+/.test(href) ) {
47
- e.preventDefault()
48
-
49
- if ( $this.parent('li').hasClass('active') ) {
50
- return
51
- }
52
-
53
- previous = $ul.find('.active a').last()[0]
54
- $href = $(href)
55
-
56
- activate($this.parent('li'), $ul)
57
- activate($href, $href.parent())
58
-
59
- $this.trigger({
60
- type: 'change'
61
- , relatedTarget: previous
62
- })
63
- }
64
- }
65
-
66
-
67
- /* TABS/PILLS PLUGIN DEFINITION
68
- * ============================ */
69
-
70
- $.fn.tabs = $.fn.pills = function ( selector ) {
71
- return this.each(function () {
72
- $(this).delegate(selector || '.tabs li > a, .pills > li > a', 'click', tab)
73
- })
74
- }
75
-
76
- $(document).ready(function () {
77
- $('body').tabs('ul[data-tabs] li > a, ul[data-pills] > li > a')
78
- })
79
-
80
- }( window.jQuery || window.ender );
@@ -1,310 +0,0 @@
1
- /* ==========================================================
2
- * bootstrap-twipsy.js v1.4.0
3
- * http://twitter.github.com/bootstrap/javascript.html#twipsy
4
- * Adapted from the original jQuery.tipsy by Jason Frame
5
- * ==========================================================
6
- * Copyright 2011 Twitter, Inc.
7
- *
8
- * Licensed under the Apache License, Version 2.0 (the "License");
9
- * you may not use this file except in compliance with the License.
10
- * You may obtain a copy of the License at
11
- *
12
- * http://www.apache.org/licenses/LICENSE-2.0
13
- *
14
- * Unless required by applicable law or agreed to in writing, software
15
- * distributed under the License is distributed on an "AS IS" BASIS,
16
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
17
- * See the License for the specific language governing permissions and
18
- * limitations under the License.
19
- * ========================================================== */
20
-
21
-
22
- !function( $ ) {
23
-
24
- "use strict"
25
-
26
- /* CSS TRANSITION SUPPORT (https://gist.github.com/373874)
27
- * ======================================================= */
28
-
29
- var transitionEnd
30
-
31
- $(document).ready(function () {
32
-
33
- $.support.transition = (function () {
34
- var thisBody = document.body || document.documentElement
35
- , thisStyle = thisBody.style
36
- , support = thisStyle.transition !== undefined || thisStyle.WebkitTransition !== undefined || thisStyle.MozTransition !== undefined || thisStyle.MsTransition !== undefined || thisStyle.OTransition !== undefined
37
- return support
38
- })()
39
-
40
- // set CSS transition event type
41
- if ( $.support.transition ) {
42
- transitionEnd = "TransitionEnd"
43
- if ( $.browser.webkit ) {
44
- transitionEnd = "webkitTransitionEnd"
45
- } else if ( $.browser.mozilla ) {
46
- transitionEnd = "transitionend"
47
- } else if ( $.browser.opera ) {
48
- transitionEnd = "oTransitionEnd"
49
- }
50
- }
51
-
52
- })
53
-
54
-
55
- /* TWIPSY PUBLIC CLASS DEFINITION
56
- * ============================== */
57
-
58
- var Twipsy = function ( element, options ) {
59
- this.$element = $(element)
60
- this.options = options
61
- this.enabled = true
62
- this.fixTitle()
63
- }
64
-
65
- Twipsy.prototype = {
66
-
67
- show: function() {
68
- var pos
69
- , actualWidth
70
- , actualHeight
71
- , placement
72
- , $tip
73
- , tp
74
-
75
- if (this.hasContent() && this.enabled) {
76
- $tip = this.tip()
77
- this.setContent()
78
-
79
- if (this.options.animate) {
80
- $tip.addClass('fade')
81
- }
82
-
83
- $tip
84
- .remove()
85
- .css({ top: 0, left: 0, display: 'block' })
86
- .prependTo(document.body)
87
-
88
- pos = $.extend({}, this.$element.offset(), {
89
- width: this.$element[0].offsetWidth
90
- , height: this.$element[0].offsetHeight
91
- })
92
-
93
- actualWidth = $tip[0].offsetWidth
94
- actualHeight = $tip[0].offsetHeight
95
-
96
- placement = maybeCall(this.options.placement, this, [ $tip[0], this.$element[0] ])
97
-
98
- switch (placement) {
99
- case 'below':
100
- tp = {top: pos.top + pos.height + this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2}
101
- break
102
- case 'above':
103
- tp = {top: pos.top - actualHeight - this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2}
104
- break
105
- case 'left':
106
- tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth - this.options.offset}
107
- break
108
- case 'right':
109
- tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width + this.options.offset}
110
- break
111
- }
112
-
113
- $tip
114
- .css(tp)
115
- .addClass(placement)
116
- .addClass('in')
117
- }
118
- }
119
-
120
- , setContent: function () {
121
- var $tip = this.tip()
122
- $tip.find('.twipsy-inner')[this.options.html ? 'html' : 'text'](this.getTitle())
123
- $tip[0].className = 'twipsy'
124
- }
125
-
126
- , hide: function() {
127
- var that = this
128
- , $tip = this.tip()
129
-
130
- $tip.removeClass('in')
131
-
132
- function removeElement () {
133
- $tip.remove()
134
- }
135
-
136
- $.support.transition && this.$tip.hasClass('fade') ?
137
- $tip.bind(transitionEnd, removeElement) :
138
- removeElement()
139
- }
140
-
141
- , fixTitle: function() {
142
- var $e = this.$element
143
- if ($e.attr('title') || typeof($e.attr('data-original-title')) != 'string') {
144
- $e.attr('data-original-title', $e.attr('title') || '').removeAttr('title')
145
- }
146
- }
147
-
148
- , hasContent: function () {
149
- return this.getTitle()
150
- }
151
-
152
- , getTitle: function() {
153
- var title
154
- , $e = this.$element
155
- , o = this.options
156
-
157
- this.fixTitle()
158
-
159
- if (typeof o.title == 'string') {
160
- title = $e.attr(o.title == 'title' ? 'data-original-title' : o.title)
161
- } else if (typeof o.title == 'function') {
162
- title = o.title.call($e[0])
163
- }
164
-
165
- title = ('' + title).replace(/(^\s*|\s*$)/, "")
166
-
167
- return title || o.fallback
168
- }
169
-
170
- , tip: function() {
171
- if (!this.$tip) {
172
- this.$tip = $('<div class="twipsy" />').html(this.options.template)
173
- }
174
- return this.$tip
175
- }
176
-
177
- , validate: function() {
178
- if (!this.$element[0].parentNode) {
179
- this.hide()
180
- this.$element = null
181
- this.options = null
182
- }
183
- }
184
-
185
- , enable: function() {
186
- this.enabled = true
187
- }
188
-
189
- , disable: function() {
190
- this.enabled = false
191
- }
192
-
193
- , toggleEnabled: function() {
194
- this.enabled = !this.enabled
195
- }
196
-
197
- }
198
-
199
-
200
- /* TWIPSY PRIVATE METHODS
201
- * ====================== */
202
-
203
- function maybeCall ( thing, ctx, args ) {
204
- return typeof thing == 'function' ? thing.apply(ctx, args) : thing
205
- }
206
-
207
- /* TWIPSY PLUGIN DEFINITION
208
- * ======================== */
209
-
210
- $.fn.twipsy = function (options) {
211
- $.fn.twipsy.initWith.call(this, options, Twipsy, 'twipsy')
212
- return this
213
- }
214
-
215
- $.fn.twipsy.initWith = function (options, Constructor, name) {
216
- var twipsy
217
- , binder
218
- , eventIn
219
- , eventOut
220
-
221
- if (options === true) {
222
- return this.data(name)
223
- } else if (typeof options == 'string') {
224
- twipsy = this.data(name)
225
- if (twipsy) {
226
- twipsy[options]()
227
- }
228
- return this
229
- }
230
-
231
- options = $.extend({}, $.fn[name].defaults, options)
232
-
233
- function get(ele) {
234
- var twipsy = $.data(ele, name)
235
-
236
- if (!twipsy) {
237
- twipsy = new Constructor(ele, $.fn.twipsy.elementOptions(ele, options))
238
- $.data(ele, name, twipsy)
239
- }
240
-
241
- return twipsy
242
- }
243
-
244
- function enter() {
245
- var twipsy = get(this)
246
- twipsy.hoverState = 'in'
247
-
248
- if (options.delayIn == 0) {
249
- twipsy.show()
250
- } else {
251
- twipsy.fixTitle()
252
- setTimeout(function() {
253
- if (twipsy.hoverState == 'in') {
254
- twipsy.show()
255
- }
256
- }, options.delayIn)
257
- }
258
- }
259
-
260
- function leave() {
261
- var twipsy = get(this)
262
- twipsy.hoverState = 'out'
263
- if (options.delayOut == 0) {
264
- twipsy.hide()
265
- } else {
266
- setTimeout(function() {
267
- if (twipsy.hoverState == 'out') {
268
- twipsy.hide()
269
- }
270
- }, options.delayOut)
271
- }
272
- }
273
-
274
- if (!options.live) {
275
- this.each(function() {
276
- get(this)
277
- })
278
- }
279
-
280
- if (options.trigger != 'manual') {
281
- binder = options.live ? 'live' : 'bind'
282
- eventIn = options.trigger == 'hover' ? 'mouseenter' : 'focus'
283
- eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur'
284
- this[binder](eventIn, enter)[binder](eventOut, leave)
285
- }
286
-
287
- return this
288
- }
289
-
290
- $.fn.twipsy.Twipsy = Twipsy
291
-
292
- $.fn.twipsy.defaults = {
293
- animate: true
294
- , delayIn: 0
295
- , delayOut: 0
296
- , fallback: ''
297
- , placement: 'above'
298
- , html: false
299
- , live: false
300
- , offset: 0
301
- , title: 'title'
302
- , trigger: 'hover'
303
- , template: '<div class="twipsy-arrow"></div><div class="twipsy-inner"></div>'
304
- }
305
-
306
- $.fn.twipsy.elementOptions = function(ele, options) {
307
- return $.extend({}, options, $(ele).data())
308
- }
309
-
310
- }( window.jQuery || window.ender );
@@ -1,478 +0,0 @@
1
- /* Forms.scss
2
- * Base styles for various input types, form layouts, and states
3
- * ------------------------------------------------------------- */
4
-
5
-
6
- // FORM STYLES
7
- // -----------
8
-
9
- form {
10
- margin-bottom: $baseline;
11
- }
12
-
13
- // Groups of fields with labels on top (legends)
14
- fieldset {
15
- margin-bottom: $baseline;
16
- padding-top: $baseline;
17
- legend {
18
- display: block;
19
- padding-left: 150px;
20
- font-size: $basefont * 1.5;
21
- line-height: 1;
22
- color: $grayDark;
23
- *padding: 0 0 5px 145px; /* IE6-7 */
24
- *line-height: 1.5; /* IE6-7 */
25
- }
26
- }
27
-
28
- // Parent element that clears floats and wraps labels and fields together
29
- form .clearfix {
30
- margin-bottom: $baseline;
31
- @include clearfix();
32
- }
33
-
34
- // Set font for forms
35
- label,
36
- input,
37
- select,
38
- textarea {
39
- @include sans-serif-font(normal,13px,normal);
40
- }
41
-
42
- // Float labels left
43
- label {
44
- padding-top: 6px;
45
- font-size: $basefont;
46
- line-height: $baseline;
47
- float: left;
48
- width: 130px;
49
- text-align: right;
50
- color: $grayDark;
51
- }
52
-
53
- // Shift over the inside div to align all label's relevant content
54
- form .input {
55
- margin-left: 150px;
56
- }
57
-
58
- // Checkboxs and radio buttons
59
- input[type=checkbox],
60
- input[type=radio] {
61
- cursor: pointer;
62
- }
63
-
64
- // Inputs, Textareas, Selects
65
- input,
66
- textarea,
67
- select,
68
- .uneditable-input {
69
- display: inline-block;
70
- width: 210px;
71
- height: $baseline;
72
- padding: 4px;
73
- font-size: $basefont;
74
- line-height: $baseline;
75
- color: $gray;
76
- border: 1px solid #ccc;
77
- @include border-radius(3px);
78
- }
79
-
80
- // remove padding from select
81
- select {
82
- padding: initial;
83
- }
84
-
85
- // mini reset for non-html5 file types
86
- input[type=checkbox],
87
- input[type=radio] {
88
- width: auto;
89
- height: auto;
90
- padding: 0;
91
- margin: 3px 0;
92
- *margin-top: 0; /* IE6-7 */
93
- line-height: normal;
94
- border: none;
95
- }
96
-
97
- input[type=file] {
98
- background-color: $white;
99
- padding: initial;
100
- border: initial;
101
- line-height: initial;
102
- @include box-shadow(none);
103
- }
104
-
105
- input[type=button],
106
- input[type=reset],
107
- input[type=submit] {
108
- width: auto;
109
- height: auto;
110
- }
111
-
112
- select,
113
- input[type=file] {
114
- height: $baseline * 1.5; // In IE7, the height of the select element cannot be changed by height, only font-size
115
- *height: auto; // Reset for IE7
116
- line-height: $baseline * 1.5;
117
- *margin-top: 4px; /* For IE7, add top margin to align select with labels */
118
- }
119
-
120
- // Make multiple select elements height not fixed
121
- select[multiple] {
122
- height: inherit;
123
- background-color: $white; // Fixes Chromium bug of unreadable items
124
- }
125
-
126
- textarea {
127
- height: auto;
128
- }
129
-
130
- // For text that needs to appear as an input but should not be an input
131
- .uneditable-input {
132
- background-color: $white;
133
- display: block;
134
- border-color: #eee;
135
- @include box-shadow(inset 0 1px 2px rgba(0,0,0,.025));
136
- cursor: not-allowed;
137
- }
138
-
139
- // Placeholder text gets special styles; can't be bundled together though for some reason
140
- :-moz-placeholder {
141
- color: $grayLight;
142
- }
143
- ::-webkit-input-placeholder {
144
- color: $grayLight;
145
- }
146
-
147
- // Focus states
148
- input,
149
- textarea {
150
- $transition: border linear .2s, box-shadow linear .2s;
151
- @include transition($transition);
152
- @include box-shadow(inset 0 1px 3px rgba(0,0,0,.1));
153
- }
154
- input:focus,
155
- textarea:focus {
156
- outline: 0;
157
- border-color: rgba(82,168,236,.8);
158
- $shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6);
159
- @include box-shadow($shadow);
160
- }
161
- input[type=file]:focus,
162
- input[type=checkbox]:focus,
163
- select:focus {
164
- @include box-shadow(none); // override for file inputs
165
- outline: 1px dotted #666; // Select elements don't get box-shadow styles, so instead we do outline
166
- }
167
-
168
- // FORM FIELD FEEDBACK STATES
169
- // --------------------------
170
-
171
- // Mixin for form field states
172
- @mixin formFieldState($textColor: #555, $borderColor: #ccc, $backgroundColor: #f5f5f5) {
173
- // Set the text color
174
- > label,
175
- .help-block,
176
- .help-inline {
177
- color: $textColor;
178
- }
179
- // Style inputs accordingly
180
- input,
181
- textarea {
182
- color: $textColor;
183
- border-color: $borderColor;
184
- &:focus {
185
- border-color: darken($borderColor, 10%);
186
- @include box-shadow(0 0 6px lighten($borderColor, 20%));
187
- }
188
- }
189
- // Give a small background color for input-prepend/-append
190
- .input-prepend .add-on,
191
- .input-append .add-on {
192
- color: $textColor;
193
- background-color: $backgroundColor;
194
- border-color: $textColor;
195
- }
196
- }
197
- // Error
198
- form .clearfix.error {
199
- @include formFieldState(#b94a48, #ee5f5b, lighten(#ee5f5b, 30%));
200
- }
201
- // Warning
202
- form .clearfix.warning {
203
- @include formFieldState(#c09853, #ccae64, lighten(#CCAE64, 5%));
204
- }
205
- // Success
206
- form .clearfix.success {
207
- @include formFieldState(#468847, #57a957, lighten(#57a957, 30%));
208
- }
209
-
210
-
211
- // Form element sizes
212
- // TODO v2: remove duplication here and just stick to .input-[size] in light of adding .spanN sizes
213
- .input-mini,
214
- input.mini,
215
- textarea.mini,
216
- select.mini {
217
- width: 60px;
218
- }
219
- .input-small,
220
- input.small,
221
- textarea.small,
222
- select.small {
223
- width: 90px;
224
- }
225
- .input-medium,
226
- input.medium,
227
- textarea.medium,
228
- select.medium {
229
- width: 150px;
230
- }
231
- .input-large,
232
- input.large,
233
- textarea.large,
234
- select.large {
235
- width: 210px;
236
- }
237
- .input-xlarge,
238
- input.xlarge,
239
- textarea.xlarge,
240
- select.xlarge {
241
- width: 270px;
242
- }
243
- .input-xxlarge,
244
- input.xxlarge,
245
- textarea.xxlarge,
246
- select.xxlarge {
247
- width: 530px;
248
- }
249
- textarea.xxlarge {
250
- overflow-y: auto;
251
- }
252
-
253
- // Grid style input sizes
254
- // This is a duplication of the main grid .columns() mixin, but subtracts 10px to account for input padding and border
255
- @mixin formColumns($columnSpan: 1 ) {
256
- display: inline-block;
257
- float: none;
258
- width: (($gridColumnWidth) * $columnSpan) + ($gridGutterWidth * ($columnSpan - 1)) - 10;
259
- margin-left: 0;
260
-
261
- }
262
- input,
263
- textarea {
264
- // Default columns
265
- &.span1 { @include formColumns(1); }
266
- &.span2 { @include formColumns(2); }
267
- &.span3 { @include formColumns(3); }
268
- &.span4 { @include formColumns(4); }
269
- &.span5 { @include formColumns(5); }
270
- &.span6 { @include formColumns(6); }
271
- &.span7 { @include formColumns(7); }
272
- &.span8 { @include formColumns(8); }
273
- &.span9 { @include formColumns(9); }
274
- &.span10 { @include formColumns(10); }
275
- &.span11 { @include formColumns(11); }
276
- &.span12 { @include formColumns(12); }
277
- &.span13 { @include formColumns(13); }
278
- &.span14 { @include formColumns(14); }
279
- &.span15 { @include formColumns(15); }
280
- &.span16 { @include formColumns(16); }
281
- }
282
-
283
- // Disabled and read-only inputs
284
- input[disabled],
285
- select[disabled],
286
- textarea[disabled],
287
- input[readonly],
288
- select[readonly],
289
- textarea[readonly] {
290
- background-color: #f5f5f5;
291
- border-color: #ddd;
292
- cursor: not-allowed;
293
- }
294
-
295
- // Actions (the buttons)
296
- .actions {
297
- background: #f5f5f5;
298
- margin-top: $baseline;
299
- margin-bottom: $baseline;
300
- padding: ($baseline - 1) 20px $baseline 150px;
301
- border-top: 1px solid #ddd;
302
- @include border-radius(0 0 3px 3px);
303
- .secondary-action {
304
- float: right;
305
- a {
306
- line-height: 30px;
307
- &:hover {
308
- text-decoration: underline;
309
- }
310
- }
311
- }
312
- }
313
-
314
- // Help Text
315
- .help-inline,
316
- .help-block {
317
- font-size: $basefont;
318
- line-height: $baseline;
319
- color: $grayLight;
320
- }
321
- .help-inline {
322
- padding-left: 5px;
323
- *position: relative; /* IE6-7 */
324
- *top: -5px; /* IE6-7 */
325
- }
326
-
327
- // Big blocks of help text
328
- .help-block {
329
- display: block;
330
- max-width: 600px;
331
- }
332
-
333
- // Inline Fields (input fields that appear as inline objects
334
- .inline-inputs {
335
- color: $gray;
336
- span {
337
- padding: 0 2px 0 1px;
338
- }
339
- }
340
-
341
- // Allow us to put symbols and text within the input field for a cleaner look
342
- .input-prepend,
343
- .input-append {
344
- input {
345
- @include border-radius(0 3px 3px 0);
346
- }
347
- .add-on {
348
- position: relative;
349
- background: #f5f5f5;
350
- border: 1px solid #ccc;
351
- z-index: 2;
352
- float: left;
353
- display: block;
354
- width: auto;
355
- min-width: 16px;
356
- height: 18px;
357
- padding: 4px 4px 4px 5px;
358
- margin-right: -1px;
359
- font-weight: normal;
360
- line-height: 18px;
361
- color: $grayLight;
362
- text-align: center;
363
- text-shadow: 0 1px 0 $white;
364
- @include border-radius(3px 0 0 3px);
365
- }
366
- .active {
367
- background: lighten($green, 30);
368
- border-color: $green;
369
- }
370
- }
371
- .input-prepend {
372
- .add-on {
373
- *margin-top: 1px; /* IE6-7 */
374
- }
375
- }
376
- .input-append {
377
- input {
378
- float: left;
379
- @include border-radius(3px 0 0 3px);
380
- }
381
- .add-on {
382
- @include border-radius(0 3px 3px 0);
383
- margin-right: 0;
384
- margin-left: -1px;
385
- }
386
- }
387
-
388
- // Stacked options for forms (radio buttons or checkboxes)
389
- .inputs-list {
390
- margin: 0 0 5px;
391
- width: 100%;
392
- li {
393
- display: block;
394
- padding: 0;
395
- width: 100%;
396
- }
397
- label {
398
- display: block;
399
- float: none;
400
- width: auto;
401
- padding: 0;
402
- margin-left: 20px;
403
- line-height: $baseline;
404
- text-align: left;
405
- white-space: normal;
406
- strong {
407
- color: $gray;
408
- }
409
- small {
410
- font-size: $basefont - 2;
411
- font-weight: normal;
412
- }
413
- }
414
- .inputs-list {
415
- margin-left: 25px;
416
- margin-bottom: 10px;
417
- padding-top: 0;
418
- }
419
- &:first-child {
420
- padding-top: 6px;
421
- }
422
- li + li {
423
- padding-top: 2px;
424
- }
425
- input[type=radio],
426
- input[type=checkbox] {
427
- margin-bottom: 0;
428
- margin-left: -20px;
429
- float: left;
430
- }
431
- }
432
-
433
- // Stacked forms
434
- .form-stacked {
435
- padding-left: 20px;
436
- fieldset {
437
- padding-top: $baseline / 2;
438
- }
439
- legend {
440
- padding-left: 0;
441
- }
442
- label {
443
- display: block;
444
- float: none;
445
- width: auto;
446
- font-weight: bold;
447
- text-align: left;
448
- line-height: 20px;
449
- padding-top: 0;
450
- }
451
- .clearfix {
452
- margin-bottom: $baseline / 2;
453
- div.input {
454
- margin-left: 0;
455
- }
456
- }
457
- .inputs-list {
458
- margin-bottom: 0;
459
- li {
460
- padding-top: 0;
461
- label {
462
- font-weight: normal;
463
- padding-top: 0;
464
- }
465
- }
466
- }
467
- div.clearfix.error {
468
- padding-top: 10px;
469
- padding-bottom: 10px;
470
- padding-left: 10px;
471
- margin-top: 0;
472
- margin-left: -10px;
473
- }
474
- .actions {
475
- margin-left: -20px;
476
- padding-left: 20px;
477
- }
478
- }