bootstrap-generators 3.0.2.2 → 3.1.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 (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
@@ -22,7 +22,12 @@
22
22
  right: 0;
23
23
  bottom: 0;
24
24
  left: 0;
25
- z-index: $zindex-modal-background;
25
+ z-index: $zindex-modal;
26
+ -webkit-overflow-scrolling: touch;
27
+
28
+ // Prevent Chrome on Windows from adding a focus outline. For details, see
29
+ // https://github.com/twbs/bootstrap/pull/10951.
30
+ outline: 0;
26
31
 
27
32
  // When fading in the modal, animate it to slide down
28
33
  &.fade .modal-dialog {
@@ -35,11 +40,8 @@
35
40
  // Shell div to position the modal with bottom padding
36
41
  .modal-dialog {
37
42
  position: relative;
38
- margin-left: auto;
39
- margin-right: auto;
40
43
  width: auto;
41
- padding: 10px;
42
- z-index: ($zindex-modal-background + 10);
44
+ margin: 10px;
43
45
  }
44
46
 
45
47
  // Actual modal
@@ -62,11 +64,11 @@
62
64
  right: 0;
63
65
  bottom: 0;
64
66
  left: 0;
65
- z-index: ($zindex-modal-background - 10);
67
+ z-index: $zindex-modal-background;
66
68
  background-color: $modal-backdrop-bg;
67
69
  // Fade for backdrop
68
70
  &.fade { @include opacity(0); }
69
- &.in { @include opacity(.5); }
71
+ &.in { @include opacity($modal-backdrop-opacity); }
70
72
  }
71
73
 
72
74
  // Modal header
@@ -118,15 +120,19 @@
118
120
  }
119
121
 
120
122
  // Scale up the modal
121
- @media screen and (min-width: $screen-sm-min) {
123
+ @media (min-width: $screen-sm-min) {
122
124
 
125
+ // Automatically set modal's width for larger viewports
123
126
  .modal-dialog {
124
- width: 600px;
125
- padding-top: 30px;
126
- padding-bottom: 30px;
127
+ width: $modal-md;
128
+ margin: 30px auto;
127
129
  }
128
130
  .modal-content {
129
131
  @include box-shadow(0 5px 15px rgba(0,0,0,.5));
130
132
  }
131
133
 
134
+ // Modal sizes
135
+ .modal-sm { width: $modal-sm; }
136
+ .modal-lg { width: $modal-lg; }
137
+
132
138
  }
@@ -48,7 +48,7 @@
48
48
  // content for the user's viewport.
49
49
 
50
50
  .navbar-collapse {
51
- max-height: 340px;
51
+ max-height: $navbar-collapse-max-height;
52
52
  overflow-x: visible;
53
53
  padding-right: $navbar-padding-horizontal;
54
54
  padding-left: $navbar-padding-horizontal;
@@ -74,18 +74,16 @@
74
74
  }
75
75
 
76
76
  &.in {
77
- overflow-y: auto;
77
+ overflow-y: visible;
78
78
  }
79
79
 
80
- // Account for first and last children spacing
81
- .navbar-nav.navbar-left:first-child {
82
- margin-left: -$navbar-padding-horizontal;
83
- }
84
- .navbar-nav.navbar-right:last-child {
85
- margin-right: -$navbar-padding-horizontal;
86
- }
87
- .navbar-text:last-child {
88
- margin-right: 0;
80
+ // Undo the collapse side padding for navbars with containers to ensure
81
+ // alignment of right-aligned contents.
82
+ .navbar-fixed-top &,
83
+ .navbar-static-top &,
84
+ .navbar-fixed-bottom & {
85
+ padding-left: 0;
86
+ padding-right: 0;
89
87
  }
90
88
  }
91
89
  }
@@ -95,14 +93,17 @@
95
93
  //
96
94
  // When a container is present, change the behavior of the header and collapse.
97
95
 
