bootstrapped 0.0.6 → 0.9.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (113) hide show
  1. data/.gitignore +1 -0
  2. data/README.rdoc +36 -66
  3. data/Rakefile +10 -0
  4. data/bootstrapped.gemspec +10 -5
  5. data/features/Installation.feature +26 -0
  6. data/features/bootstrap_layout.feature +30 -1
  7. data/features/bootstrap_scaffold.feature +4 -5
  8. data/lib/bootstrapped.rb +5 -1
  9. data/lib/bootstrapped/engine.rb +14 -2
  10. data/lib/bootstrapped/version.rb +1 -1
  11. data/lib/generators/bootstrapped.rb +6 -2
  12. data/lib/generators/bootstrapped/install/install_generator.rb +36 -14
  13. data/lib/generators/bootstrapped/install/templates/application.css +8 -0
  14. data/lib/generators/bootstrapped/install/templates/application.js +10 -0
  15. data/lib/generators/bootstrapped/install/templates/bootstrap.coffee +3 -0
  16. data/lib/generators/bootstrapped/install/templates/bootstrap_and_overrides.less +17 -0
  17. data/lib/generators/bootstrapped/layout/layout_generator.rb +14 -8
  18. data/lib/generators/bootstrapped/layout/templates/layout.html.erb +94 -24
  19. data/lib/generators/bootstrapped/scaffold/scaffold_generator.rb +0 -7
  20. data/lib/generators/bootstrapped/scaffold/templates/views/erb/_form.html.erb +16 -15
  21. data/lib/generators/bootstrapped/scaffold/templates/views/erb/edit.html.erb +1 -14
  22. data/lib/generators/bootstrapped/scaffold/templates/views/erb/index.html.erb +36 -32
  23. data/lib/generators/bootstrapped/scaffold/templates/views/erb/new.html.erb +1 -7
  24. data/lib/generators/bootstrapped/scaffold/templates/views/erb/show.html.erb +4 -6
  25. data/vendor/assets/images/glyphicons-halflings-white.png +0 -0
  26. data/vendor/assets/images/glyphicons-halflings.png +0 -0
  27. data/vendor/assets/javascripts/bootstrap-alert.js +91 -0
  28. data/vendor/assets/javascripts/bootstrap-button.js +98 -0
  29. data/vendor/assets/javascripts/bootstrap-carousel.js +154 -0
  30. data/vendor/assets/javascripts/bootstrap-collapse.js +136 -0
  31. data/vendor/assets/javascripts/bootstrap-dropdown.js +92 -0
  32. data/vendor/assets/javascripts/bootstrap-modal.js +210 -0
  33. data/vendor/assets/javascripts/bootstrap-popover.js +95 -0
  34. data/vendor/assets/javascripts/bootstrap-scrollspy.js +125 -0
  35. data/vendor/assets/javascripts/bootstrap-tab.js +130 -0
  36. data/vendor/assets/javascripts/bootstrap-tooltip.js +270 -0
  37. data/vendor/assets/javascripts/bootstrap-transition.js +51 -0
  38. data/vendor/assets/javascripts/bootstrap-typeahead.js +271 -0
  39. data/vendor/assets/javascripts/modernizr.js +1270 -0
  40. data/vendor/assets/stylesheets/twitter/bootstrap/less/accordion.less +28 -0
  41. data/vendor/assets/stylesheets/twitter/bootstrap/less/alerts.less +70 -0
  42. data/vendor/assets/stylesheets/twitter/bootstrap/less/bootstrap.less +62 -0
  43. data/vendor/assets/stylesheets/twitter/bootstrap/less/bootstrap_base.less +2 -0
  44. data/vendor/assets/stylesheets/twitter/bootstrap/less/breadcrumbs.less +22 -0
  45. data/vendor/assets/stylesheets/twitter/bootstrap/less/button-groups.less +147 -0
  46. data/vendor/assets/stylesheets/twitter/bootstrap/less/buttons.less +165 -0
  47. data/vendor/assets/stylesheets/twitter/bootstrap/less/carousel.less +121 -0
  48. data/vendor/assets/stylesheets/twitter/bootstrap/less/close.less +18 -0
  49. data/vendor/assets/stylesheets/twitter/bootstrap/less/code.less +44 -0
  50. data/vendor/assets/stylesheets/twitter/bootstrap/less/component-animations.less +18 -0
  51. data/vendor/assets/stylesheets/twitter/bootstrap/less/dropdowns.less +131 -0
  52. data/vendor/assets/stylesheets/twitter/bootstrap/less/forms.less +515 -0
  53. data/vendor/assets/stylesheets/twitter/bootstrap/less/grid.less +8 -0
  54. data/vendor/assets/stylesheets/twitter/bootstrap/less/hero-unit.less +20 -0
  55. data/vendor/assets/stylesheets/twitter/bootstrap/less/labels.less +16 -0
  56. data/vendor/assets/stylesheets/twitter/bootstrap/less/layouts.less +17 -0
  57. data/vendor/assets/stylesheets/twitter/bootstrap/less/mixins.less +537 -0
  58. data/vendor/assets/stylesheets/twitter/bootstrap/less/modals.less +72 -0
  59. data/vendor/assets/stylesheets/twitter/bootstrap/less/navbar.less +292 -0
  60. data/vendor/assets/stylesheets/twitter/bootstrap/less/navs.less +344 -0
  61. data/vendor/assets/stylesheets/twitter/bootstrap/less/pager.less +30 -0
  62. data/vendor/assets/stylesheets/twitter/bootstrap/less/pagination.less +55 -0
  63. data/vendor/assets/stylesheets/twitter/bootstrap/less/popovers.less +49 -0
  64. data/vendor/assets/stylesheets/twitter/bootstrap/less/progress-bars.less +95 -0
  65. data/vendor/{framework → assets/stylesheets/twitter/bootstrap/less}/reset.less +37 -52
  66. data/vendor/assets/stylesheets/twitter/bootstrap/less/responsive.less +323 -0
  67. data/vendor/assets/stylesheets/twitter/bootstrap/less/scaffolding.less +29 -0
  68. data/vendor/assets/stylesheets/twitter/bootstrap/less/sprites.less +156 -0
  69. data/vendor/assets/stylesheets/twitter/bootstrap/less/tables.less +139 -0
  70. data/vendor/assets/stylesheets/twitter/bootstrap/less/thumbnails.less +35 -0
  71. data/vendor/assets/stylesheets/twitter/bootstrap/less/tooltip.less +35 -0
  72. data/vendor/assets/stylesheets/twitter/bootstrap/less/type.less +217 -0
  73. data/vendor/assets/stylesheets/twitter/bootstrap/less/utilities.less +23 -0
  74. data/vendor/assets/stylesheets/twitter/bootstrap/less/variables.less +99 -0
  75. data/vendor/assets/stylesheets/twitter/bootstrap/less/wells.less +17 -0
  76. data/vendor/assets/stylesheets/twitter/bootstrap/static/bootstrap.css +3496 -0
  77. metadata +114 -68
  78. data/Gemfile.lock +0 -133
  79. data/lib/generators/bootstrapped/install/templates/bootstrap.less +0 -26
  80. data/lib/generators/bootstrapped/install/templates/forms.less +0 -479
  81. data/lib/generators/bootstrapped/install/templates/mixins.less +0 -222
  82. data/lib/generators/bootstrapped/install/templates/patterns.less +0 -1060
  83. data/lib/generators/bootstrapped/install/templates/reset.less +0 -141
  84. data/lib/generators/bootstrapped/install/templates/scaffolding.less +0 -137
  85. data/lib/generators/bootstrapped/install/templates/tables.less +0 -224
  86. data/lib/generators/bootstrapped/install/templates/type.less +0 -187
  87. data/lib/generators/bootstrapped/install/templates/variables.less +0 -60
  88. data/lib/generators/bootstrapped/scaffold/templates/tests/shoulda/actions/create.rb +0 -13
  89. data/lib/generators/bootstrapped/scaffold/templates/tests/shoulda/actions/destroy.rb +0 -8
  90. data/lib/generators/bootstrapped/scaffold/templates/tests/shoulda/actions/edit.rb +0 -6
  91. data/lib/generators/bootstrapped/scaffold/templates/tests/shoulda/actions/index.rb +0 -6
  92. data/lib/generators/bootstrapped/scaffold/templates/tests/shoulda/actions/new.rb +0 -6
  93. data/lib/generators/bootstrapped/scaffold/templates/tests/shoulda/actions/show.rb +0 -6
  94. data/lib/generators/bootstrapped/scaffold/templates/tests/shoulda/actions/update.rb +0 -13
  95. data/lib/generators/bootstrapped/scaffold/templates/tests/shoulda/controller.rb +0 -5
  96. data/lib/generators/bootstrapped/scaffold/templates/tests/shoulda/model.rb +0 -7
  97. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-alerts.js +0 -113
  98. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-buttons.js +0 -62
  99. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-dropdown.js +0 -55
  100. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-modal.js +0 -260
  101. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-popover.js +0 -90
  102. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-scrollspy.js +0 -107
  103. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-tabs.js +0 -80
  104. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-twipsy.js +0 -321
  105. data/vendor/assets/stylesheets/twitter/bootstrap/bootstrap.css +0 -2467
  106. data/vendor/framework/bootstrap.less +0 -26
  107. data/vendor/framework/forms.less +0 -479
  108. data/vendor/framework/mixins.less +0 -222
  109. data/vendor/framework/patterns.less +0 -1060
  110. data/vendor/framework/scaffolding.less +0 -137
  111. data/vendor/framework/tables.less +0 -224
  112. data/vendor/framework/type.less +0 -187
  113. data/vendor/framework/variables.less +0 -60
