mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-14 18:42:30 +03:00
Code Activity

*really* refactor the buttons and update them all over the docs

Browse Source
This commit is contained in:
Mark Otto
2012-01-30 21:15:57 -08:00
parent 21bebe77fe
commit 0f3a073b8d
18 changed files with 232 additions and 232 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/templates/pages/base-css.mustache
Vendored
+34 -34
View File
@@ -756,11 +756,6 @@
<td><code>.form-vertical</code> <span class="muted">({{_i}}not required{{/i}})</span></td>
<td>{{_i}}Stacked, left-aligned labels over controls{{/i}}</td>
</tr>
<tr>
<th>{{_i}}Horizontal{{/i}}</th>
<td><code>.form-horizontal</code></td>
<td>{{_i}}Float left, right-aligned labels on same line as controls{{/i}}</td>
</tr>
<tr>
<th>{{_i}}Inline{{/i}}</th>
<td><code>.form-inline</code></td>
@@ -771,6 +766,11 @@
<td><code>.form-search</code></td>
<td>{{_i}}Extra-rounded text input for a typical search aesthetic{{/i}}</td>
</tr>
<tr>
<th>{{_i}}Horizontal{{/i}}</th>
<td><code>.form-horizontal</code></td>
<td>{{_i}}Float left, right-aligned labels on same line as controls{{/i}}</td>
</tr>
</tbody>
</table>
@@ -879,7 +879,7 @@
</div>
</div>
<div class="form-actions">
<button type="submit" class="btn primary">{{_i}}Save changes{{/i}}</button>
<button type="submit" class="btn btn-primary">{{_i}}Save changes{{/i}}</button>
<button type="reset" class="btn">{{_i}}Cancel{{/i}}</button>
</div>
</fieldset>
@@ -972,7 +972,7 @@
</div>
</div>
<div class="form-actions">
<button type="submit" class="btn primary">{{_i}}Save changes{{/i}}</button>
<button type="submit" class="btn btn-primary">{{_i}}Save changes{{/i}}</button>
<button type="reset" class="btn">{{_i}}Cancel{{/i}}</button>
</div>
</fieldset>
@@ -1096,7 +1096,7 @@
</div>
</div>
<div class="form-actions">
<button type="submit" class="btn primary">{{_i}}Save changes{{/i}}</button>
<button type="submit" class="btn btn-primary">{{_i}}Save changes{{/i}}</button>
<button type="reset" class="btn">{{_i}}Cancel{{/i}}</button>
</div>
</fieldset>
@@ -1139,28 +1139,28 @@
<td>{{_i}}Standard gray button with gradient{{/i}}</td>
</tr>
<tr>
<td><a class="btn primary" href="#">{{_i}}Primary{{/i}}</a></td>
<td><code>.primary</code></td>
<td><a class="btn btn-primary" href="#">{{_i}}Primary{{/i}}</a></td>
<td><code>.btn-primary</code></td>
<td>{{_i}}Provides extra visual weight and identifies the primary action in a set of buttons{{/i}}</td>
</tr>
<tr>
<td><a class="btn info" href="#">{{_i}}Info{{/i}}</a></td>
<td><code>.info</code></td>
<td><a class="btn btn-info" href="#">{{_i}}Info{{/i}}</a></td>
<td><code>.btn-info</code></td>
<td>{{_i}}Used as an alternate to the default styles{{/i}}</td>
</tr>
<tr>
<td><a class="btn success" href="#">{{_i}}Success{{/i}}</a></td>
<td><code>.success</code></td>
<td><a class="btn btn-success" href="#">{{_i}}Success{{/i}}</a></td>
<td><code>.btn-success</code></td>
<td>{{_i}}Indicates a successful or positive action{{/i}}</td>
</tr>
<tr>
<td><a class="btn warning" href="#">{{_i}}Warning{{/i}}</a></td>
<td><code>.warning</code></td>
<td><a class="btn btn-warning" href="#">{{_i}}Warning{{/i}}</a></td>
<td><code>.btn-warning</code></td>
<td>{{_i}}Indicates caution should be taken with this action{{/i}}</td>
</tr>
<tr>
<td><a class="btn danger" href="#">{{_i}}Danger{{/i}}</a></td>
<td><code>.danger</code></td>
<td><a class="btn btn-danger" href="#">{{_i}}Danger{{/i}}</a></td>
<td><code>.btn-danger</code></td>
<td>{{_i}}Indicates a dangerous or potentially negative action{{/i}}</td>
</tr>
</tbody>
@@ -1185,24 +1185,24 @@
<h3>{{_i}}Multiple sizes{{/i}}</h3>
<p>{{_i}}Fancy larger or smaller buttons? Have at it!{{/i}}</p>
<p>
<a href="#" class="btn large primary">{{_i}}Primary action{{/i}}</a>
<a href="#" class="btn large">{{_i}}Action{{/i}}</a>
<a href="#" class="btn btn-large btn-primary">{{_i}}Primary action{{/i}}</a>
<a href="#" class="btn btn-large">{{_i}}Action{{/i}}</a>
</p>
<p>
<a href="#" class="btn small primary">{{_i}}Primary action{{/i}}</a>
<a href="#" class="btn small">{{_i}}Action{{/i}}</a>
<a href="#" class="btn btn-small btn-primary">{{_i}}Primary action{{/i}}</a>
<a href="#" class="btn btn-small">{{_i}}Action{{/i}}</a>
</p>
</div>
<div class="span4">
<h3>{{_i}}Disabled state{{/i}}</h3>
<p>{{_i}}For disabled buttons, use <code>.disabled</code> for links and <code>:disabled</code> for <code>&lt;button&gt;</code> elements.{{/i}}</p>
<p>{{_i}}For disabled buttons, use <code>.btn-disabled</code> for links and <code>:disabled</code> for <code>&lt;button&gt;</code> elements.{{/i}}</p>
<p>
<a href="#" class="btn large primary disabled">{{_i}}Primary action{{/i}}</a>
<a href="#" class="btn large disabled">{{_i}}Action{{/i}}</a>
<a href="#" class="btn btn-large btn-primary btn-disabled">{{_i}}Primary action{{/i}}</a>
<a href="#" class="btn btn-large btn-disabled">{{_i}}Action{{/i}}</a>
</p>
<p>
<button class="btn large primary disabled" disabled="disabled">{{_i}}Primary action{{/i}}</button>
<button class="btn large" disabled>{{_i}}Action{{/i}}</button>
<button class="btn btn-large btn-primary disabled" disabled="disabled">{{_i}}Primary action{{/i}}</button>
<button class="btn btn-large" disabled>{{_i}}Action{{/i}}</button>
</p>
</div>
<div class="span4">
@@ -1415,8 +1415,8 @@
<a class="btn" href="#"><i class="icon align-justify"></i></a>
</div>
<div class="btn-group">
<a class="btn primary" href="#"><i class="icon white user"></i> {{_i}}User{{/i}}</a>
<a class="btn primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
<a class="btn btn-primary" href="#"><i class="icon white user"></i> {{_i}}User{{/i}}</a>
<a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#"><i class="icon pencil"></i> {{_i}}Edit{{/i}}</a></li>
<li><a href="#"><i class="icon trash"></i> {{_i}}Delete{{/i}}</a></li>
@@ -1428,13 +1428,13 @@
</div>
<p>
<a class="btn" href="#"><i class="icon refresh"></i> {{_i}}Refresh{{/i}}</a>
<a class="btn success" href="#"><i class="icon white shopping-cart"></i> {{_i}}Checkout{{/i}}</a>
<a class="btn danger" href="#"><i class="icon white trash"></i> {{_i}}Delete{{/i}}</a>
<a class="btn btn-success" href="#"><i class="icon white shopping-cart"></i> {{_i}}Checkout{{/i}}</a>
<a class="btn btn-danger" href="#"><i class="icon white trash"></i> {{_i}}Delete{{/i}}</a>
</p>
<p>
<a class="btn large" href="#"><i class="icon comment"></i> {{_i}}Comment{{/i}}</a>
<a class="btn small" href="#"><i class="icon cog"></i> {{_i}}Settings{{/i}}</a>
<a class="btn small info" href="#"><i class="icon white info-sign"></i> {{_i}}More Info{{/i}}</a>
<a class="btn btn-large" href="#"><i class="icon comment"></i> {{_i}}Comment{{/i}}</a>
<a class="btn btn-small" href="#"><i class="icon cog"></i> {{_i}}Settings{{/i}}</a>
<a class="btn btn-small btn-info" href="#"><i class="icon white info-sign"></i> {{_i}}More Info{{/i}}</a>
</p>
</div>
<div class="span4">
docs/templates/pages/components.mustache
Vendored
+12 -12
View File
@@ -122,7 +122,7 @@
</ul>
</div><!-- /btn-group -->
<div class="btn-group">
<a class="btn primary dropdown-toggle" data-toggle="dropdown" href="#">{{_i}}Action{{/i}} <span class="caret"></span></a>
<a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#">{{_i}}Action{{/i}} <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">{{_i}}Action{{/i}}</a></li>
<li><a href="#">{{_i}}Another action{{/i}}</a></li>
@@ -132,7 +132,7 @@
</ul>
</div><!-- /btn-group -->
<div class="btn-group">
<a class="btn danger dropdown-toggle" data-toggle="dropdown" href="#">{{_i}}Danger{{/i}} <span class="caret"></span></a>
<a class="btn btn-danger dropdown-toggle" data-toggle="dropdown" href="#">{{_i}}Danger{{/i}} <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">{{_i}}Action{{/i}}</a></li>
<li><a href="#">{{_i}}Another action{{/i}}</a></li>
@@ -144,7 +144,7 @@
</div>
<div class="btn-toolbar">
<div class="btn-group">
<a class="btn success dropdown-toggle" data-toggle="dropdown" href="#">{{_i}}Success{{/i}} <span class="caret"></span></a>
<a class="btn btn-success dropdown-toggle" data-toggle="dropdown" href="#">{{_i}}Success{{/i}} <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">{{_i}}Action{{/i}}</a></li>
<li><a href="#">{{_i}}Another action{{/i}}</a></li>
@@ -154,7 +154,7 @@
</ul>
</div><!-- /btn-group -->
<div class="btn-group">
<a class="btn info dropdown-toggle" data-toggle="dropdown" href="#">{{_i}}Info{{/i}} <span class="caret"></span></a>
<a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">{{_i}}Info{{/i}} <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">{{_i}}Action{{/i}}</a></li>
<li><a href="#">{{_i}}Another action{{/i}}</a></li>
@@ -199,8 +199,8 @@
</ul>
</div><!-- /btn-group -->
<div class="btn-group">
<a class="btn primary" href="#">{{_i}}Action{{/i}}</a>
<a class="btn primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
<a class="btn btn-primary" href="#">{{_i}}Action{{/i}}</a>
<a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">{{_i}}Action{{/i}}</a></li>
<li><a href="#">{{_i}}Another action{{/i}}</a></li>
@@ -210,8 +210,8 @@
</ul>
</div><!-- /btn-group -->
<div class="btn-group">
<a class="btn danger" href="#">{{_i}}Danger{{/i}}</a>
<a class="btn danger dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
<a class="btn btn-danger" href="#">{{_i}}Danger{{/i}}</a>
<a class="btn btn-danger dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">{{_i}}Action{{/i}}</a></li>
<li><a href="#">{{_i}}Another action{{/i}}</a></li>
@@ -223,8 +223,8 @@
</div>
<div class="btn-toolbar">
<div class="btn-group">
<a class="btn success" href="#">{{_i}}Success{{/i}}</a>
<a class="btn success dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
<a class="btn btn-success" href="#">{{_i}}Success{{/i}}</a>
<a class="btn btn-success dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">{{_i}}Action{{/i}}</a></li>
<li><a href="#">{{_i}}Another action{{/i}}</a></li>
@@ -234,8 +234,8 @@
</ul>
</div><!-- /btn-group -->
<div class="btn-group">
<a class="btn info" href="#">{{_i}}Info{{/i}}</a>
<a class="btn info dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
<a class="btn btn-info" href="#">{{_i}}Info{{/i}}</a>
<a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">{{_i}}Action{{/i}}</a></li>
<li><a href="#">{{_i}}Another action{{/i}}</a></li>
docs/templates/pages/download.mustache
Vendored
+4 -4
View File
@@ -15,7 +15,7 @@
<section class="download" id="components">
<div class="page-header">
<a class="btn small pull-right toggle-all" href="#">{{_i}}Toggle all{{/i}}</a>
<a class="btn btn-small pull-right toggle-all" href="#">{{_i}}Toggle all{{/i}}</a>
<h1>
{{_i}}1. Chose components{{/i}}
<small>{{_i}}Get just the CSS you need{{/i}}</small>
@@ -71,7 +71,7 @@
<section class="download" id="plugins">
<div class="page-header">
<a class="btn small pull-right toggle-all" href="#">{{_i}}Toggle all{{/i}}</a>
<a class="btn btn-small pull-right toggle-all" href="#">{{_i}}Toggle all{{/i}}</a>
<h1>
{{_i}}2. Select jQuery plugins{{/i}}
<small>{{_i}}Quickly add only the necessary javascript{{/i}}</small>
@@ -140,7 +140,7 @@
<section class="download" id="variables">
<div class="page-header">
<a class="btn small pull-right toggle-all" href="#">{{_i}}Reset to defaults{{/i}}</a>
<a class="btn btn-small pull-right toggle-all" href="#">{{_i}}Reset to defaults{{/i}}</a>
<h1>
{{_i}}3. Customize variables{{/i}}
<small>{{_i}}Optionally modify Bootstrap without a compiler{{/i}}</small>
@@ -239,7 +239,7 @@
</h1>
</div>
<div class="download-btn">
<a class="btn xlarge primary" href="#">{{_i}}Customize and Download{{/i}}</a>
<a class="btn btn-primary" href="#">{{_i}}Customize and Download{{/i}}</a>
<h4>{{_i}}What's included?{{/i}}</h4>
<p>{{_i}}Downloads include compiled CSS, compiled and minified CSS, and compiled jQuery plugins, all nicely packed up into a zipball for your convenience.{{/i}}</p>
</div>
docs/templates/pages/index.mustache
Vendored
+2 -2
View File
@@ -5,8 +5,8 @@
<h1>{{_i}}Bootstrap, from Twitter{{/i}}</h1>
<p>Simple and flexible HTML, CSS, and Javascript for popular user interface components and interactions.</p>
<p class="download-info">
<a href="https://github.com/twitter/bootstrap/" class="btn primary large">{{_i}}View project on GitHub{{/i}}</a>
<a href="assets/bootstrap.zip" class="btn large">{{_i}}Download Bootstrap{{/i}}</a>
<a href="https://github.com/twitter/bootstrap/" class="btn btn-primary btn-large">{{_i}}View project on GitHub{{/i}}</a>
<a href="assets/bootstrap.zip" class="btn btn-large">{{_i}}Download Bootstrap{{/i}}</a>
</p>
</div>
docs/templates/pages/javascript.mustache
Vendored
+15 -15
View File
@@ -138,7 +138,7 @@
<p>{{_i}}One fine body…{{/i}}</p>
</div>
<div class="modal-footer">
<a href="#" class="btn primary">{{_i}}Save changes{{/i}}</a>
<a href="#" class="btn btn-primary">{{_i}}Save changes{{/i}}</a>
<a href="#" class="btn">{{_i}}Close{{/i}}</a>
</div>
</div>
@@ -163,11 +163,11 @@
<p>{{_i}}<a href="#" class="tooltip-test" title="Tooltip">This link</a> and <a href="#" class="tooltip-test" title="Tooltip">that link</a> should have tooltips on hover.{{/i}}</p>
</div>
<div class="modal-footer">
<a href="#" class="btn primary">{{_i}}Save changes{{/i}}</a>
<a href="#" class="btn btn-primary">{{_i}}Save changes{{/i}}</a>
<a href="#" class="btn" data-dismiss="modal" >{{_i}}Close{{/i}}</a>
</div>
</div>
<a data-toggle="modal" href="#myModal" class="btn primary large">{{_i}}Launch demo modal{{/i}}</a>
<a data-toggle="modal" href="#myModal" class="btn btn-primary btn-large">{{_i}}Launch demo modal{{/i}}</a>
<hr>
@@ -216,7 +216,7 @@
&lt;p&gt;{{_i}}One fine body…{{/i}}&lt;/p&gt;
&lt;/div&gt;
&lt;div class="modal-footer"&gt;
&lt;a href="#" class="btn primary"&gt;{{_i}}Save changes{{/i}}&lt;/a&gt;
&lt;a href="#" class="btn btn-primary"&gt;{{_i}}Save changes{{/i}}&lt;/a&gt;
&lt;a href="#" class="btn"&gt;{{_i}}Close{{/i}}&lt;/a&gt;
&lt;/div&gt;
&lt;/div&gt;
@@ -726,7 +726,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<h2>{{_i}}Example hover popover{{/i}}</h2>
<p>{{_i}}Hover over the button to trigger the popover.{{/i}}</p>
<div class="well">
<a href="#" class="btn danger" rel="popover" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">{{_i}}hover for popover{{/i}}</a>
<a href="#" class="btn btn-danger" rel="popover" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">{{_i}}hover for popover{{/i}}</a>
</div>
<hr>
<h2>{{_i}}Using bootstrap-popover.js{{/i}}</h2>
@@ -841,7 +841,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<h4 class="alert-heading">{{_i}}Oh snap! You got an error!{{/i}}</h4>
<p>{{_i}}Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.{{/i}}</p>
<p>
<a class="btn danger small" href="#">{{_i}}Take this action{{/i}}</a> <a class="btn small" href="#">{{_i}}Or do this{{/i}}</a>
<a class="btn btn-danger small" href="#">{{_i}}Take this action{{/i}}</a> <a class="btn small" href="#">{{_i}}Or do this{{/i}}</a>
</p>
</div>
<hr>
@@ -907,7 +907,7 @@ $('#my-alert').bind('closed', function () {
<tr>
<td>{{_i}}Stateful{{/i}}</td>
<td>
<button id="fat-btn" data-loading-text="loading..." class="btn primary">
<button id="fat-btn" data-loading-text="loading..." class="btn btn-primary">
{{_i}}Loading State{{/i}}
</button>
</td>
@@ -915,16 +915,16 @@ $('#my-alert').bind('closed', function () {
<tr>
<td>{{_i}}Single toggle{{/i}}</td>
<td>
<button class="btn primary" data-toggle="button">{{_i}}Single Toggle{{/i}}</button>
<button class="btn btn-primary" data-toggle="button">{{_i}}Single Toggle{{/i}}</button>
</td>
</tr>
<tr>
<td>{{_i}}Checkbox{{/i}}</td>
<td>
<div class="btn-group" data-toggle="buttons-checkbox">
<button class="btn primary">{{_i}}Left{{/i}}</button>
<button class="btn primary">{{_i}}Middle{{/i}}</button>
<button class="btn primary">{{_i}}Right{{/i}}</button>
<button class="btn btn-primary">{{_i}}Left{{/i}}</button>
<button class="btn btn-primary">{{_i}}Middle{{/i}}</button>
<button class="btn btn-primary">{{_i}}Right{{/i}}</button>
</div>
</td>
</tr>
@@ -932,9 +932,9 @@ $('#my-alert').bind('closed', function () {
<td>{{_i}}Radio{{/i}}</td>
<td>
<div class="btn-group" data-toggle="buttons-radio">
<button class="btn primary">{{_i}}Left{{/i}}</button>
<button class="btn primary">{{_i}}Middle{{/i}}</button>
<button class="btn primary">{{_i}}Right{{/i}}</button>
<button class="btn btn-primary">{{_i}}Left{{/i}}</button>
<button class="btn btn-primary">{{_i}}Middle{{/i}}</button>
<button class="btn btn-primary">{{_i}}Right{{/i}}</button>
</div>
</td>
</tr>
@@ -1082,7 +1082,7 @@ $('#my-alert').bind('closed', function () {
<h3>{{_i}}Markup{{/i}}</h3>
<p>{{_i}}Just add <code>data-toggle="collapse"</code> and a <code>data-target</code> to element to automatically assign control of a collapsible element. The <code>data-target</code> attribute accepts a css selector to apply the collapse to. Be sure to add the class <code>collapse</code> to the collapsible element. If you'd like it to default open, add the additional class <code>in</code>.{{/i}}</p>
<pre class="prettyprint linenums">
&lt;button class="btn danger" data-toggle="collapse" data-target="#demo"&gt;
&lt;button class="btn btn-danger" data-toggle="collapse" data-target="#demo"&gt;
{{_i}}simple collapsible{{/i}}
&lt;/button&gt;