Merge branch '2.2.2-wip' into exploratory

Conflicts:
	docs/assets/css/bootstrap.css
	less/buttons.less
	less/forms.less
This commit is contained in:
Mark Otto 2012-11-04 19:59:07 -08:00
commit ee93541421
9 changed files with 144 additions and 25 deletions

View File

@ -686,6 +686,7 @@ pre {
code {
padding: 2px 4px;
color: #d14;
white-space: nowrap;
background-color: #f7f7f9;
border: 1px solid #e1e1e8;
}
@ -1442,16 +1443,16 @@ input[type="checkbox"][readonly] {
border-color: #3a87ad;
}
input:focus:required:invalid,
textarea:focus:required:invalid,
select:focus:required:invalid {
input:focus:invalid,
textarea:focus:invalid,
select:focus:invalid {
color: #b94a48;
border-color: #ee5f5b;
}
input:focus:required:invalid:focus,
textarea:focus:required:invalid:focus,
select:focus:required:invalid:focus {
input:focus:invalid:focus,
textarea:focus:invalid:focus,
select:focus:invalid:focus {
border-color: #e9322d;
-webkit-box-shadow: 0 0 6px #f8b9b7;
box-shadow: 0 0 6px #f8b9b7;
@ -1561,7 +1562,9 @@ select:focus:required:invalid:focus {
.input-append .add-on,
.input-prepend .add-on,
.input-append .btn,
.input-prepend .btn {
.input-prepend .btn,
.input-append .btn-group > .dropdown-toggle,
.input-prepend .btn-group > .dropdown-toggle {
vertical-align: top;
border-radius: 0;
}
@ -1590,7 +1593,10 @@ select:focus:required:invalid:focus {
.input-append input + .btn-group .btn,
.input-append select + .btn-group .btn,
.input-append .uneditable-input + .btn-group .btn {
.input-append .uneditable-input + .btn-group .btn,
.input-append input + .btn-group .btn:last-child,
.input-append select + .btn-group .btn:last-child,
.input-append .uneditable-input + .btn-group .btn:last-child {
border-radius: 0 4px 4px 0;
}
@ -1601,7 +1607,8 @@ select:focus:required:invalid:focus {
}
.input-append .add-on:last-child,
.input-append .btn:last-child {
.input-append .btn:last-child,
.input-append .btn-group:last-child > .dropdown-toggle {
border-radius: 0 4px 4px 0;
}
@ -2798,6 +2805,7 @@ table th[class*="span"],
}
.typeahead {
z-index: 1051;
margin-top: 2px;
}
@ -2926,7 +2934,6 @@ button.close {
.btn:hover {
color: #333333;
text-decoration: none;
background-color: #e6e6e6;
background-position: 0 -15px;
-webkit-transition: background-position 0.1s linear;
-moz-transition: background-position 0.1s linear;
@ -2942,8 +2949,6 @@ button.close {
.btn.active,
.btn:active {
background-color: #e6e6e6;
background-color: #d9d9d9 \9;
background-image: none;
outline: 0;
-webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
@ -2953,7 +2958,6 @@ button.close {
.btn.disabled,
.btn[disabled] {
cursor: default;
background-color: #e6e6e6;
background-image: none;
opacity: 0.65;
filter: alpha(opacity=65);

View File

@ -1321,6 +1321,54 @@ For example, <code><section></code> should be wrapped as inlin
</ul>
</div>
</div>
</pre>
<h4>Segmented dropdown groups</h4>
<form class="bs-docs-example">
<div class="input-prepend">
<div class="btn-group">
<button class="btn" tabindex="-1">Action</button>
<button class="btn dropdown-toggle" data-toggle="dropdown" tabindex="-1">
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</div>
<input type="text">
</div>
<div class="input-append">
<input type="text">
<div class="btn-group">
<button class="btn" tabindex="-1">Action</button>
<button class="btn dropdown-toggle" data-toggle="dropdown" tabindex="-1">
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</div>
</div>
</form>
<pre class="prettyprint linenums">
&lt;form&gt;
&lt;div class="input-prepend"&gt;
&lt;div class="btn-group"&gt;...&lt;/div&gt;
&lt;input type="text"&gt;
&lt;/div&gt;
&lt;div class="input-append"&gt;
&lt;input type="text"&gt;
&lt;div class="btn-group"&gt;...&lt;/div&gt;
&lt;/div&gt;
&lt;/form&gt;
</pre>
<h4>Search form</h4>
@ -1511,6 +1559,15 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
</form>
<pre class="prettyprint linenums">
&lt;input class="input-xlarge" id="focusedInput" type="text" value="This is focused..."&gt;
</pre>
<h3>Invalid inputs</h3>
<p>Style inputs via default browser functionality with <code>:invalid</code>. Specify a <code>type</code> and add the <code>required</code> attribute.</p>
<form class="bs-docs-example form-inline">
<input class="span3" type="email" placeholder="test@example.com" required>
</form>
<pre class="prettyprint linenums">
&lt;input class="span3" type="email" required&gt;
</pre>
<h3>Disabled inputs</h3>

View File

@ -178,7 +178,7 @@ $('#myModal').on('show', function (e) {
<h3>Static example</h3>
<p>A rendered modal with header, body, and set of actions in the footer.</p>
<div class="bs-docs-example" style="background-color: #f5f5f5;">
<div class="modal" style="position: relative; top: auto; left: auto; margin: 0 auto 20px; z-index: 1; max-width: 100%;">
<div class="modal" style="position: relative; top: auto; left: auto; right: auto; margin: 0 auto 20px; z-index: 1; max-width: 100%;">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3>Modal header</h3>

View File

@ -1261,6 +1261,54 @@
&lt;/ul&gt;
&lt;/div&gt;
&lt;/div&gt;
</pre>
<h4>{{_i}}Segmented dropdown groups{{/i}}</h4>
<form class="bs-docs-example">
<div class="input-prepend">
<div class="btn-group">
<button class="btn" tabindex="-1">Action</button>
<button class="btn dropdown-toggle" data-toggle="dropdown" tabindex="-1">
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="#">{{_i}}Action{{/i}}</a></li>
<li><a href="#">{{_i}}Another action{{/i}}</a></li>
<li><a href="#">{{_i}}Something else here{{/i}}</a></li>
<li class="divider"></li>
<li><a href="#">{{_i}}Separated link{{/i}}</a></li>
</ul>
</div>
<input type="text">
</div>
<div class="input-append">
<input type="text">
<div class="btn-group">
<button class="btn" tabindex="-1">Action</button>
<button class="btn dropdown-toggle" data-toggle="dropdown" tabindex="-1">
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="#">{{_i}}Action{{/i}}</a></li>
<li><a href="#">{{_i}}Another action{{/i}}</a></li>
<li><a href="#">{{_i}}Something else here{{/i}}</a></li>
<li class="divider"></li>
<li><a href="#">{{_i}}Separated link{{/i}}</a></li>
</ul>
</div>
</div>
</form>
<pre class="prettyprint linenums">
&lt;form&gt;
&lt;div class="input-prepend"&gt;
&lt;div class="btn-group"&gt;...&lt;/div&gt;
&lt;input type="text"&gt;
&lt;/div&gt;
&lt;div class="input-append"&gt;
&lt;input type="text"&gt;
&lt;div class="btn-group"&gt;...&lt;/div&gt;
&lt;/div&gt;
&lt;/form&gt;
</pre>
<h4>{{_i}}Search form{{/i}}</h4>
@ -1451,6 +1499,15 @@
</form>
<pre class="prettyprint linenums">
&lt;input class="input-xlarge" id="focusedInput" type="text" value="{{_i}}This is focused...{{/i}}"&gt;
</pre>
<h3>{{_i}}Invalid inputs{{/i}}</h3>
<p>{{_i}}Style inputs via default browser functionality with <code>:invalid</code>. Specify a <code>type</code> and add the <code>required</code> attribute.{{/i}}</p>
<form class="bs-docs-example form-inline">
<input class="span3" type="email" placeholder="test@example.com" required>
</form>
<pre class="prettyprint linenums">
&lt;input class="span3" type="email" required&gt;
</pre>
<h3>{{_i}}Disabled inputs{{/i}}</h3>

View File

@ -111,7 +111,7 @@ $('#myModal').on('show', function (e) {
<h3>{{_i}}Static example{{/i}}</h3>
<p>{{_i}}A rendered modal with header, body, and set of actions in the footer.{{/i}}</p>
<div class="bs-docs-example" style="background-color: #f5f5f5;">
<div class="modal" style="position: relative; top: auto; left: auto; margin: 0 auto 20px; z-index: 1; max-width: 100%;">
<div class="modal" style="position: relative; top: auto; left: auto; right: auto; margin: 0 auto 20px; z-index: 1; max-width: 100%;">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3>{{_i}}Modal header{{/i}}</h3>

View File

@ -26,7 +26,6 @@
&:hover {
color: @grayDark;
text-decoration: none;
background-color: darken(@white, 10%);
background-position: 0 -15px;
// transition is only when going to hover, otherwise the background
@ -42,8 +41,6 @@
// Active state
&.active,
&:active {
background-color: darken(@white, 10%);
background-color: darken(@white, 15%) e("\9");
background-image: none;
outline: 0;
.box-shadow(~"inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)");
@ -53,7 +50,6 @@
&.disabled,
&[disabled] {
cursor: default;
background-color: darken(@white, 10%);
background-image: none;
.opacity(65);
.box-shadow(none);

View File

@ -19,6 +19,7 @@ code {
color: #d14;
background-color: #f7f7f9;
border: 1px solid #e1e1e8;
white-space: nowrap;
}
// Blocks of code

View File

@ -214,5 +214,6 @@
// Typeahead
// ---------
.typeahead {
z-index: 1051;
margin-top: 2px; // give it some space to breathe
}

View File

@ -388,9 +388,9 @@ input[type="checkbox"][readonly] {
// HTML5 invalid states
// Shares styles with the .control-group.error above
input:focus:required:invalid,
textarea:focus:required:invalid,
select:focus:required:invalid {
input:focus:invalid,
textarea:focus:invalid,
select:focus:invalid {
color: #b94a48;
border-color: #ee5f5b;
&:focus {
@ -489,7 +489,8 @@ select:focus:required:invalid {
border: 1px solid #ccc;
}
.add-on,
.btn {
.btn,
.btn-group > .dropdown-toggle {
vertical-align: top;
border-radius: 0;
}
@ -516,7 +517,8 @@ select:focus:required:invalid {
select,
.uneditable-input {
border-radius: @inputBorderRadius 0 0 @inputBorderRadius;
+ .btn-group .btn {
+ .btn-group .btn,
+ .btn-group .btn:last-child {
border-radius: 0 @inputBorderRadius @inputBorderRadius 0;
}
}
@ -526,7 +528,8 @@ select:focus:required:invalid {
margin-left: -1px;
}
.add-on:last-child,
.btn:last-child {
.btn:last-child,
.btn-group:last-child > .dropdown-toggle {
border-radius: 0 @inputBorderRadius @inputBorderRadius 0;
}
}