98
- .container > .navbar-header,
99
- .container > .navbar-collapse {
100
- margin-right: -$navbar-padding-horizontal;
101
- margin-left: -$navbar-padding-horizontal;
96
+ .container,
97
+ .container-fluid {
98
+ > .navbar-header,
99
+ > .navbar-collapse {
100
+ margin-right: -$navbar-padding-horizontal;
101
+ margin-left: -$navbar-padding-horizontal;
102
102
 
103
- @media (min-width: $grid-float-breakpoint) {
104
- margin-right: 0;
105
- margin-left: 0;
103
+ @media (min-width: $grid-float-breakpoint) {
104
+ margin-right: 0;
105
+ margin-left: 0;
106
+ }
106
107
  }
107
108
  }
108
109
 
@@ -154,6 +155,7 @@
154
155
  padding: $navbar-padding-vertical $navbar-padding-horizontal;
155
156
  font-size: $font-size-large;
156
157
  line-height: $line-height-computed;
158
+ height: $line-height-computed;
157
159
 
158
160
  &:hover,
159
161
  &:focus {
@@ -161,7 +163,8 @@
161
163
  }
162
164
 
163
165
  @media (min-width: $grid-float-breakpoint) {
164
- .navbar > .container & {
166
+ .navbar > .container &,
167
+ .navbar > .container-fluid & {
165
168
  margin-left: -$navbar-padding-horizontal;
166
169
  }
167
170
  }
@@ -180,9 +183,16 @@
180
183
  padding: 9px 10px;
181
184
  @include navbar-vertical-align(34px);
182
185
  background-color: transparent;
186
+ background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
183
187
  border: 1px solid transparent;
184
188
  border-radius: $border-radius-base;
185
189
 
190
+ // We remove the `outline` here, but later compensate by attaching `:hover`
191
+ // styles to `:focus`.
192
+ &:focus {
193
+ outline: none;
194
+ }
195
+
186
196
  // Bars
187
197
  .icon-bar {
188
198
  display: block;
@@ -202,7 +212,7 @@
202
212
 
203
213
  // Navbar nav links
204
214
  //
205
- // Builds on top of the `.nav` components with it's own modifier class to make
215
+ // Builds on top of the `.nav` components with its own modifier class to make
206
216
  // the nav the full height of the horizontal nav (above 768px).
207
217
 
208
218
  .navbar-nav {
@@ -214,7 +224,7 @@
214
224
  line-height: $line-height-computed;
215
225
  }
216
226
 
217
- @media (max-width: $screen-xs-max) {
227
+ @media (max-width: $grid-float-breakpoint-max) {
218
228
  // Dropdowns get custom display when collapsed
219
229
  .open .dropdown-menu {
220
230
  position: static;
@@ -246,12 +256,15 @@
246
256
  > li {
247
257
  float: left;
248
258
  > a {
249
- padding-top: (($navbar-height - $line-height-computed) / 2);
250
- padding-bottom: (($navbar-height - $line-height-computed) / 2);
259
+ padding-top: $navbar-padding-vertical;
260
+ padding-bottom: $navbar-padding-vertical;
251
261
  }
252
262
  }
253
- }
254
263
 
264
+ &.navbar-right:last-child {
265
+ margin-right: -$navbar-padding-horizontal;
266
+ }
267
+ }
255
268
  }
256
269
 
257
270
 
@@ -289,7 +302,7 @@
289
302
  @extend .form-inline;
290
303
 
291
304
  .form-group {
292
- @media (max-width: $screen-xs-max) {
305
+ @media (max-width: $grid-float-breakpoint-max) {
293
306
  margin-bottom: 5px;
294
307
  }
295
308
  }
@@ -306,6 +319,11 @@
306
319
  padding-top: 0;
307
320
  padding-bottom: 0;
308
321
  @include box-shadow(none);
322
+
323
+ // Outdent the form if last child to line up with content down the page
324
+ &.navbar-right:last-child {
325
+ margin-right: -$navbar-padding-horizontal;
326
+ }
309
327
  }
310
328
  }
311
329
 
@@ -322,13 +340,6 @@
322
340
  @include border-bottom-radius(0);
323
341
  }
324
342
 
325
- // Right aligned menus need alt position
326
- .navbar-nav.pull-right > li > .dropdown-menu,
327
- .navbar-nav > li > .dropdown-menu.pull-right {
328
- left: auto;
329
- right: 0;
330
- }
331
-
332
343
 
333
344
  // Buttons in navbars
334
345
  //
@@ -336,6 +347,13 @@
336
347
 
337
348
  .navbar-btn {
338
349
  @include navbar-vertical-align($input-height-base);
350
+
351
+ &.btn-sm {
352
+ @include navbar-vertical-align($input-height-small);
353
+ }
354
+ &.btn-xs {
355
+ @include navbar-vertical-align(22);
356
+ }
339
357
  }
340
358
 
341
359
 
@@ -344,12 +362,17 @@
344
362
  // Add a class to make any element properly align itself vertically within the navbars.
345
363
 
346
364
  .navbar-text {
347
- float: left;
348
365
  @include navbar-vertical-align($line-height-computed);
349
366
 
350
367
  @media (min-width: $grid-float-breakpoint) {
368
+ float: left;
351
369
  margin-left: $navbar-padding-horizontal;
352
370
  margin-right: $navbar-padding-horizontal;
371
+
372
+ // Outdent the form if last child to line up with content down the page
373
+ &.navbar-right:last-child {
374
+ margin-right: 0;
375
+ }
353
376
  }
354
377
  }
355
378
 
@@ -418,15 +441,8 @@
418
441
  border-color: $navbar-default-border;
419
442
  }
420
443
 
421
- // Dropdown menu items and carets
444
+ // Dropdown menu items
422
445
  .navbar-nav {
423
- // Caret should match text color on hover
424
- > .dropdown > a:hover .caret,
425
- > .dropdown > a:focus .caret {
426
- border-top-color: $navbar-default-link-hover-color;
427
- border-bottom-color: $navbar-default-link-hover-color;
428
- }
429
-
430
446
  // Remove background color from open dropdown
431
447
  > .open > a {
432
448
  &,
@@ -434,19 +450,10 @@
434
450
  &:focus {
435
451
  background-color: $navbar-default-link-active-bg;
436
452
  color: $navbar-default-link-active-color;
437
- .caret {
438
- border-top-color: $navbar-default-link-active-color;
439
- border-bottom-color: $navbar-default-link-active-color;
440
- }
441
453
  }
442
454
  }
443
- > .dropdown > a .caret {
444
- border-top-color: $navbar-default-link-color;
445
- border-bottom-color: $navbar-default-link-color;
446
- }
447
455
 
448
-
449
- @media (max-width: $screen-xs-max) {
456
+ @media (max-width: $grid-float-breakpoint-max) {
450
457
  // Dropdowns get custom display when collapsed
451
458
  .open .dropdown-menu {
452
459
  > li > a {
@@ -565,31 +572,16 @@
565
572
  color: $navbar-inverse-link-active-color;
566
573
  }
567
574
  }
568
- > .dropdown > a:hover .caret {
569
- border-top-color: $navbar-inverse-link-hover-color;
570
- border-bottom-color: $navbar-inverse-link-hover-color;
571
- }
572
- > .dropdown > a .caret {
573
- border-top-color: $navbar-inverse-link-color;
574
- border-bottom-color: $navbar-inverse-link-color;
575
- }
576
- > .open > a {
577
- &,
578
- &:hover,
579
- &:focus {
580
- .caret {
581
- border-top-color: $navbar-inverse-link-active-color;
582
- border-bottom-color: $navbar-inverse-link-active-color;
583
- }
584
- }
585
- }
586
575
 
587
- @media (max-width: $screen-xs-max) {
576
+ @media (max-width: $grid-float-breakpoint-max) {
588
577
  // Dropdowns get custom display
589
578
  .open .dropdown-menu {
590
579
  > .dropdown-header {
591
580
  border-color: $navbar-inverse-border;
592
581
  }
582
+ .divider {
583
+ background-color: $navbar-inverse-border;
584
+ }
593
585
  > li > a {
594
586
  color: $navbar-inverse-link-color;
595
587
  &:hover,
@@ -48,11 +48,6 @@
48
48
  &:focus {
49
49
  background-color: $nav-link-hover-bg;
50
50
  border-color: $link-color;
51
-
52
- .caret {
53
- border-top-color: $link-hover-color;
54
- border-bottom-color: $link-hover-color;
55
- }
56
51
  }
57
52
  }
58
53
 
@@ -96,7 +91,7 @@
96
91
  }
97
92
  }
98
93
 
99
- // Active state, and it's :hover to override normal :hover
94
+ // Active state, and its :hover to override normal :hover
100
95
  &.active > a {
101
96
  &,
102
97
  &:hover,
@@ -138,11 +133,6 @@
138
133
  &:focus {
139
134
  color: $nav-pills-active-link-hover-color;
140
135
  background-color: $nav-pills-active-link-hover-bg;
141
-
142
- .caret {
143
- border-top-color: $nav-pills-active-link-hover-color;
144
- border-bottom-color: $nav-pills-active-link-hover-color;
145
- }
146
136
  }
147
137
  }
148
138
  }
@@ -243,16 +233,6 @@
243
233
  // Dropdowns
244
234
  // -------------------------
245
235
 
246
- // Make dropdown carets use link color in navs
247
- .nav .caret {
248
- border-top-color: $link-color;
249
- border-bottom-color: $link-color;
250
- }
251
- .nav a:hover .caret {
252
- border-top-color: $link-hover-color;
253
- border-bottom-color: $link-hover-color;
254
- }
255
-
256
236
  // Specific dropdowns
257
237
  .nav-tabs .dropdown-menu {
258
238
  // make dropdown border overlap tab border
@@ -1,6 +1,25 @@
1
- /*! normalize.css v2.1.3 | MIT License | git.io/normalize */
1
+ /*! normalize.css v3.0.0 | MIT License | git.io/normalize */
2
+
3
+ //
4
+ // 1. Set default font family to sans-serif.
5
+ // 2. Prevent iOS text size adjust after orientation change, without disabling
6
+ // user zoom.
7
+ //
8
+
9
+ html {
10
+ font-family: sans-serif; // 1
11
+ -ms-text-size-adjust: 100%; // 2
12
+ -webkit-text-size-adjust: 100%; // 2
13
+ }
14
+
15
+ //
16
+ // Remove default margin.
17
+ //
18
+
19
+ body {
20
+ margin: 0;
21
+ }
2
22
 
3
- // ==========================================================================
4
23
  // HTML5 display definitions
5
24
  // ==========================================================================
6
25
 
@@ -24,13 +43,16 @@ summary {
24
43
  }
25
44
 
26
45
  //
27
- // Correct `inline-block` display not defined in IE 8/9.
46
+ // 1. Correct `inline-block` display not defined in IE 8/9.
47
+ // 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
28
48
  //
29
49
 
30
50
  audio,
31
51
  canvas,
52
+ progress,
32
53
  video {
33
- display: inline-block;
54
+ display: inline-block; // 1
55
+ vertical-align: baseline; // 2
34
56
  }
35
57
 
36
58
  //
@@ -53,31 +75,6 @@ template {
53
75
  display: none;
54
76
  }
55
77
 
56
- // ==========================================================================
57
- // Base
58
- // ==========================================================================
59
-
60
- //
61
- // 1. Set default font family to sans-serif.
62
- // 2. Prevent iOS text size adjust after orientation change, without disabling
63
- // user zoom.
64
- //
65
-
66
- html {
67
- font-family: sans-serif; // 1
68
- -ms-text-size-adjust: 100%; // 2
69
- -webkit-text-size-adjust: 100%; // 2
70
- }
71
-
72
- //
73
- // Remove default margin.
74
- //
75
-
76
- body {
77
- margin: 0;
78
- }
79
-
80
- // ==========================================================================
81
78
  // Links
82
79
  // ==========================================================================
83
80
 
@@ -89,14 +86,6 @@ a {
89
86
  background: transparent;
90
87
  }
91
88
 
92
- //
93
- // Address `outline` inconsistency between Chrome and other browsers.
94
- //
95
-
96
- a:focus {
97
- outline: thin dotted;
98
- }
99
-
100
89
  //
101
90
  // Improve readability when focused and also mouse hovered in all browsers.
102
91
  //
@@ -106,19 +95,8 @@ a:hover {
106
95
  outline: 0;
107
96
  }
108
97
 
98
+ // Text-level semantics
109
99
  // ==========================================================================
110
- // Typography
111
- // ==========================================================================
112
-
113
- //
114
- // Address variable `h1` font-size and margin within `section` and `article`
115
- // contexts in Firefox 4+, Safari 5, and Chrome.
116
- //
117
-
118
- h1 {
119
- font-size: 2em;
120
- margin: 0.67em 0;
121
- }
122
100
 
123
101
  //
124
102
  // Address styling not present in IE 8/9, Safari 5, and Chrome.
@@ -146,13 +124,13 @@ dfn {
146
124
  }
147
125
 
148
126
  //
149
- // Address differences between Firefox and other browsers.
127
+ // Address variable `h1` font-size and margin within `section` and `article`
128
+ // contexts in Firefox 4+, Safari 5, and Chrome.
150
129
  //
151
130
 
152
- hr {
153
- -moz-box-sizing: content-box;
154
- box-sizing: content-box;
155
- height: 0;
131
+ h1 {
132
+ font-size: 2em;
133
+ margin: 0.67em 0;
156
134
  }
157
135
 
158
136
  //
@@ -164,34 +142,6 @@ mark {
164
142
  color: #000;
165
143
  }
166
144
 
167
- //
168
- // Correct font family set oddly in Safari 5 and Chrome.
169
- //
170
-
171
- code,
172
- kbd,
173
- pre,
174
- samp {
175
- font-family: monospace, serif;
176
- font-size: 1em;
177
- }
178
-
179
- //
180
- // Improve readability of pre-formatted text in all browsers.
181
- //
182
-
183
- pre {
184
- white-space: pre-wrap;
185
- }
186
-
187
- //
188
- // Set consistent quote types.
189
- //
190
-
191
- q {
192
- quotes: "\201C" "\201D" "\2018" "\2019";
193
- }
194
-
195
145
  //
196
146
  // Address inconsistent and variable font size in all browsers.
197
147
  //
@@ -220,7 +170,6 @@ sub {
220
170
  bottom: -0.25em;
221
171
  }
222
172
 
223
- // ==========================================================================
224
173
  // Embedded content
225
174
  // ==========================================================================
226
175
 
@@ -240,8 +189,7 @@ svg:not(:root) {
240
189
  overflow: hidden;
241
190
  }
242
191
 
243
- // ==========================================================================
244
- // Figures
192
+ // Grouping content
245
193
  // ==========================================================================
246
194
 
247
195
  //
@@ -249,63 +197,77 @@ svg:not(:root) {
249
197
  //
250
198
 
251
199
  figure {
252
- margin: 0;
200
+ margin: 1em 40px;
253
201
  }
254
202
 
255
- // ==========================================================================
256
- // Forms
257
- // ==========================================================================
203
+ //
204
+ // Address differences between Firefox and other browsers.
205
+ //
206
+
207
+ hr {
208
+ -moz-box-sizing: content-box;
209
+ box-sizing: content-box;
210
+ height: 0;
211
+ }
258
212
 
259
213
  //
260
- // Define consistent border, margin, and padding.
214
+ // Contain overflow in all browsers.
261
215
  //
262
216
 
263
- fieldset {
264
- border: 1px solid #c0c0c0;
265
- margin: 0 2px;
266
- padding: 0.35em 0.625em 0.75em;
217
+ pre {
218
+ overflow: auto;
267
219
  }
268
220
 
269
221
  //
270
- // 1. Correct `color` not being inherited in IE 8/9.
271
- // 2. Remove padding so people aren't caught out if they zero out fieldsets.
222
+ // Address odd `em`-unit font size rendering in all browsers.
272
223
  //
273
224
 
274
- legend {
275
- border: 0; // 1
276
- padding: 0; // 2
225
+ code,
226
+ kbd,
227
+ pre,
228
+ samp {
229
+ font-family: monospace, monospace;
230
+ font-size: 1em;
277
231
  }
278
232
 
233
+ // Forms
234
+ // ==========================================================================
235
+
236
+ //
237
+ // Known limitation: by default, Chrome and Safari on OS X allow very limited
238
+ // styling of `select`, unless a `border` property is set.
239
+ //
240
+
279
241
  //
280
- // 1. Correct font family not being inherited in all browsers.
281
- // 2. Correct font size not being inherited in all browsers.
242
+ // 1. Correct color not being inherited.
243
+ // Known issue: affects color of disabled elements.
244
+ // 2. Correct font properties not being inherited.
282
245
  // 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
283
246
  //
284
247
 
285
248
  button,
286
249
  input,
250
+ optgroup,
287
251
  select,
288
252
  textarea {
289
- font-family: inherit; // 1
290
- font-size: 100%; // 2
253
+ color: inherit; // 1
254
+ font: inherit; // 2
291
255
  margin: 0; // 3
292
256
  }
293
257
 
294
258
  //
295
- // Address Firefox 4+ setting `line-height` on `input` using `!important` in
296
- // the UA stylesheet.
259
+ // Address `overflow` set to `hidden` in IE 8/9/10.
297
260
  //
298
261
 
299
- button,
300
- input {
301
- line-height: normal;
262
+ button {
263
+ overflow: visible;
302
264
  }
303
265
 
304
266
  //
305
267
  // Address inconsistent `text-transform` inheritance for `button` and `select`.
306
268
  // All other form control elements do not inherit `text-transform` values.
307
- // Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
308
- // Correct `select` style inheritance in Firefox 4+ and Opera.
269
+ // Correct `button` style inheritance in Firefox, IE 8+, and Opera
270
+ // Correct `select` style inheritance in Firefox.
309
271
  //
310
272
 
311
273
  button,
@@ -338,6 +300,28 @@ html input[disabled] {
338
300
  cursor: default;
339
301
  }
340
302
 
303
+ //
304
+ // Remove inner padding and border in Firefox 4+.
305
+ //
306
+
307
+ button::-moz-focus-inner,
308
+ input::-moz-focus-inner {
309
+ border: 0;
310
+ padding: 0;
311
+ }
312
+
313
+ //
314
+ // Address Firefox 4+ setting `line-height` on `input` using `!important` in
315
+ // the UA stylesheet.
316
+ //
317
+
318
+ input {
319
+ line-height: normal;
320
+ }
321
+
322
+ //
323
+ // It's recommended that you don't attempt to style these elements.
324
+ // Firefox's implementation doesn't respect box-sizing, padding, or width.
341
325
  //
342
326
  // 1. Address box sizing set to `content-box` in IE 8/9/10.
343
327
  // 2. Remove excess padding in IE 8/9/10.
@@ -349,6 +333,17 @@ input[type="radio"] {
349
333
  padding: 0; // 2
350
334
  }
351
335
 
336
+ //
337
+ // Fix the cursor style for Chrome's increment/decrement buttons. For certain
338
+ // `font-size` values of the `input`, it causes the cursor style of the
339
+ // decrement button to change from `default` to `text`.
340
+ //
341
+
342
+ input[type="number"]::-webkit-inner-spin-button,
343
+ input[type="number"]::-webkit-outer-spin-button {
344
+ height: auto;
345
+ }
346
+
352
347
  //
353
348
  // 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
354
349
  // 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
@@ -363,8 +358,9 @@ input[type="search"] {
363
358
  }
364
359
 
365
360
  //
366
- // Remove inner padding and search cancel button in Safari 5 and Chrome
367
- // on OS X.
361
+ // Remove inner padding and search cancel button in Safari and Chrome on OS X.
362
+ // Safari (but not Chrome) clips the cancel button when the search input has
363
+ // padding (and `textfield` appearance).
368
364
  //
369
365
 
370
366
  input[type="search"]::-webkit-search-cancel-button,
@@ -373,26 +369,42 @@ input[type="search"]::-webkit-search-decoration {
373
369
  }
374
370
 
375
371
  //
376
- // Remove inner padding and border in Firefox 4+.
372
+ // Define consistent border, margin, and padding.
377
373
  //
378
374
 
379
- button::-moz-focus-inner,
380
- input::-moz-focus-inner {
381
- border: 0;
382
- padding: 0;
375
+ fieldset {
376
+ border: 1px solid #c0c0c0;
377
+ margin: 0 2px;
378
+ padding: 0.35em 0.625em 0.75em;
383
379
  }
384
380
 
385
381
  //
386
- // 1. Remove default vertical scrollbar in IE 8/9.
387
- // 2. Improve readability and alignment in all browsers.
382
+ // 1. Correct `color` not being inherited in IE 8/9.
383
+ // 2. Remove padding so people aren't caught out if they zero out fieldsets.
384
+ //
385
+
386
+ legend {
387
+ border: 0; // 1
388
+ padding: 0; // 2
389
+ }
390
+
391
+ //
392
+ // Remove default vertical scrollbar in IE 8/9.
388
393
  //
389
394
 
390
395
  textarea {
391
- overflow: auto; // 1
392
- vertical-align: top; // 2
396
+ overflow: auto;
397
+ }
398
+
399
+ //
400
+ // Don't inherit the `font-weight` (applied by a rule above).
401
+ // NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
402
+ //
403
+
404
+ optgroup {
405
+ font-weight: bold;
393
406
  }
394
407
 
395
- // ==========================================================================
396
408
  // Tables
397
409
  // ==========================================================================
398
410
 
@@ -404,3 +416,8 @@ table {
404
416
  border-collapse: collapse;
405
417
  border-spacing: 0;
406
418
  }
419
+
420
+ td,
421
+ th {
422
+ padding: 0;
423
+ }