bootstrap-generators 3.0.2.2 → 3.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (98) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +2 -2
  3. data/Rakefile +7 -6
  4. data/bootstrap-generators.gemspec +1 -1
  5. data/lib/bootstrap/generators/version.rb +1 -1
  6. data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.less +354 -164
  7. data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.scss +359 -165
  8. data/lib/generators/bootstrap/install/templates/form_builders/form_builder/_form.html.erb +3 -3
  9. data/lib/generators/bootstrap/install/templates/form_builders/form_builder/_form.html.haml +3 -3
  10. data/lib/generators/bootstrap/install/templates/form_builders/form_builder/_form.html.slim +3 -3
  11. data/lib/generators/bootstrap/install/templates/layouts/starter.html.erb +1 -0
  12. data/lib/generators/bootstrap/install/templates/layouts/starter.html.haml +1 -0
  13. data/lib/generators/bootstrap/install/templates/layouts/starter.html.slim +2 -0
  14. data/readme-template.md.erb +14 -0
  15. data/vendor/assets/fonts/{glyphicons-halflings-regular.eot → bootstrap/glyphicons-halflings-regular.eot} +0 -0
  16. data/vendor/assets/fonts/{glyphicons-halflings-regular.svg → bootstrap/glyphicons-halflings-regular.svg} +0 -0
  17. data/vendor/assets/fonts/{glyphicons-halflings-regular.ttf → bootstrap/glyphicons-halflings-regular.ttf} +0 -0
  18. data/vendor/assets/fonts/{glyphicons-halflings-regular.woff → bootstrap/glyphicons-halflings-regular.woff} +0 -0
  19. data/vendor/assets/javascripts/bootstrap/affix.js +34 -23
  20. data/vendor/assets/javascripts/bootstrap/alert.js +5 -15
  21. data/vendor/assets/javascripts/bootstrap/button.js +24 -26
  22. data/vendor/assets/javascripts/bootstrap/carousel.js +20 -32
  23. data/vendor/assets/javascripts/bootstrap/collapse.js +7 -16
  24. data/vendor/assets/javascripts/bootstrap/dropdown.js +23 -30
  25. data/vendor/assets/javascripts/bootstrap/modal.js +25 -28
  26. data/vendor/assets/javascripts/bootstrap/popover.js +14 -21
  27. data/vendor/assets/javascripts/bootstrap/scrollspy.js +17 -22
  28. data/vendor/assets/javascripts/bootstrap/tab.js +7 -17
  29. data/vendor/assets/javascripts/bootstrap/tooltip.js +52 -39
  30. data/vendor/assets/javascripts/bootstrap/transition.js +11 -19
  31. data/vendor/assets/stylesheets/bootstrap.css +1209 -2476
  32. data/vendor/twitter/bootstrap/less/badges.less +10 -6
  33. data/vendor/twitter/bootstrap/less/breadcrumbs.less +4 -1
  34. data/vendor/twitter/bootstrap/less/button-groups.less +17 -44
  35. data/vendor/twitter/bootstrap/less/buttons.less +10 -13
  36. data/vendor/twitter/bootstrap/less/carousel.less +1 -0
  37. data/vendor/twitter/bootstrap/less/code.less +10 -0
  38. data/vendor/twitter/bootstrap/less/dropdowns.less +31 -10
  39. data/vendor/twitter/bootstrap/less/forms.less +89 -34
  40. data/vendor/twitter/bootstrap/less/glyphicons.less +5 -9
  41. data/vendor/twitter/bootstrap/less/grid.less +36 -29
  42. data/vendor/twitter/bootstrap/less/input-groups.less +40 -19
  43. data/vendor/twitter/bootstrap/less/jumbotron.less +11 -7
  44. data/vendor/twitter/bootstrap/less/labels.less +6 -0
  45. data/vendor/twitter/bootstrap/less/list-group.less +25 -3
  46. data/vendor/twitter/bootstrap/less/mixins.less +140 -72
  47. data/vendor/twitter/bootstrap/less/modals.less +18 -12
  48. data/vendor/twitter/bootstrap/less/navbar.less +65 -73
  49. data/vendor/twitter/bootstrap/less/navs.less +2 -22
  50. data/vendor/twitter/bootstrap/less/normalize.less +139 -122
  51. data/vendor/twitter/bootstrap/less/pager.less +5 -5
  52. data/vendor/twitter/bootstrap/less/pagination.less +6 -3
  53. data/vendor/twitter/bootstrap/less/panels.less +73 -15
  54. data/vendor/twitter/bootstrap/less/print.less +0 -4
  55. data/vendor/twitter/bootstrap/less/progress-bars.less +0 -12
  56. data/vendor/twitter/bootstrap/less/responsive-utilities.less +13 -129
  57. data/vendor/twitter/bootstrap/less/scaffolding.less +17 -2
  58. data/vendor/twitter/bootstrap/less/tables.less +19 -22
  59. data/vendor/twitter/bootstrap/less/theme.less +1 -1
  60. data/vendor/twitter/bootstrap/less/thumbnails.less +9 -3
  61. data/vendor/twitter/bootstrap/less/tooltip.less +1 -1
  62. data/vendor/twitter/bootstrap/less/type.less +123 -106
  63. data/vendor/twitter/bootstrap/less/variables.less +354 -164
  64. data/vendor/twitter/bootstrap/less/wells.less +1 -1
  65. data/vendor/twitter/bootstrap/sass/_badges.scss +10 -6
  66. data/vendor/twitter/bootstrap/sass/_breadcrumbs.scss +4 -1
  67. data/vendor/twitter/bootstrap/sass/_button-groups.scss +15 -42
  68. data/vendor/twitter/bootstrap/sass/_buttons.scss +10 -13
  69. data/vendor/twitter/bootstrap/sass/_carousel.scss +1 -0
  70. data/vendor/twitter/bootstrap/sass/_code.scss +10 -0
  71. data/vendor/twitter/bootstrap/sass/_dropdowns.scss +31 -11
  72. data/vendor/twitter/bootstrap/sass/_forms.scss +88 -34
  73. data/vendor/twitter/bootstrap/sass/_glyphicons.scss +5 -9
  74. data/vendor/twitter/bootstrap/sass/_grid.scss +36 -29
  75. data/vendor/twitter/bootstrap/sass/_input-groups.scss +40 -19
  76. data/vendor/twitter/bootstrap/sass/_jumbotron.scss +11 -7
  77. data/vendor/twitter/bootstrap/sass/_labels.scss +6 -0
  78. data/vendor/twitter/bootstrap/sass/_list-group.scss +25 -3
  79. data/vendor/twitter/bootstrap/sass/_mixins.scss +135 -65
  80. data/vendor/twitter/bootstrap/sass/_modals.scss +17 -11
  81. data/vendor/twitter/bootstrap/sass/_navbar.scss +62 -70
  82. data/vendor/twitter/bootstrap/sass/_navs.scss +1 -21
  83. data/vendor/twitter/bootstrap/sass/_normalize.scss +139 -122
  84. data/vendor/twitter/bootstrap/sass/_pager.scss +4 -4
  85. data/vendor/twitter/bootstrap/sass/_pagination.scss +6 -3
  86. data/vendor/twitter/bootstrap/sass/_panels.scss +72 -14
  87. data/vendor/twitter/bootstrap/sass/_print.scss +0 -4
  88. data/vendor/twitter/bootstrap/sass/_progress-bars.scss +0 -12
  89. data/vendor/twitter/bootstrap/sass/_responsive-utilities.scss +6 -124
  90. data/vendor/twitter/bootstrap/sass/_scaffolding.scss +17 -2
  91. data/vendor/twitter/bootstrap/sass/_tables.scss +7 -18
  92. data/vendor/twitter/bootstrap/sass/_theme.scss +1 -1
  93. data/vendor/twitter/bootstrap/sass/_thumbnails.scss +13 -7
  94. data/vendor/twitter/bootstrap/sass/_tooltip.scss +1 -1
  95. data/vendor/twitter/bootstrap/sass/_type.scss +122 -105
  96. data/vendor/twitter/bootstrap/sass/_variables.scss +359 -165
  97. data/vendor/twitter/bootstrap/sass/_wells.scss +1 -1
  98. metadata +7 -7