@@ -0,0 +1,121 @@
1
+ // CAROUSEL
2
+ // --------
3
+
4
+ .carousel {
5
+ position: relative;
6
+ margin-bottom: @baseLineHeight;
7
+ line-height: 1;
8
+ }
9
+
10
+ .carousel-inner {
11
+ overflow: hidden;
12
+ width: 100%;
13
+ position: relative;
14
+ }
15
+
16
+ .carousel {
17
+
18
+ .item {
19
+ display: none;
20
+ position: relative;
21
+ .transition(.6s ease-in-out left);
22
+ }
23
+
24
+ // Account for jankitude on images
25
+ .item > img {
26
+ display: block;
27
+ line-height: 1;
28
+ }
29
+
30
+ .active,
31
+ .next,
32
+ .prev { display: block; }
33
+
34
+ .active {
35
+ left: 0;
36
+ }
37
+
38
+ .next,
39
+ .prev {
40
+ position: absolute;
41
+ top: 0;
42
+ width: 100%;
43
+ }
44
+
45
+ .next {
46
+ left: 100%;
47
+ }
48
+ .prev {
49
+ left: -100%;
50
+ }
51
+ .next.left,
52
+ .prev.right {
53
+ left: 0;
54
+ }
55
+
56
+ .active.left {
57
+ left: -100%;
58
+ }
59
+ .active.right {
60
+ left: 100%;
61
+ }
62
+
63
+ }
64
+
65
+ // Left/right controls for nav
66
+ // ---------------------------
67
+
68
+ .carousel-control {
69
+ position: absolute;
70
+ top: 40%;
71
+ left: 15px;
72
+ width: 40px;
73
+ height: 40px;
74
+ margin-top: -20px;
75
+ font-size: 60px;
76
+ font-weight: 100;
77
+ line-height: 30px;
78
+ color: @white;
79
+ text-align: center;
80
+ background: @grayDarker;
81
+ border: 3px solid @white;
82
+ .border-radius(23px);
83
+ .opacity(50);
84
+
85
+ // we can't have this transition here
86
+ // because webkit cancels the carousel
87
+ // animation if you trip this while
88
+ // in the middle of another animation
89
+ // ;_;
90
+ // .transition(opacity .2s linear);
91
+
92
+ // Reposition the right one
93
+ &.right {
94
+ left: auto;
95
+ right: 15px;
96
+ }
97
+
98
+ // Hover state
99
+ &:hover {
100
+ color: @white;
101
+ text-decoration: none;
102
+ .opacity(90);
103
+ }
104
+ }
105
+
106
+ // Caption for text below images
107
+ // -----------------------------
108
+
109
+ .carousel-caption {
110
+ position: absolute;
111
+ left: 0;
112
+ right: 0;
113
+ bottom: 0;
114
+ padding: 10px 15px 5px;
115
+ background: @grayDark;
116
+ background: rgba(0,0,0,.75);
117
+ }
118
+ .carousel-caption h4,
119
+ .carousel-caption p {
120
+ color: @white;
121
+ }
@@ -0,0 +1,18 @@
1
+ // CLOSE ICONS
2
+ // -----------
3
+
4
+ .close {
5
+ float: right;
6
+ font-size: 20px;
7
+ font-weight: bold;
8
+ line-height: @baseLineHeight;
9
+ color: @black;
10
+ text-shadow: 0 1px 0 rgba(255,255,255,1);
11
+ .opacity(20);
12
+ &:hover {
13
+ color: @black;
14
+ text-decoration: none;
15
+ .opacity(40);
16
+ cursor: pointer;
17
+ }
18
+ }
@@ -0,0 +1,44 @@
1
+ // Code.less
2
+ // Code typography styles for the <code> and <pre> elements
3
+ // --------------------------------------------------------
4
+
5
+ // Inline and block code styles
6
+ code,
7
+ pre {
8
+ padding: 0 3px 2px;
9
+ #font > #family > .monospace;
10
+ font-size: @baseFontSize - 1;
11
+ color: @grayDark;
12
+ .border-radius(3px);
13
+ }
14
+ code {
15
+ padding: 3px 4px;
16
+ color: #d14;
17
+ background-color: #f7f7f9;
18
+ border: 1px solid #e1e1e8;
19
+ }
20
+ pre {
21
+ display: block;
22
+ padding: (@baseLineHeight - 1) / 2;
23
+ margin: 0 0 @baseLineHeight / 2;
24
+ font-size: 12px;
25
+ line-height: @baseLineHeight;
26
+ background-color: #f5f5f5;
27
+ border: 1px solid #ccc; // fallback for IE7-8
28
+ border: 1px solid rgba(0,0,0,.15);
29
+ .border-radius(4px);
30
+ white-space: pre;
31
+ white-space: pre-wrap;
32
+ word-break: break-all;
33
+
34
+ // Make prettyprint styles more spaced out for readability
35
+ &.prettyprint {
36
+ margin-bottom: @baseLineHeight;
37
+ }
38
+
39
+ // Account for some code outputs that place code tags in pre tags
40
+ code {
41
+ padding: 0;
42
+ background-color: transparent;
43
+ }
44
+ }
@@ -0,0 +1,18 @@
1
+ // COMPONENT ANIMATIONS
2
+ // --------------------
3
+
4
+ .fade {
5
+ .transition(opacity .15s linear);
6
+ opacity: 0;
7
+ &.in {
8
+ opacity: 1;
9
+ }
10
+ }
11
+
12
+ .collapse {
13
+ .transition(height .35s ease);
14
+ position:relative;
15
+ overflow:hidden;
16
+ height: 0;
17
+ &.in { height: auto; }
18
+ }
@@ -0,0 +1,131 @@
1
+ // DROPDOWN MENUS
2
+ // --------------
3
+
4
+ // Use the .menu class on any <li> element within the topbar or ul.tabs and you'll get some superfancy dropdowns
5
+ .dropdown {
6
+ position: relative;
7
+ }
8
+ .dropdown-toggle {
9
+ // The caret makes the toggle a bit too tall in IE7
10
+ *margin-bottom: -3px;
11
+ }
12
+ .dropdown-toggle:active,
13
+ .open .dropdown-toggle {
14
+ outline: 0;
15
+ }
16
+ // Dropdown arrow/caret
17
+ .caret {
18
+ display: inline-block;
19
+ width: 0;
20
+ height: 0;
21
+ text-indent: -99999px;
22
+ // IE7 won't do the border trick if there's a text indent, but it doesn't
23
+ // do the content that text-indent is hiding, either, so we're ok.
24
+ *text-indent: 0;
25
+ vertical-align: top;
26
+ border-left: 4px solid transparent;
27
+ border-right: 4px solid transparent;
28
+ border-top: 4px solid @black;
29
+ .opacity(30);
30
+ content: "\2193";
31
+ }
32
+ .dropdown .caret {
33
+ margin-top: 8px;
34
+ margin-left: 2px;
35
+ }
36
+ .dropdown:hover .caret,
37
+ .open.dropdown .caret {
38
+ .opacity(100);
39
+ }
40
+ // The dropdown menu (ul)
41
+ .dropdown-menu {
42
+ position: absolute;
43
+ top: 100%;
44
+ left: 0;
45
+ z-index: @zindexDropdown;
46
+ float: left;
47
+ display: none; // none by default, but block on "open" of the menu
48
+ min-width: 160px;
49
+ max-width: 220px;
50
+ _width: 160px;
51
+ padding: 4px 0;
52
+ margin: 0; // override default ul
53
+ list-style: none;
54
+ background-color: @white;
55
+ border-color: #ccc;
56
+ border-color: rgba(0,0,0,.2);
57
+ border-style: solid;
58
+ border-width: 1px;
59
+ .border-radius(0 0 5px 5px);
60
+ .box-shadow(0 5px 10px rgba(0,0,0,.2));
61
+ -webkit-background-clip: padding-box;
62
+ -moz-background-clip: padding;
63
+ background-clip: padding-box;
64
+ *border-right-width: 2px;
65
+ *border-bottom-width: 2px;
66
+
67
+ // Allow for dropdowns to go bottom up (aka, dropup-menu)
68
+ &.bottom-up {
69
+ top: auto;
70
+ bottom: 100%;
71
+ margin-bottom: 2px;
72
+ }
73
+
74
+ // Dividers (basically an hr) within the dropdown
75
+ .divider {
76
+ height: 1px;
77
+ margin: 5px 1px;
78
+ overflow: hidden;
79
+ background-color: #e5e5e5;
80
+ border-bottom: 1px solid @white;
81
+
82
+ // IE7 needs a set width since we gave a height. Restricting just
83
+ // to IE7 to keep the 1px left/right space in other browsers.
84
+ // It is unclear where IE is getting the extra space that we need
85
+ // to negative-margin away, but so it goes.
86
+ *width: 100%;
87
+ *margin: -5px 0 5px;
88
+ }
89
+
90
+ // Links within the dropdown menu
91
+ a {
92
+ display: block;
93
+ padding: 3px 15px;
94
+ clear: both;
95
+ font-weight: normal;
96
+ line-height: 18px;
97
+ color: @gray;
98
+ white-space: nowrap;
99
+ }
100
+ }
101
+
102
+ // Hover state
103
+ .dropdown-menu li > a:hover,
104
+ .dropdown-menu .active > a,
105
+ .dropdown-menu .active > a:hover {
106
+ color: @white;
107
+ text-decoration: none;
108
+ background-color: @linkColor;
109
+ }
110
+
111
+ // Open state for the dropdown
112
+ .dropdown.open {
113
+ // IE7's z-index only goes to the nearest positioned ancestor, which would
114
+ // make the menu appear below buttons that appeared later on the page
115
+ *z-index: @zindexDropdown;
116
+
117
+ .dropdown-toggle {
118
+ color: @white;
119
+ background: #ccc;
120
+ background: rgba(0,0,0,.3);
121
+ }
122
+ .dropdown-menu {
123
+ display: block;
124
+ }
125
+ }
126
+
127
+ // Typeahead
128
+ .typeahead {
129
+ margin-top: 2px; // give it some space to breathe
130
+ .border-radius(4px);
131
+ }
@@ -0,0 +1,515 @@
1
+ // Forms.less
2
+ // Base styles for various input types, form layouts, and states
3
+ // -------------------------------------------------------------
4
+
5
+
6
+ // GENERAL STYLES
7
+ // --------------
8
+
9
+ // Make all forms have space below them
10
+ form {
11
+ margin: 0 0 @baseLineHeight;
12
+ }
13
+
14
+ fieldset {
15
+ padding: 0;
16
+ margin: 0;
17
+ border: 0;
18
+ }
19
+
20
+ // Groups of fields with labels on top (legends)
21
+ legend {
22
+ display: block;
23
+ width: 100%;
24
+ padding: 0;
25
+ margin-bottom: @baseLineHeight * 1.5;
26
+ font-size: @baseFontSize * 1.5;
27
+ line-height: @baseLineHeight * 2;
28
+ color: @grayDark;
29
+ border: 0;
30
+ border-bottom: 1px solid #eee;
31
+ }
32
+
33
+ // Set font for forms
34
+ label,
35
+ input,
36
+ button,
37
+ select,
38
+ textarea {
39
+ #font > .sans-serif(@baseFontSize,normal,@baseLineHeight);
40
+ }
41
+
42
+ // Identify controls by their labels
43
+ label {
44
+ display: block;
45
+ margin-bottom: 5px;
46
+ color: @grayDark;
47
+ }
48
+
49
+ // Inputs, Textareas, Selects
50
+ input,
51
+ textarea,
52
+ select,
53
+ .uneditable-input {
54
+ display: inline-block;
55
+ width: 210px;
56
+ height: @baseLineHeight;
57
+ padding: 4px;
58
+ margin-bottom: 9px;
59
+ font-size: @baseFontSize;
60
+ line-height: @baseLineHeight;
61
+ color: @gray;
62
+ border: 1px solid #ccc;
63
+ .border-radius(3px);
64
+ }
65
+ .uneditable-textarea {
66
+ width: auto;
67
+ height: auto;
68
+ }
69
+
70
+ // Inputs within a label
71
+ label input,
72
+ label textarea,
73
+ label select {
74
+ display: block;
75
+ }
76
+
77
+ // Mini reset for unique input types
78
+ input[type="image"],
79
+ input[type="checkbox"],
80
+ input[type="radio"] {
81
+ width: auto;
82
+ height: auto;
83
+ padding: 0;
84
+ margin: 3px 0;
85
+ *margin-top: 0; /* IE7 */
86
+ line-height: normal;
87
+ border: 0;
88
+ cursor: pointer;
89
+ .border-radius(0);
90
+ }
91
+
92
+ // Reset the file input to browser defaults
93
+ input[type="file"] {
94
+ padding: initial;
95
+ line-height: initial;
96
+ border: initial;
97
+ background-color: @white;
98
+ background-color: initial;
99
+ .box-shadow(none);
100
+ }
101
+
102
+ // Help out input buttons
103
+ input[type="button"],
104
+ input[type="reset"],
105
+ input[type="submit"] {
106
+ width: auto;
107
+ height: auto;
108
+ }
109
+
110
+ // Set the height of select and file controls to match text inputs
111
+ select,
112
+ input[type="file"] {
113
+ height: 28px; /* In IE7, the height of the select element cannot be changed by height, only font-size */
114
+ *margin-top: 4px; /* For IE7, add top margin to align select with labels */
115
+ line-height: 28px;
116
+ }
117
+
118
+ // Chrome on Linux and Mobile Safari need background-color
119
+ select {
120
+ width: 220px; // default input width + 10px of padding that doesn't get applied
121
+ background-color: @white;
122
+ }
123
+
124
+ // Make multiple select elements height not fixed
125
+ select[multiple],
126
+ select[size] {
127
+ height: auto;
128
+ }
129
+
130
+ // Remove shadow from image inputs
131
+ input[type="image"] {
132
+ .box-shadow(none);
133
+ }
134
+
135
+ // Make textarea height behave
136
+ textarea {
137
+ height: auto;
138
+ }
139
+
140
+ // Hidden inputs
141
+ input[type="hidden"] {
142
+ display: none;
143
+ }
144
+
145
+
146
+
147
+ // CHECKBOXES & RADIOS
148
+ // -------------------
149
+
150
+ // Indent the labels to position radios/checkboxes as hanging
151
+ .radio,
152
+ .checkbox {
153
+ padding-left: 18px;
154
+ }
155
+ .radio input[type="radio"],
156
+ .checkbox input[type="checkbox"] {
157
+ float: left;
158
+ margin-left: -18px;
159
+ }
160
+
161
+ // Move the options list down to align with labels
162
+ .controls > .radio:first-child,
163
+ .controls > .checkbox:first-child {
164
+ padding-top: 5px; // has to be padding because margin collaspes
165
+ }
166
+
167
+ // Radios and checkboxes on same line
168
+ .radio.inline,
169
+ .checkbox.inline {
170
+ display: inline-block;
171
+ margin-bottom: 0;
172
+ vertical-align: middle;
173
+ }
174
+ .radio.inline + .radio.inline,
175
+ .checkbox.inline + .checkbox.inline {
176
+ margin-left: 10px; // space out consecutive inline controls
177
+ }
178
+ // But don't forget to remove their padding on first-child
179
+ .controls > .radio.inline:first-child,
180
+ .controls > .checkbox.inline:first-child {
181
+ padding-top: 0;
182
+ }
183
+
184
+
185
+
186
+ // FOCUS STATE
187
+ // -----------
188
+
189
+ input,
190
+ textarea {
191
+ .box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
192
+ @transition: border linear .2s, box-shadow linear .2s;
193
+ .transition(@transition);
194
+ }
195
+ input:focus,
196
+ textarea:focus {
197
+ border-color: rgba(82,168,236,.8);
198
+ @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
199
+ .box-shadow(@shadow);
200
+ outline: 0;
201
+ outline: thin dotted \9; /* IE6-8 */
202
+ }
203
+ input[type="file"]:focus,
204
+ input[type="checkbox"]:focus,
205
+ select:focus {
206
+ .box-shadow(none); // override for file inputs
207
+ .tab-focus();
208
+ }
209
+
210
+
211
+
212
+ // INPUT SIZES
213
+ // -----------
214
+
215
+ // General classes for quick sizes
216
+ .input-mini { width: 60px; }
217
+ .input-small { width: 90px; }
218
+ .input-medium { width: 150px; }
219
+ .input-large { width: 210px; }
220
+ .input-xlarge { width: 270px; }
221
+ .input-xxlarge { width: 530px; }
222
+
223
+ // Grid style input sizes
224
+ input[class*="span"],
225
+ select[class*="span"],
226
+ textarea[class*="span"],
227
+ .uneditable-input {
228
+ float: none;
229
+ margin-left: 0;
230
+ }
231
+
232
+
233
+
234
+ // GRID SIZING FOR INPUTS
235
+ // ----------------------
236
+
237
+ #inputGridSystem > .generate(@gridColumns, @gridColumnWidth, @gridGutterWidth);
238
+
239
+
240
+
241
+
242
+ // DISABLED STATE
243
+ // --------------
244
+
245
+ // Disabled and read-only inputs
246
+ input[disabled],
247
+ select[disabled],
248
+ textarea[disabled],
249
+ input[readonly],
250
+ select[readonly],
251
+ textarea[readonly] {
252
+ background-color: #f5f5f5;
253
+ border-color: #ddd;
254
+ cursor: not-allowed;
255
+ }
256
+
257
+
258
+
259
+
260
+ // FORM FIELD FEEDBACK STATES
261
+ // --------------------------
262
+
263
+ // Mixin for form field states
264
+ .formFieldState(@textColor: #555, @borderColor: #ccc, @backgroundColor: #f5f5f5) {
265
+ // Set the text color
266
+ > label,
267
+ .help-block,
268
+ .help-inline {
269
+ color: @textColor;
270
+ }
271
+ // Style inputs accordingly
272
+ input,
273
+ select,
274
+ textarea {
275
+ color: @textColor;
276
+ border-color: @borderColor;
277
+ &:focus {
278
+ border-color: darken(@borderColor, 10%);
279
+ .box-shadow(0 0 6px lighten(@borderColor, 20%));
280
+ }
281
+ }
282
+ // Give a small background color for input-prepend/-append
283
+ .input-prepend .add-on,
284
+ .input-append .add-on {
285
+ color: @textColor;
286
+ background-color: @backgroundColor;
287
+ border-color: @textColor;
288
+ }
289
+ }
290
+ // Warning
291
+ .control-group.warning {
292
+ .formFieldState(@warningText, @warningText, @warningBackground);
293
+ }
294
+ // Error
295
+ .control-group.error {
296
+ .formFieldState(@errorText, @errorText, @errorBackground);
297
+ }
298
+ // Success
299
+ .control-group.success {
300
+ .formFieldState(@successText, @successText, @successBackground);
301
+ }
302
+
303
+ // HTML5 invalid states
304
+ // Shares styles with the .control-group.error above
305
+ input:focus:required:invalid,
306
+ textarea:focus:required:invalid,
307
+ select:focus:required:invalid {
308
+ color: #b94a48;
309
+ border-color: #ee5f5b;
310
+ &:focus {
311
+ border-color: darken(#ee5f5b, 10%);
312
+ .box-shadow(0 0 6px lighten(#ee5f5b, 20%));
313
+ }
314
+ }
315
+
316
+
317
+
318
+ // FORM ACTIONS
319
+ // ------------
320
+
321
+ .form-actions {
322
+ padding: (@baseLineHeight - 1) 20px @baseLineHeight;
323
+ margin-top: @baseLineHeight;
324
+ margin-bottom: @baseLineHeight;
325
+ background-color: #f5f5f5;
326
+ border-top: 1px solid #ddd;
327
+ }
328
+
329
+ // For text that needs to appear as an input but should not be an input
330
+ .uneditable-input {
331
+ display: block;
332
+ background-color: @white;
333
+ border-color: #eee;
334
+ .box-shadow(inset 0 1px 2px rgba(0,0,0,.025));
335
+ cursor: not-allowed;
336
+ }
337
+
338
+ // Placeholder text gets special styles; can't be bundled together though for some reason
339
+ .placeholder(@grayLight);
340
+
341
+
342
+
343
+ // HELP TEXT
344
+ // ---------
345
+
346
+ .help-block {
347
+ margin-top: 5px;
348
+ margin-bottom: 0;
349
+ color: @grayLight;
350
+ }
351
+
352
+ .help-inline {
353
+ display: inline-block;
354
+ .ie7-inline-block();
355
+ margin-bottom: 9px;
356
+ vertical-align: middle;
357
+ padding-left: 5px;
358
+ }
359
+
360
+
361
+
362
+ // INPUT GROUPS
363
+ // ------------
364
+
365
+ // Allow us to put symbols and text within the input field for a cleaner look
366
+ .input-prepend,
367
+ .input-append {
368
+ margin-bottom: 5px;
369
+ .clearfix(); // Clear the float to prevent wrapping
370
+ input,
371
+ .uneditable-input {
372
+ .border-radius(0 3px 3px 0);
373
+ &:focus {
374
+ position: relative;
375
+ z-index: 2;
376
+ }
377
+ }
378
+ .uneditable-input {
379
+ border-left-color: #ccc;
380
+ }
381
+ .add-on {
382
+ float: left;
383
+ display: block;
384
+ width: auto;
385
+ min-width: 16px;
386
+ height: @baseLineHeight;
387
+ margin-right: -1px;
388
+ padding: 4px 5px;
389
+ font-weight: normal;
390
+ line-height: @baseLineHeight;
391
+ color: @grayLight;
392
+ text-align: center;
393
+ text-shadow: 0 1px 0 @white;
394
+ background-color: #f5f5f5;
395
+ border: 1px solid #ccc;
396
+ .border-radius(3px 0 0 3px);
397
+ }
398
+ .active {
399
+ background-color: lighten(@green, 30);
400
+ border-color: @green;
401
+ }
402
+ }
403
+ .input-prepend {
404
+ .add-on {
405
+ *margin-top: 1px; /* IE6-7 */
406
+ }
407
+ }
408
+ .input-append {
409
+ input,
410
+ .uneditable-input {
411
+ float: left;
412
+ .border-radius(3px 0 0 3px);
413
+ }
414
+ .uneditable-input {
415
+ border-right-color: #ccc;
416
+ }
417
+ .add-on {
418
+ margin-right: 0;
419
+ margin-left: -1px;
420
+ .border-radius(0 3px 3px 0);
421
+ }
422
+ input:first-child {
423
+ // In IE7, having a hasLayout container (from clearfix's zoom:1) can make the first input
424
+ // inherit the sum of its ancestors' margins.
425
+ *margin-left: -160px;
426
+
427
+ &+.add-on {
428
+ *margin-left: -21px;
429
+ }
430
+ }
431
+ }
432
+
433
+
434
+
435
+ // SEARCH FORM
436
+ // -----------
437
+
438
+ .search-query {
439
+ padding-left: 14px;
440
+ padding-right: 14px;
441
+ margin-bottom: 0; // remove the default margin on all inputs
442
+ .border-radius(14px);
443
+ }
444
+
445
+
446
+
447
+ // HORIZONTAL & VERTICAL FORMS
448
+ // ---------------------------
449
+
450
+ // Common properties
451
+ // -----------------
452
+
453
+ .form-search,
454
+ .form-inline,
455
+ .form-horizontal {
456
+ input,
457
+ textarea,
458
+ select,
459
+ .help-inline,
460
+ .uneditable-input {
461
+ display: inline-block;
462
+ margin-bottom: 0;
463
+ }
464
+ }
465
+ .form-search label,
466
+ .form-inline label,
467
+ .form-search .input-append,
468
+ .form-inline .input-append,
469
+ .form-search .input-prepend,
470
+ .form-inline .input-prepend {
471
+ display: inline-block;
472
+ }
473
+ // Make the prepend and append add-on vertical-align: middle;
474
+ .form-search .input-append .add-on,
475
+ .form-inline .input-prepend .add-on,
476
+ .form-search .input-append .add-on,
477
+ .form-inline .input-prepend .add-on {
478
+ vertical-align: middle;
479
+ }
480
+
481
+ // Margin to space out fieldsets
482
+ .control-group {
483
+ margin-bottom: @baseLineHeight / 2;
484
+ }
485
+
486
+ // Horizontal-specific styles
487
+ // --------------------------
488
+
489
+ .form-horizontal {
490
+ // Legend collapses margin, so we're relegated to padding
491
+ legend + .control-group {
492
+ margin-top: @baseLineHeight;
493
+ -webkit-margin-top-collapse: separate;
494
+ }
495
+ // Increase spacing between groups
496
+ .control-group {
497
+ margin-bottom: @baseLineHeight;
498
+ .clearfix();
499
+ }
500
+ // Float the labels left
501
+ .control-group > label {
502
+ float: left;
503
+ width: 140px;
504
+ padding-top: 5px;
505
+ text-align: right;
506
+ }
507
+ // Move over all input controls and content
508
+ .controls {
509
+ margin-left: 160px;
510
+ }
511
+ // Move over buttons in .form-actions to align with .controls
512
+ .form-actions {
513
+ padding-left: 160px;
514
+ }
515
+ }