Commit 5cfde0d3 authored by Mark Otto's avatar Mark Otto

Merge branch 'master' into derp

Conflicts:
	dist/css/bootstrap-theme.css.map
	dist/css/bootstrap.css
	dist/css/bootstrap.css.map
	dist/css/bootstrap.min.css
	docs/assets/js/customize.min.js
	docs/dist/css/bootstrap-theme.css.map
	docs/dist/css/bootstrap.css
	docs/dist/css/bootstrap.css.map
	docs/dist/css/bootstrap.min.css
	docs/javascript/dropdowns.md
	less/utilities.less
parents f1e77198 fe0ef388
...@@ -154,26 +154,16 @@ license your work under the terms of the [MIT License](LICENSE.md). ...@@ -154,26 +154,16 @@ license your work under the terms of the [MIT License](LICENSE.md).
### HTML ### HTML
- Two spaces for indentation, never tabs. [Adhere to the Code Guide.](http://codeguide.co/#html)
- Double quotes only, never single quotes.
- Always use proper indentation.
- Use tags and elements appropriate for an HTML5 doctype (e.g., self-closing tags). - Use tags and elements appropriate for an HTML5 doctype (e.g., self-closing tags).
- Use CDNs and HTTPS for third-party JS when possible. We don't use protocol-relative URLs in this case because they break when viewing the page locally via `file://`. - Use CDNs and HTTPS for third-party JS when possible. We don't use protocol-relative URLs in this case because they break when viewing the page locally via `file://`.
- Use [WAI-ARIA](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA) attributes in documentation examples to promote accessibility. - Use [WAI-ARIA](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA) attributes in documentation examples to promote accessibility.
### CSS ### CSS
- CSS changes must be done in `.less` files first, never just in the compiled `.css` files. [Adhere to the Code Guide.](http://codeguide.co/#css)
- Adhere to the [CSS property order](http://markdotto.com/2011/11/29/css-property-order/).
- Multiple-line approach (one property and value per line).
- Always a space after a property's colon (e.g., `display: block;` and not `display:block;`).
- End all lines with a semi-colon.
- For multiple, comma-separated selectors, place each selector on its own line.
- Don't add vendor prefixed properties to their unprefixed counterparts (e.g., only `box-sizing` and not also include `-webkit-box-sizing`), as this is done automagically at build time.
- Attribute selectors, like `input[type="text"]` should always wrap the attribute's value in double quotes, for consistency and safety (see this [blog post on unquoted attribute values](http://mathiasbynens.be/notes/unquoted-attribute-values) that can lead to XSS attacks).
- Attribute selectors should only be used where absolutely necessary (e.g., form controls) and should be avoided on custom components for performance and explicitness.
- Series of classes for a component should include a base class (e.g., `.component`) and use the base class as a prefix for modifier and sub-components (e.g., `.component-lg`).
- Avoid inheritance and over nesting—use single, explicit classes whenever possible.
- When feasible, default color palettes should comply with [WCAG color contrast guidelines](http://www.w3.org/TR/WCAG20/#visual-audio-contrast). - When feasible, default color palettes should comply with [WCAG color contrast guidelines](http://www.w3.org/TR/WCAG20/#visual-audio-contrast).
- Except in rare cases, don't remove default `:focus` styles (via e.g. `outline: none;`) without providing alternative styles. See [this A11Y Project post](http://a11yproject.com/posts/never-remove-css-outlines/) for more details. - Except in rare cases, don't remove default `:focus` styles (via e.g. `outline: none;`) without providing alternative styles. See [this A11Y Project post](http://a11yproject.com/posts/never-remove-css-outlines/) for more details.
......
...@@ -1404,6 +1404,12 @@ pre code { ...@@ -1404,6 +1404,12 @@ pre code {
table { table {
background-color: transparent; background-color: transparent;
} }
caption {
padding-top: .6rem;
padding-bottom: .6rem;
color: #818a91;
text-align: left;
}
th { th {
text-align: left; text-align: left;
} }
...@@ -1716,16 +1722,16 @@ output { ...@@ -1716,16 +1722,16 @@ output {
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
} }
.form-control::-webkit-input-placeholder { .form-control::-webkit-input-placeholder {
color: #818a91; color: #999;
} }
.form-control::-moz-placeholder { .form-control::-moz-placeholder {
color: #818a91; color: #999;
} }
.form-control:-ms-input-placeholder { .form-control:-ms-input-placeholder {
color: #818a91; color: #999;
} }
.form-control::placeholder { .form-control::placeholder {
color: #818a91; color: #999;
} }
.form-control[disabled], .form-control[disabled],
.form-control[readonly], .form-control[readonly],
...@@ -1889,6 +1895,7 @@ select[multiple].form-group-lg .form-control { ...@@ -1889,6 +1895,7 @@ select[multiple].form-group-lg .form-control {
height: 2.7rem; height: 2.7rem;
line-height: 2.7rem; line-height: 2.7rem;
text-align: center; text-align: center;
pointer-events: none;
} }
.input-lg + .form-control-feedback { .input-lg + .form-control-feedback {
width: 3.3625rem; width: 3.3625rem;
...@@ -5028,8 +5035,6 @@ button.close { ...@@ -5028,8 +5035,6 @@ button.close {
} }
.affix { .affix {
position: fixed; position: fixed;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
} }
@-ms-viewport { @-ms-viewport {
width: device-width; width: device-width;
......
This diff was suppressed by a .gitattributes entry.
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -408,7 +408,7 @@ ...@@ -408,7 +408,7 @@
</div> </div>
<div class="bs-customizer-input"> <div class="bs-customizer-input">
<label for="input-@input-color-placeholder">@input-color-placeholder</label> <label for="input-@input-color-placeholder">@input-color-placeholder</label>
<input id="input-@input-color-placeholder" type="text" value="@gray-light" data-var="@input-color-placeholder" class="form-control"/> <input id="input-@input-color-placeholder" type="text" value="#999" data-var="@input-color-placeholder" class="form-control"/>
<p class="help-block">Placeholder text color</p> <p class="help-block">Placeholder text color</p>
</div> </div>
<div class="bs-customizer-input"> <div class="bs-customizer-input">
......
This diff is collapsed.
This diff is collapsed.
...@@ -1404,6 +1404,12 @@ pre code { ...@@ -1404,6 +1404,12 @@ pre code {
table { table {
background-color: transparent; background-color: transparent;
} }
caption {
padding-top: .6rem;
padding-bottom: .6rem;
color: #818a91;
text-align: left;
}
th { th {
text-align: left; text-align: left;
} }
...@@ -1716,16 +1722,16 @@ output { ...@@ -1716,16 +1722,16 @@ output {
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
} }
.form-control::-webkit-input-placeholder { .form-control::-webkit-input-placeholder {
color: #818a91; color: #999;
} }
.form-control::-moz-placeholder { .form-control::-moz-placeholder {
color: #818a91; color: #999;
} }
.form-control:-ms-input-placeholder { .form-control:-ms-input-placeholder {
color: #818a91; color: #999;
} }
.form-control::placeholder { .form-control::placeholder {
color: #818a91; color: #999;
} }
.form-control[disabled], .form-control[disabled],
.form-control[readonly], .form-control[readonly],
...@@ -1889,6 +1895,7 @@ select[multiple].form-group-lg .form-control { ...@@ -1889,6 +1895,7 @@ select[multiple].form-group-lg .form-control {
height: 2.7rem; height: 2.7rem;
line-height: 2.7rem; line-height: 2.7rem;
text-align: center; text-align: center;
pointer-events: none;
} }
.input-lg + .form-control-feedback { .input-lg + .form-control-feedback {
width: 3.3625rem; width: 3.3625rem;
...@@ -5028,8 +5035,6 @@ button.close { ...@@ -5028,8 +5035,6 @@ button.close {
} }
.affix { .affix {
position: fixed; position: fixed;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
} }
@-ms-viewport { @-ms-viewport {
width: device-width; width: device-width;
......
This diff was suppressed by a .gitattributes entry.
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -25,7 +25,9 @@ title: Dropdowns ...@@ -25,7 +25,9 @@ title: Dropdowns
<div class="collapse navbar-collapse bs-example-js-navbar-collapse"> <div class="collapse navbar-collapse bs-example-js-navbar-collapse">
<ul class="nav navbar-nav"> <ul class="nav navbar-nav">
<li class="dropdown"> <li class="dropdown">
<a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a> <button id="drop1" type="button" class="dropdown-toggle" data-toggle="dropdown">
Dropdown
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="drop1"> <ul class="dropdown-menu" role="menu" aria-labelledby="drop1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
...@@ -35,7 +37,9 @@ title: Dropdowns ...@@ -35,7 +37,9 @@ title: Dropdowns
</ul> </ul>
</li> </li>
<li class="dropdown"> <li class="dropdown">
<a href="#" id="drop2" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 2</a> <button id="drop2" type="button" class="dropdown-toggle" data-toggle="dropdown">
Dropdown 2
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="drop2"> <ul class="dropdown-menu" role="menu" aria-labelledby="drop2">
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
...@@ -47,7 +51,9 @@ title: Dropdowns ...@@ -47,7 +51,9 @@ title: Dropdowns
</ul> </ul>
<ul class="nav navbar-nav navbar-right"> <ul class="nav navbar-nav navbar-right">
<li id="fat-menu" class="dropdown"> <li id="fat-menu" class="dropdown">
<a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 3</a> <button id="drop3" type="button" class="dropdown-toggle" data-toggle="dropdown">
Dropdown 3
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="drop3"> <ul class="dropdown-menu" role="menu" aria-labelledby="drop3">
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
...@@ -67,7 +73,9 @@ title: Dropdowns ...@@ -67,7 +73,9 @@ title: Dropdowns
<ul class="nav nav-pills" role="tablist"> <ul class="nav nav-pills" role="tablist">
<li role="presentation" class="active"><a href="#">Regular link</a></li> <li role="presentation" class="active"><a href="#">Regular link</a></li>
<li role="presentation" class="dropdown"> <li role="presentation" class="dropdown">
<a id="drop4" role="button" data-toggle="dropdown" href="#">Dropdown</a> <button id="drop4" type="button" data-toggle="dropdown">
Dropdown
</button>
<ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop4"> <ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop4">
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
...@@ -77,7 +85,9 @@ title: Dropdowns ...@@ -77,7 +85,9 @@ title: Dropdowns
</ul> </ul>
</li> </li>
<li role="presentation" class="dropdown"> <li role="presentation" class="dropdown">
<a id="drop5" role="button" data-toggle="dropdown" href="#">Dropdown 2</a> <button id="drop5" type="button" data-toggle="dropdown">
Dropdown 2
</button>
<ul id="menu2" class="dropdown-menu" role="menu" aria-labelledby="drop5"> <ul id="menu2" class="dropdown-menu" role="menu" aria-labelledby="drop5">
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
...@@ -87,7 +97,9 @@ title: Dropdowns ...@@ -87,7 +97,9 @@ title: Dropdowns
</ul> </ul>
</li> </li>
<li role="presentation" class="dropdown"> <li role="presentation" class="dropdown">
<a id="drop6" role="button" data-toggle="dropdown" href="#">Dropdown 3</a> <button id="drop6" type="button" data-toggle="dropdown">
Dropdown 3
</button>
<ul id="menu3" class="dropdown-menu" role="menu" aria-labelledby="drop6"> <ul id="menu3" class="dropdown-menu" role="menu" aria-labelledby="drop6">
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
...@@ -109,7 +121,10 @@ title: Dropdowns ...@@ -109,7 +121,10 @@ title: Dropdowns
<p>Add <code>data-toggle="dropdown"</code> to a link or button to toggle a dropdown.</p> <p>Add <code>data-toggle="dropdown"</code> to a link or button to toggle a dropdown.</p>
{% highlight html %} {% highlight html %}
<div class="dropdown"> <div class="dropdown">
<a id="dLabel" role="button" data-toggle="dropdown" href="#">Dropdown trigger</a> <button id="dLabel" type="button" data-toggle="dropdown">
Dropdown trigger
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"> <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
... ...
</ul> </ul>
...@@ -118,9 +133,9 @@ title: Dropdowns ...@@ -118,9 +133,9 @@ title: Dropdowns
<p>To keep URLs intact, use the <code>data-target</code> attribute instead of <code>href="#"</code>.</p> <p>To keep URLs intact, use the <code>data-target</code> attribute instead of <code>href="#"</code>.</p>
{% highlight html %} {% highlight html %}
<div class="dropdown"> <div class="dropdown">
<a id="dLabel" role="button" data-toggle="dropdown" data-target="#" href="/page.html"> <button id="dLabel" type="button" data-toggle="dropdown">Dropdown trigger</button>
Dropdown Dropdown
</a> </button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"> <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
... ...
......
...@@ -344,6 +344,7 @@ input[type="checkbox"] { ...@@ -344,6 +344,7 @@ input[type="checkbox"] {
height: @input-height-base; height: @input-height-base;
line-height: @input-height-base; line-height: @input-height-base;
text-align: center; text-align: center;
pointer-events: none;
} }
.input-lg + .form-control-feedback { .input-lg + .form-control-feedback {
width: @input-height-large; width: @input-height-large;
......
...@@ -6,6 +6,12 @@ ...@@ -6,6 +6,12 @@
table { table {
background-color: @table-bg; background-color: @table-bg;
} }
caption {
padding-top: @table-cell-padding;
padding-bottom: @table-cell-padding;
color: @text-muted;
text-align: left;
}
th { th {
text-align: left; text-align: left;
} }
......
...@@ -49,5 +49,4 @@ ...@@ -49,5 +49,4 @@
.affix { .affix {
position: fixed; position: fixed;
transform: translate3d(0, 0, 0);
} }
...@@ -190,7 +190,7 @@ ...@@ -190,7 +190,7 @@
@input-box-shadow-focus: rgba(102,175,233,.6); @input-box-shadow-focus: rgba(102,175,233,.6);
//** Placeholder text color //** Placeholder text color
@input-color-placeholder: @gray-light; @input-color-placeholder: #999;
//** Default `.form-control` height //** Default `.form-control` height
@input-height-base: ((@font-size-base * @line-height-base) + (@padding-base-vertical * 2) + .2); @input-height-base: ((@font-size-base * @line-height-base) + (@padding-base-vertical * 2) + .2);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment