Commit b06ec345 authored by fat's avatar fat
Browse files

Merge branch '3.0.0-wip' of github.com:twitter/bootstrap into 3.0.0-wip

parents b0da9758 cb483b67
Showing with 31 additions and 18 deletions
+31 -18
...@@ -9,4 +9,3 @@ permalink: pretty ...@@ -9,4 +9,3 @@ permalink: pretty
source: ./docs source: ./docs
destination: ./_gh_pages destination: ./_gh_pages
port: 9001 port: 9001
url: http://getbootstrap.dev:9001
...@@ -482,6 +482,11 @@ lead: "Dozens of reusable components built to provide iconography, dropdowns, na ...@@ -482,6 +482,11 @@ lead: "Dozens of reusable components built to provide iconography, dropdowns, na
</div> </div>
<p class="lead">Group a series of buttons together on a single line with the button group. Add on optional JavaScript radio and checkbox style behavior with <a href="./javascript.html#buttons">our buttons plugin</a>.</p> <p class="lead">Group a series of buttons together on a single line with the button group. Add on optional JavaScript radio and checkbox style behavior with <a href="./javascript.html#buttons">our buttons plugin</a>.</p>
<div class="bs-callout">
<h4>Tooltips &amp; popovers in button groups require special setting</h4>
<p>When using tooltips or popovers on elements within a <code>.btn-group</code>, you'll have to specify the option <code>container: 'body'</code> to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the tooltip or popover is triggered).</p>
</div>
<h3 id="btn-groups-single">Basic button group</h3> <h3 id="btn-groups-single">Basic button group</h3>
<p>Wrap a series of buttons with <code>.btn</code> in <code>.btn-group</code>.</p> <p>Wrap a series of buttons with <code>.btn</code> in <code>.btn-group</code>.</p>
<div class="bs-example"> <div class="bs-example">
......
...@@ -1494,12 +1494,16 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline. ...@@ -1494,12 +1494,16 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<p>Adding on top of existing browser controls, Bootstrap includes other useful form components.</p> <p>Adding on top of existing browser controls, Bootstrap includes other useful form components.</p>
<h3 id="forms-input-groups">Input groups</h3> <h3 id="forms-input-groups">Input groups</h3>
<p>Add text or buttons before, after, or on both sides of any text-based input. Use <code>.input-group</code> with a <code>.add-on</code> to prepend or append elements to an <code>&lt;input&gt;</code>.</p> <p>Add text or buttons before, after, or on both sides of any text-based input. Use <code>.input-group</code> with an <code>.add-on</code> to prepend or append elements to an <code>&lt;input&gt;</code>.</p>
<div class="bs-callout"> <div class="bs-callout">
<h4>Cross-browser compatibility</h4> <h4>Cross-browser compatibility</h4>
<p>Avoid using <code>&lt;select&gt;</code> elements here as they cannot be fully styled in WebKit browsers.</p> <p>Avoid using <code>&lt;select&gt;</code> elements here as they cannot be fully styled in WebKit browsers.</p>
</div> </div>
<div class="bs-callout">
<h4>Tooltips &amp; popovers in input groups require special setting</h4>
<p>When using tooltips or popovers on elements within an <code>.input-group</code>, you'll have to specify the option <code>container: 'body'</code> to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the tooltip or popover is triggered).</p>
</div>
<form class="bs-example bs-example-form"> <form class="bs-example bs-example-form">
<div class="input-group col-lg-9"> <div class="input-group col-lg-9">
......
...@@ -751,9 +751,10 @@ $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { ...@@ -751,9 +751,10 @@ $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
</ul> </ul>
</div><!-- /example --> </div><!-- /example -->
<div class="bs-callout">
<h3>Tooltips in input groups</h3> <h4>Tooltips in button groups and input groups require special setting</h4>
<p>When using tooltips and popovers with the Bootstrap input groups, you'll have to set the <code>container</code> (documented below) option to avoid unwanted side effects.</p> <p>When using tooltips on elements within a <code>.btn-group</code> or an <code>.input-group</code>, you'll have to specify the option <code>container: 'body'</code> (documented below) to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the tooltip is triggered).</p>
</div>
<hr class="bs-docs-separator"> <hr class="bs-docs-separator">
...@@ -880,6 +881,10 @@ $('#example').tooltip(options) ...@@ -880,6 +881,10 @@ $('#example').tooltip(options)
<h4>Plugin dependency</h4> <h4>Plugin dependency</h4>
<p>Popovers require the <a href="#tooltips">tooltip plugin</a> to be included in your version of Bootstrap.</p> <p>Popovers require the <a href="#tooltips">tooltip plugin</a> to be included in your version of Bootstrap.</p>
</div> </div>
<div class="bs-callout">
<h4>Popovers in button groups and input groups require special setting</h4>
<p>When using popovers on elements within a <code>.btn-group</code> or an <code>.input-group</code>, you'll have to specify the option <code>container: 'body'</code> (documented below) to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the popover is triggered).</p>
</div>
<h3>Static popover</h3> <h3>Static popover</h3>
<p>Four options are available: top, right, bottom, and left aligned.</p> <p>Four options are available: top, right, bottom, and left aligned.</p>
...@@ -1011,7 +1016,7 @@ $('#example').tooltip(options) ...@@ -1011,7 +1016,7 @@ $('#example').tooltip(options)
<td>string | false</td> <td>string | false</td>
<td>false</td> <td>false</td>
<td> <td>
<p>Appends the popover to a specific element <code>container: 'body'</code></p> <p>Appends the popover to a specific element. Example: <code>container: 'body'</code></p>
</td> </td>
</tr> </tr>
</tbody> </tbody>
......
...@@ -29,25 +29,25 @@ ...@@ -29,25 +29,25 @@
// Hide from screenreaders and browsers // Hide from screenreaders and browsers
// Credit: HTML5 Boilerplate // Credit: HTML5 Boilerplate
.hidden { .hidden {
display: none; display: none !important;
visibility: hidden; visibility: hidden !important;
} }
// Visibility utilities // Visibility utilities
// For Phones // For Phones
.visible-sm { .visible-sm {
.responsive-visibility; .responsive-visibility();
} }
.visible-md { display: none !important; } .visible-md { display: none !important; }
.visible-lg { display: none !important; } .visible-lg { display: none !important; }
.hidden-sm { display: none !important; } .hidden-sm { display: none !important; }
.hidden-md { .hidden-md {
.responsive-visibility; .responsive-visibility();
} }
.hidden-lg { .hidden-lg {
.responsive-visibility; .responsive-visibility();
} }
...@@ -55,16 +55,16 @@ ...@@ -55,16 +55,16 @@
@media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
.visible-sm { display: none !important; } .visible-sm { display: none !important; }
.visible-md { .visible-md {
.responsive-visibility; .responsive-visibility();
} }
.visible-lg { display: none !important; } .visible-lg { display: none !important; }
.hidden-sm { .hidden-sm {
.responsive-visibility; .responsive-visibility();
} }
.hidden-md { display: none !important; } .hidden-md { display: none !important; }
.hidden-lg { .hidden-lg {
.responsive-visibility; .responsive-visibility();
} }
} }
...@@ -73,14 +73,14 @@ ...@@ -73,14 +73,14 @@
.visible-sm { display: none !important; } .visible-sm { display: none !important; }
.visible-md { display: none !important; } .visible-md { display: none !important; }
.visible-lg { .visible-lg {
.responsive-visibility; .responsive-visibility();
} }
.hidden-sm { .hidden-sm {
.responsive-visibility; .responsive-visibility();
} }
.hidden-md { .hidden-md {
.responsive-visibility; .responsive-visibility();
} }
.hidden-lg { display: none !important; } .hidden-lg { display: none !important; }
} }
...@@ -91,7 +91,7 @@ ...@@ -91,7 +91,7 @@
@media print { @media print {
.visible-print { .visible-print {
.responsive-visibility; .responsive-visibility();
} }
.hidden-print { display: none !important; } .hidden-print { display: none !important; }
} }
Supports Markdown
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