@@ -3,11 +3,9 @@
3
3
  // --------------------------------------------------
4
4
 
5
5
 
6
- // Global values
7
- // --------------------------------------------------
8
-
9
- // Grays
10
- // -------------------------
6
+ //== Colors
7
+ //
8
+ //## Gray and brand colors for use across Bootstrap.
11
9
 
12
10
  @gray-darker: lighten(#000, 13.5%); // #222
13
11
  @gray-dark: lighten(#000, 20%); // #333
@@ -15,104 +13,127 @@
15
13
  @gray-light: lighten(#000, 60%); // #999
16
14
  @gray-lighter: lighten(#000, 93.5%); // #eee
17
15
 
18
- // Brand colors
19
- // -------------------------
20
-
21
16
  @brand-primary: #428bca;
22
17
  @brand-success: #5cb85c;
18
+ @brand-info: #5bc0de;
23
19
  @brand-warning: #f0ad4e;
24
20
  @brand-danger: #d9534f;
25
- @brand-info: #5bc0de;
26
21
 
27
- // Scaffolding
28
- // -------------------------
29
22
 
23
+ //== Scaffolding
24
+ //
25
+ // ## Settings for some of the most global styles.
26
+
27
+ //** Background color for `<body>`.
30
28
  @body-bg: #fff;
29
+ //** Global text color on `<body>`.
31
30
  @text-color: @gray-dark;
32
31
 
33
- // Links
34
- // -------------------------
35
-
32
+ //** Global textual link color.
36
33
  @link-color: @brand-primary;
34
+ //** Link hover color set via `darken()` function.
37
35
  @link-hover-color: darken(@link-color, 15%);
38
36
 
39
- // Typography
40
- // -------------------------
37
+
38
+ //== Typography
39
+ //
40
+ //## Font, line-height, and color for body text, headings, and more.
41
41
 
42
42
  @font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif;
43
43
  @font-family-serif: Georgia, "Times New Roman", Times, serif;
44
- @font-family-monospace: Monaco, Menlo, Consolas, "Courier New", monospace;
44
+ //** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`.
45
+ @font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
45
46
  @font-family-base: @font-family-sans-serif;
46
47
 
47
48
  @font-size-base: 14px;
48
- @font-size-large: ceil(@font-size-base * 1.25); // ~18px
49
- @font-size-small: ceil(@font-size-base * 0.85); // ~12px
49
+ @font-size-large: ceil((@font-size-base * 1.25)); // ~18px
50
+ @font-size-small: ceil((@font-size-base * 0.85)); // ~12px
50
51
 
51
- @font-size-h1: floor(@font-size-base * 2.6); // ~36px
52
- @font-size-h2: floor(@font-size-base * 2.15); // ~30px
53
- @font-size-h3: ceil(@font-size-base * 1.7); // ~24px
54
- @font-size-h4: ceil(@font-size-base * 1.25); // ~18px
52
+ @font-size-h1: floor((@font-size-base * 2.6)); // ~36px
53
+ @font-size-h2: floor((@font-size-base * 2.15)); // ~30px
54
+ @font-size-h3: ceil((@font-size-base * 1.7)); // ~24px
55
+ @font-size-h4: ceil((@font-size-base * 1.25)); // ~18px
55
56
  @font-size-h5: @font-size-base;
56
- @font-size-h6: ceil(@font-size-base * 0.85); // ~12px
57
+ @font-size-h6: ceil((@font-size-base * 0.85)); // ~12px
57
58
 
59
+ //** Unit-less `line-height` for use in components like buttons.
58
60
  @line-height-base: 1.428571429; // 20/14
59
- @line-height-computed: floor(@font-size-base * @line-height-base); // ~20px
61
+ //** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
62
+ @line-height-computed: floor((@font-size-base * @line-height-base)); // ~20px
60
63
 
61
- @headings-font-family: @font-family-base;
64
+ //** By default, this inherits from the `<body>`.
65
+ @headings-font-family: inherit;
62
66
  @headings-font-weight: 500;
63
67
  @headings-line-height: 1.1;
64
68
  @headings-color: inherit;
65
69
 
66
70
 
67
- // Iconography
68
- // -------------------------
71
+ //-- Iconography
72
+ //
73
+ //## Specify custom locations of the include Glyphicons icon font. Useful for those including Bootstrap via Bower.
69
74
 
70
75
  @icon-font-path: "../fonts/";
71
76
  @icon-font-name: "glyphicons-halflings-regular";
77
+ @icon-font-svg-id: "glyphicons_halflingsregular";
72
78
 
79
+ //== Components
80
+ //
81
+ //## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
82
+
83
+ @padding-base-vertical: 6px;
84
+ @padding-base-horizontal: 12px;
73
85
 
74
- // Components
75
- // -------------------------
76
- // Based on 14px font-size and 1.428 line-height (~20px to start)
86
+ @padding-large-vertical: 10px;
87
+ @padding-large-horizontal: 16px;
77
88
 
78
- @padding-base-vertical: 6px;
79
- @padding-base-horizontal: 12px;
89
+ @padding-small-vertical: 5px;
90
+ @padding-small-horizontal: 10px;
80
91
 
81
- @padding-large-vertical: 10px;
82
- @padding-large-horizontal: 16px;
92
+ @padding-xs-vertical: 1px;
93
+ @padding-xs-horizontal: 5px;
83
94
 
84
- @padding-small-vertical: 5px;
85
- @padding-small-horizontal: 10px;
95
+ @line-height-large: 1.33;
96
+ @line-height-small: 1.5;
86
97
 
87
- @line-height-large: 1.33;
88
- @line-height-small: 1.5;
98
+ @border-radius-base: 4px;
99
+ @border-radius-large: 6px;
100
+ @border-radius-small: 3px;
89
101
 
90
- @border-radius-base: 4px;
91
- @border-radius-large: 6px;
92
- @border-radius-small: 3px;
102
+ //** Global color for active items (e.g., navs or dropdowns).
103
+ @component-active-color: #fff;
104
+ //** Global background color for active items (e.g., navs or dropdowns).
105
+ @component-active-bg: @brand-primary;
93
106
 
94
- @component-active-color: #fff;
95
- @component-active-bg: @brand-primary;
107
+ //** Width of the `border` for generating carets that indicator dropdowns.
108
+ @caret-width-base: 4px;
109
+ //** Carets increase slightly in size for larger components.
110
+ @caret-width-large: 5px;
96
111
 
97
- @caret-width-base: 4px;
98
- @caret-width-large: 5px;
99
112
 
100
- // Tables
101
- // -------------------------
113
+ //== Tables
114
+ //
115
+ //## Customizes the `.table` component with basic values, each used across all table variations.
102
116
 
103
- @table-cell-padding: 8px;
104
- @table-condensed-cell-padding: 5px;
117
+ //** Padding for `<th>`s and `<td>`s.
118
+ @table-cell-padding: 8px;
119
+ //** Padding for cells in `.table-condensed`.
120
+ @table-condensed-cell-padding: 5px;
105
121
 
106
- @table-bg: transparent; // overall background-color
107
- @table-bg-accent: #f9f9f9; // for striping
108
- @table-bg-hover: #f5f5f5;
109
- @table-bg-active: @table-bg-hover;
122
+ //** Default background color used for all tables.
123
+ @table-bg: transparent;
124
+ //** Background color used for `.table-striped`.
125
+ @table-bg-accent: #f9f9f9;
126
+ //** Background color used for `.table-hover`.
127
+ @table-bg-hover: #f5f5f5;
128
+ @table-bg-active: @table-bg-hover;
110
129
 
111
- @table-border-color: #ddd; // table and cell border
130
+ //** Border color for table and cell borders.
131
+ @table-border-color: #ddd;
112
132
 
113
133
 
114
- // Buttons
115
- // -------------------------
134
+ //== Buttons
135
+ //
136
+ //## For each of Bootstrap's buttons, define text, background and border color.
116
137
 
117
138
  @btn-font-weight: normal;
118
139
 
@@ -128,6 +149,10 @@
128
149
  @btn-success-bg: @brand-success;
129
150
  @btn-success-border: darken(@btn-success-bg, 5%);
130
151
 
152
+ @btn-info-color: #fff;
153
+ @btn-info-bg: @brand-info;
154
+ @btn-info-border: darken(@btn-info-bg, 5%);
155
+
131
156
  @btn-warning-color: #fff;
132
157
  @btn-warning-bg: @brand-warning;
133
158
  @btn-warning-border: darken(@btn-warning-bg, 5%);
@@ -136,67 +161,87 @@
136
161
  @btn-danger-bg: @brand-danger;
137
162
  @btn-danger-border: darken(@btn-danger-bg, 5%);
138
163
 
139
- @btn-info-color: #fff;
140
- @btn-info-bg: @brand-info;
141
- @btn-info-border: darken(@btn-info-bg, 5%);
142
-
143
164
  @btn-link-disabled-color: @gray-light;
144
165
 
145
166
 
146
- // Forms
147
- // -------------------------
167
+ //== Forms
168
+ //
169
+ //##
148
170
 
171
+ //** `<input>` background color
149
172
  @input-bg: #fff;
173
+ //** `<input disabled>` background color
150
174
  @input-bg-disabled: @gray-lighter;
151
175
 
176
+ //** Text color for `<input>`s
152
177
  @input-color: @gray;
178
+ //** `<input>` border color
153
179
  @input-border: #ccc;
180
+ //** `<input>` border radius
154
181
  @input-border-radius: @border-radius-base;
182
+ //** Border color for inputs on focus
155
183
  @input-border-focus: #66afe9;
156
184
 
185
+ //** Placeholder text color
157
186
  @input-color-placeholder: @gray-light;
158
187
 
188
+ //** Default `.form-control` height
159
189
  @input-height-base: (@line-height-computed + (@padding-base-vertical * 2) + 2);
160
- @input-height-large: (floor(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2);
190
+ //** Large `.form-control` height
191
+ @input-height-large: (ceil(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2);
192
+ //** Small `.form-control` height
161
193
  @input-height-small: (floor(@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + 2);
162
194
 
163
195
  @legend-color: @gray-dark;
164
196
  @legend-border-color: #e5e5e5;
165
197
 
198
+ //** Background color for textual input addons
166
199
  @input-group-addon-bg: @gray-lighter;
200
+ //** Border color for textual input addons
167
201
  @input-group-addon-border-color: @input-border;
168
202
 
169
203
 
170
- // Dropdowns
171
- // -------------------------
204
+ //== Dropdowns
205
+ //
206
+ //## Dropdown menu container and contents.
172
207
 
208
+ //** Background for the dropdown menu.
173
209
  @dropdown-bg: #fff;
210
+ //** Dropdown menu `border-color`.
174
211
  @dropdown-border: rgba(0,0,0,.15);
212
+ //** Dropdown menu `border-color` **for IE8**.
175
213
  @dropdown-fallback-border: #ccc;
214
+ //** Divider color for between dropdown items.
176
215
  @dropdown-divider-bg: #e5e5e5;
177
216
 
217
+ //** Dropdown link text color.
178
218
  @dropdown-link-color: @gray-dark;
219
+ //** Hover color for dropdown links.
179
220
  @dropdown-link-hover-color: darken(@gray-dark, 5%);
221
+ //** Hover background for dropdown links.
180
222
  @dropdown-link-hover-bg: #f5f5f5;
181
223
 
224
+ //** Active dropdown menu item text color.
182
225
  @dropdown-link-active-color: @component-active-color;
226
+ //** Active dropdown menu item background color.
183
227
  @dropdown-link-active-bg: @component-active-bg;
184
228
 
229
+ //** Disabled dropdown menu item background color.
185
230
  @dropdown-link-disabled-color: @gray-light;
186
231
 
232
+ //** Text color for headers within dropdown menus.
187
233
  @dropdown-header-color: @gray-light;
188
234
 
235
+ // Note: Deprecated @dropdown-caret-color as of v3.1.0
189
236
  @dropdown-caret-color: #000;
190
237
 
191
238
 
192
- // COMPONENT VARIABLES
193
- // --------------------------------------------------
194
-
195
-
196
- // Z-index master list
197
- // -------------------------
198
- // Used for a bird's eye view of components dependent on the z-axis
199
- // Try to avoid customizing these :)
239
+ //-- Z-index master list
240
+ //
241
+ // Warning: Avoid customizing these values. They're used for a bird's eye view
242
+ // of components dependent on the z-axis and are designed to all work together.
243
+ //
244
+ // Note: These variables are not generated into the Customizer.
200
245
 
201
246
  @zindex-navbar: 1000;
202
247
  @zindex-dropdown: 1000;
@@ -206,8 +251,10 @@
206
251
  @zindex-modal-background: 1040;
207
252
  @zindex-modal: 1050;
208
253
 
209
- // Media queries breakpoints
210
- // --------------------------------------------------
254
+
255
+ //== Media queries breakpoints
256
+ //
257
+ //## Define the breakpoints at which your layout will change, adapting to different screen sizes.
211
258
 
212
259
  // Extra small screen / phone
213
260
  // Note: Deprecated @screen-xs and @screen-phone as of v3.0.1
@@ -239,26 +286,32 @@
239
286
  @screen-md-max: (@screen-lg-min - 1);
240
287
 
241
288
 
242
- // Grid system
243
- // --------------------------------------------------
289
+ //== Grid system
290
+ //
291
+ //## Define your custom responsive grid.
244
292
 
245
- // Number of columns in the grid system
293
+ //** Number of columns in the grid.
246
294
  @grid-columns: 12;
247
- // Padding, to be divided by two and applied to the left and right of all columns
295
+ //** Padding between columns. Gets divided in half for the left and right.
248
296
  @grid-gutter-width: 30px;
249
- // Point at which the navbar stops collapsing
297
+ // Navbar collapse
298
+ //** Point at which the navbar becomes uncollapsed.
250
299
  @grid-float-breakpoint: @screen-sm-min;
300
+ //** Point at which the navbar begins collapsing.
301
+ @grid-float-breakpoint-max: (@grid-float-breakpoint - 1);
251
302
 
252
303
 
253
- // Navbar
254
- // -------------------------
304
+ //== Navbar
305
+ //
306
+ //##
255
307
 
256
308
  // Basics of a navbar
257
309
  @navbar-height: 50px;
258
310
  @navbar-margin-bottom: @line-height-computed;
259
311
  @navbar-border-radius: @border-radius-base;
260
- @navbar-padding-horizontal: floor(@grid-gutter-width / 2);
312
+ @navbar-padding-horizontal: floor((@grid-gutter-width / 2));
261
313
  @navbar-padding-vertical: ((@navbar-height - @line-height-computed) / 2);
314
+ @navbar-collapse-max-height: 340px;
262
315
 
263
316
  @navbar-default-color: #777;
264
317
  @navbar-default-bg: #f8f8f8;
@@ -280,12 +333,11 @@
280
333
 
281
334
  // Navbar toggle
282
335
  @navbar-default-toggle-hover-bg: #ddd;
283
- @navbar-default-toggle-icon-bar-bg: #ccc;
336
+ @navbar-default-toggle-icon-bar-bg: #888;
284
337
  @navbar-default-toggle-border-color: #ddd;
285
338
 
286
339
 
287
340
  // Inverted navbar
288
- //
289
341
  // Reset inverted navbar basics
290
342
  @navbar-inverse-color: @gray-light;
291
343
  @navbar-inverse-bg: #222;
@@ -311,9 +363,11 @@
311
363
  @navbar-inverse-toggle-border-color: #333;
312
364
 
313
365
 
314
- // Navs
315
- // -------------------------
366
+ //== Navs
367
+ //
368
+ //##
316
369
 
370
+ //=== Shared nav styles
317
371
  @nav-link-padding: 10px 15px;
318
372
  @nav-link-hover-bg: @gray-lighter;
319
373
 
@@ -321,9 +375,8 @@
321
375
  @nav-disabled-link-hover-color: @gray-light;
322
376
 
323
377
  @nav-open-link-hover-color: #fff;
324
- @nav-open-caret-border-color: #fff;
325
378
 
326
- // Tabs
379
+ //== Tabs
327
380
  @nav-tabs-border-color: #ddd;
328
381
 
329
382
  @nav-tabs-link-hover-border-color: @gray-lighter;
@@ -335,122 +388,188 @@
335
388
  @nav-tabs-justified-link-border-color: #ddd;
336
389
  @nav-tabs-justified-active-link-border-color: @body-bg;
337
390
 
338
- // Pills
391
+ //== Pills
339
392
  @nav-pills-border-radius: @border-radius-base;
340
393
  @nav-pills-active-link-hover-bg: @component-active-bg;
341
394
  @nav-pills-active-link-hover-color: @component-active-color;
342
395
 
343
396
 
344
- // Pagination
345
- // -------------------------
397
+ //== Pagination
398
+ //
399
+ //##
346
400
 
401
+ @pagination-color: @link-color;
347
402
  @pagination-bg: #fff;
348
403
  @pagination-border: #ddd;
349
404
 
405
+ @pagination-hover-color: @link-hover-color;
350
406
  @pagination-hover-bg: @gray-lighter;
407
+ @pagination-hover-border: #ddd;
351
408
 
352
- @pagination-active-bg: @brand-primary;
353
409
  @pagination-active-color: #fff;
410
+ @pagination-active-bg: @brand-primary;
411
+ @pagination-active-border: @brand-primary;
354
412
 
355
413
  @pagination-disabled-color: @gray-light;
414
+ @pagination-disabled-bg: #fff;
415
+ @pagination-disabled-border: #ddd;
356
416
 
357
417
 
358
- // Pager
359
- // -------------------------
418
+ //== Pager
419
+ //
420
+ //##
360
421
 
422
+ @pager-bg: @pagination-bg;
423
+ @pager-border: @pagination-border;
361
424
  @pager-border-radius: 15px;
362
- @pager-disabled-color: @gray-light;
363
425
 
426
+ @pager-hover-bg: @pagination-hover-bg;
427
+
428
+ @pager-active-bg: @pagination-active-bg;
429
+ @pager-active-color: @pagination-active-color;
430
+
431
+ @pager-disabled-color: @pagination-disabled-color;
364
432
 
365
- // Jumbotron
366
- // -------------------------
433
+
434
+ //== Jumbotron
435
+ //
436
+ //##
367
437
 
368
438
  @jumbotron-padding: 30px;
369
439
  @jumbotron-color: inherit;
370
440
  @jumbotron-bg: @gray-lighter;
371
441
  @jumbotron-heading-color: inherit;
372
- @jumbotron-font-size: ceil(@font-size-base * 1.5);
442
+ @jumbotron-font-size: ceil((@font-size-base * 1.5));
373
443
 
374
444
 
375
- // Form states and alerts
376
- // -------------------------
445
+ //== Form states and alerts
446
+ //
447
+ //## Define colors for form feedback states and, by default, alerts.
377
448
 
378
- @state-success-text: #468847;
449
+ @state-success-text: #3c763d;
379
450
  @state-success-bg: #dff0d8;
380
451
  @state-success-border: darken(spin(@state-success-bg, -10), 5%);
381
452
 
382
- @state-info-text: #3a87ad;
453
+ @state-info-text: #31708f;
383
454
  @state-info-bg: #d9edf7;
384
455
  @state-info-border: darken(spin(@state-info-bg, -10), 7%);
385
456
 
386
- @state-warning-text: #c09853;
457
+ @state-warning-text: #8a6d3b;
387
458
  @state-warning-bg: #fcf8e3;
388
459
  @state-warning-border: darken(spin(@state-warning-bg, -10), 5%);
389
460
 
390
- @state-danger-text: #b94a48;
461
+ @state-danger-text: #a94442;
391
462
  @state-danger-bg: #f2dede;
392
463
  @state-danger-border: darken(spin(@state-danger-bg, -10), 5%);
393
464
 
394
465
 
395
- // Tooltips
396
- // -------------------------
466
+ //== Tooltips
467
+ //
468
+ //##
469
+
470
+ //** Tooltip max width
397
471
  @tooltip-max-width: 200px;
472
+ //** Tooltip text color
398
473
  @tooltip-color: #fff;
474
+ //** Tooltip background color
399
475
  @tooltip-bg: #000;
476
+ @tooltip-opacity: .9;
400
477
 
478
+ //** Tooltip arrow width
401
479
  @tooltip-arrow-width: 5px;
480
+ //** Tooltip arrow color
402
481
  @tooltip-arrow-color: @tooltip-bg;
403
482
 
404
483
 
405
- // Popovers
406
- // -------------------------
484
+ //== Popovers
485
+ //
486
+ //##
487
+
488
+ //** Popover body background color
407
489
  @popover-bg: #fff;
490
+ //** Popover maximum width
408
491
  @popover-max-width: 276px;
492
+ //** Popover border color
409
493
  @popover-border-color: rgba(0,0,0,.2);
494
+ //** Popover fallback border color
410
495
  @popover-fallback-border-color: #ccc;
411
496
 
497
+ //** Popover title background color
412
498
  @popover-title-bg: darken(@popover-bg, 3%);
413
499
 
500
+ //** Popover arrow width
414
501
  @popover-arrow-width: 10px;
502
+ //** Popover arrow color
415
503
  @popover-arrow-color: #fff;
416
504
 
505
+ //** Popover outer arrow width
417
506
  @popover-arrow-outer-width: (@popover-arrow-width + 1);
507
+ //** Popover outer arrow color
418
508
  @popover-arrow-outer-color: rgba(0,0,0,.25);
509
+ //** Popover outer arrow fallback color
419
510
  @popover-arrow-outer-fallback-color: #999;
420
511
 
421
512
 
422
- // Labels
423
- // -------------------------
513
+ //== Labels
514
+ //
515
+ //##
424
516
 
517
+ //** Default label background color
425
518
  @label-default-bg: @gray-light;
519
+ //** Primary label background color
426
520
  @label-primary-bg: @brand-primary;
521
+ //** Success label background color
427
522
  @label-success-bg: @brand-success;
523
+ //** Info label background color
428
524
  @label-info-bg: @brand-info;
525
+ //** Warning label background color
429
526
  @label-warning-bg: @brand-warning;
527
+ //** Danger label background color
430
528
  @label-danger-bg: @brand-danger;
431
529
 
530
+ //** Default label text color
432
531
  @label-color: #fff;
532
+ //** Default text color of a linked label
433
533
  @label-link-hover-color: #fff;
434
534
 
435
535
 
436
- // Modals
437
- // -------------------------
536
+ //== Modals
537
+ //
538
+ //##
539
+
540
+ //** Padding applied to the modal body
438
541
  @modal-inner-padding: 20px;
439
542
 
543
+ //** Padding applied to the modal title
440
544
  @modal-title-padding: 15px;
545
+ //** Modal title line-height
441
546
  @modal-title-line-height: @line-height-base;
442
547
 
548
+ //** Background color of modal content area
443
549
  @modal-content-bg: #fff;
550
+ //** Modal content border color
444
551
  @modal-content-border-color: rgba(0,0,0,.2);
552
+ //** Modal content border color **for IE8**
445
553
  @modal-content-fallback-border-color: #999;
446
554
 
555
+ //** Modal backdrop background color
447
556
  @modal-backdrop-bg: #000;
557
+ //** Modal backdrop opacity
558
+ @modal-backdrop-opacity: .5;
559
+ //** Modal header border color
448
560
  @modal-header-border-color: #e5e5e5;
561
+ //** Modal footer border color
449
562
  @modal-footer-border-color: @modal-header-border-color;
450
563
 
564
+ @modal-lg: 900px;
565
+ @modal-md: 600px;
566
+ @modal-sm: 300px;
567
+
568
+
569
+ //== Alerts
570
+ //
571
+ //## Define alert colors, border radius, and padding.
451
572
 
452
- // Alerts
453
- // -------------------------
454
573
  @alert-padding: 15px;
455
574
  @alert-border-radius: @border-radius-base;
456
575
  @alert-link-font-weight: bold;
@@ -472,38 +591,62 @@
472
591
  @alert-danger-border: @state-danger-border;
473
592
 
474
593
 
475
- // Progress bars
476
- // -------------------------
594
+ //== Progress bars
595
+ //
596
+ //##
597
+
598
+ //** Background color of the whole progress component
477
599
  @progress-bg: #f5f5f5;
600
+ //** Progress bar text color
478
601
  @progress-bar-color: #fff;
479
602
 
603
+ //** Default progress bar color
480
604
  @progress-bar-bg: @brand-primary;
605
+ //** Success progress bar color
481
606
  @progress-bar-success-bg: @brand-success;
607
+ //** Warning progress bar color
482
608
  @progress-bar-warning-bg: @brand-warning;
609
+ //** Danger progress bar color
483
610
  @progress-bar-danger-bg: @brand-danger;
611
+ //** Info progress bar color
484
612
  @progress-bar-info-bg: @brand-info;
485
613
 
486
614
 
487
- // List group
488
- // -------------------------
489
- @list-group-bg: #fff;
490
- @list-group-border: #ddd;
491
- @list-group-border-radius: @border-radius-base;
492
-
493
- @list-group-hover-bg: #f5f5f5;
494
- @list-group-active-color: @component-active-color;
495
- @list-group-active-bg: @component-active-bg;
496
- @list-group-active-border: @list-group-active-bg;
497
-
498
- @list-group-link-color: #555;
499
- @list-group-link-heading-color: #333;
500
-
615
+ //== List group
616
+ //
617
+ //##
618
+
619
+ //** Background color on `.list-group-item`
620
+ @list-group-bg: #fff;
621
+ //** `.list-group-item` border color
622
+ @list-group-border: #ddd;
623
+ //** List group border radius
624
+ @list-group-border-radius: @border-radius-base;
625
+
626
+ //** Background color of single list elements on hover
627
+ @list-group-hover-bg: #f5f5f5;
628
+ //** Text color of active list elements
629
+ @list-group-active-color: @component-active-color;
630
+ //** Background color of active list elements
631
+ @list-group-active-bg: @component-active-bg;
632
+ //** Border color of active list elements
633
+ @list-group-active-border: @list-group-active-bg;
634
+ @list-group-active-text-color: lighten(@list-group-active-bg, 40%);
635
+
636
+ @list-group-link-color: #555;
637
+ @list-group-link-heading-color: #333;
638
+
639
+
640
+ //== Panels
641
+ //
642
+ //##
501
643
 
502
- // Panels
503
- // -------------------------
504
644
  @panel-bg: #fff;
505
- @panel-inner-border: #ddd;
645
+ @panel-body-padding: 15px;
506
646
  @panel-border-radius: @border-radius-base;
647
+
648
+ //** Border color for elements within panels
649
+ @panel-inner-border: #ddd;
507
650
  @panel-footer-bg: #f5f5f5;
508
651
 
509
652
  @panel-default-text: @gray-dark;
@@ -518,6 +661,10 @@
518
661
  @panel-success-border: @state-success-border;
519
662
  @panel-success-heading-bg: @state-success-bg;
520
663
 
664
+ @panel-info-text: @state-info-text;
665
+ @panel-info-border: @state-info-border;
666
+ @panel-info-heading-bg: @state-info-bg;
667
+
521
668
  @panel-warning-text: @state-warning-text;
522
669
  @panel-warning-border: @state-warning-border;
523
670
  @panel-warning-heading-bg: @state-warning-bg;
@@ -526,34 +673,46 @@
526
673
  @panel-danger-border: @state-danger-border;
527
674
  @panel-danger-heading-bg: @state-danger-bg;
528
675
 
529
- @panel-info-text: @state-info-text;
530
- @panel-info-border: @state-info-border;
531
- @panel-info-heading-bg: @state-info-bg;
532
676
 
677
+ //== Thumbnails
678
+ //
679
+ //##
533
680
 
534
- // Thumbnails
535
- // -------------------------
681
+ //** Padding around the thumbnail image
536
682
  @thumbnail-padding: 4px;
683
+ //** Thumbnail background color
537
684
  @thumbnail-bg: @body-bg;
685
+ //** Thumbnail border color
538
686
  @thumbnail-border: #ddd;
687
+ //** Thumbnail border radius
539
688
  @thumbnail-border-radius: @border-radius-base;
540
689
 
690
+ //** Custom text color for thumbnail captions
541
691
  @thumbnail-caption-color: @text-color;
692
+ //** Padding around the thumbnail caption
542
693
  @thumbnail-caption-padding: 9px;
543
694
 
544
695
 
545
- // Wells
546
- // -------------------------
696
+ //== Wells
697
+ //
698
+ //##
699
+
547
700
  @well-bg: #f5f5f5;
701
+ @well-border: darken(@well-bg, 7%);
548
702
 
549
703
 
550
- // Badges
551
- // -------------------------
704
+ //== Badges
705
+ //
706
+ //##
707
+
552
708
  @badge-color: #fff;
709
+ //** Linked badge text color on hover
553
710
  @badge-link-hover-color: #fff;
554
711
  @badge-bg: @gray-light;
555
712
 
713
+ //** Badge text color in active nav link
556
714
  @badge-active-color: @link-color;
715
+ //** Badge background color in active nav link
557
716
  @badge-active-bg: #fff;
558
717
 
559
718
  @badge-font-weight: bold;
@@ -561,16 +720,25 @@
561
720
  @badge-border-radius: 10px;
562
721
 
563
722
 
564
- // Breadcrumbs
565
- // -------------------------
566
- @breadcrumb-bg: #f5f5f5;
567
- @breadcrumb-color: #ccc;
568
- @breadcrumb-active-color: @gray-light;
569
- @breadcrumb-separator: "/";
723
+ //== Breadcrumbs
724
+ //
725
+ //##
726
+
727
+ @breadcrumb-padding-vertical: 8px;
728
+ @breadcrumb-padding-horizontal: 15px;
729
+ //** Breadcrumb background color
730
+ @breadcrumb-bg: #f5f5f5;
731
+ //** Breadcrumb text color
732
+ @breadcrumb-color: #ccc;
733
+ //** Text color of current page in the breadcrumb
734
+ @breadcrumb-active-color: @gray-light;
735
+ //** Textual separator for between breadcrumb elements
736
+ @breadcrumb-separator: "/";
570
737
 
571
738
 
572
- // Carousel
573
- // ------------------------
739
+ //== Carousel
740
+ //
741
+ //##
574
742
 
575
743
  @carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6);
576
744
 
@@ -585,53 +753,75 @@
585
753
  @carousel-caption-color: #fff;
586
754
 
587
755
 
588
- // Close
589
- // ------------------------
756
+ //== Close
757
+ //
758
+ //##
759
+
590
760
  @close-font-weight: bold;
591
761
  @close-color: #000;
592
762
  @close-text-shadow: 0 1px 0 #fff;
593
763
 
594
764
 
595
- // Code
596
- // ------------------------
765
+ //== Code
766
+ //
767
+ //##
768
+
597
769
  @code-color: #c7254e;
598
770
  @code-bg: #f9f2f4;
599
771
 
772
+ @kbd-color: #fff;
773
+ @kbd-bg: #333;
774
+
600
775
  @pre-bg: #f5f5f5;
601
776
  @pre-color: @gray-dark;
602
777
  @pre-border-color: #ccc;
603
778
  @pre-scrollable-max-height: 340px;
604
779
 
605
- // Type
606
- // ------------------------
780
+
781
+ //== Type
782
+ //
783
+ //##
784
+
785
+ //** Text muted color
607
786
  @text-muted: @gray-light;
787
+ //** Abbreviations and acronyms border color
608
788
  @abbr-border-color: @gray-light;
789
+ //** Headings small color
609
790
  @headings-small-color: @gray-light;
791
+ //** Blockquote small color
610
792
  @blockquote-small-color: @gray-light;
793
+ //** Blockquote border color
611
794
  @blockquote-border-color: @gray-lighter;
795
+ //** Page header border color
612
796
  @page-header-border-color: @gray-lighter;
613
797
 
614
- // Miscellaneous
615
- // -------------------------
616
798
 
617
- // Hr border color
799
+ //== Miscellaneous
800
+ //
801
+ //##
802
+
803
+ //** Horizontal line color.
618
804
  @hr-border: @gray-lighter;
619
805
 
620
- // Horizontal forms & lists
806
+ //** Horizontal offset for forms and lists.
621
807
  @component-offset-horizontal: 180px;
622
808
 
623
809
 
624
- // Container sizes
625
- // --------------------------------------------------
810
+ //== Container sizes
811
+ //
812
+ //## Define the maximum width of `.container` for different screen sizes.
626
813
 
627
814
  // Small screen / tablet
628
815
  @container-tablet: ((720px + @grid-gutter-width));
816
+ //** For `@screen-sm-min` and up.
629
817
  @container-sm: @container-tablet;
630
818
 
631
819
  // Medium screen / desktop
632
820
  @container-desktop: ((940px + @grid-gutter-width));
821
+ //** For `@screen-md-min` and up.
633
822
  @container-md: @container-desktop;
634
823
 
635
824
  // Large screen / wide desktop
636
825
  @container-large-desktop: ((1140px + @grid-gutter-width));
826
+ //** For `@screen-lg-min` and up.
637
827
  @container-lg: @container-large-desktop;