diff options
| author | Mark Otto <[email protected]> | 2012-01-25 13:33:55 -0800 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2012-01-25 13:33:55 -0800 |
| commit | 4ea63e5261ba0c10e2b729e2216105896108733b (patch) | |
| tree | ac2664dd93216dc2de18d325cecbd37823f25ee0 /docs | |
| parent | 9c4a70c597a35f772bb21cb60dd7812146fc29ee (diff) | |
| download | bootstrap-4ea63e5261ba0c10e2b729e2216105896108733b.tar.xz bootstrap-4ea63e5261ba0c10e2b729e2216105896108733b.zip | |
finish off the static stuff for build and download page
Diffstat (limited to 'docs')
| -rw-r--r-- | docs/assets/css/docs.css | 39 | ||||
| -rw-r--r-- | docs/assets/img/twitter-logo-no-bird.png | bin | 1509 -> 0 bytes | |||
| -rw-r--r-- | docs/base-css.html | 252 | ||||
| -rw-r--r-- | docs/download.html | 28 | ||||
| -rw-r--r-- | docs/templates/pages/base-css.mustache | 252 | ||||
| -rw-r--r-- | docs/templates/pages/download.mustache | 28 |
6 files changed, 329 insertions, 270 deletions
diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css index 600894f38..739ae1fc4 100644 --- a/docs/assets/css/docs.css +++ b/docs/assets/css/docs.css @@ -125,7 +125,7 @@ section { margin-right: 0; } .subhead h1 { - font-size: 45px; + font-size: 54px; } /* Subnav */ @@ -168,10 +168,17 @@ section { color: #333; } .subnav .nav .active a { - background-color: #e5e5e5; + background-color: #e9e9e9; + border-right-color: #ddd; + border-left: 0; + padding-left: 13px; + -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.075); + -moz-box-shadow: inset 0 3px 5px rgba(0,0,0,.075); + box-shadow: inset 0 3px 5px rgba(0,0,0,.075); } .subnav .nav li:first-child a { border-left: 0; + padding-left: 12px; } .subnav .nav li:last-child a { border-right: 0; @@ -464,7 +471,6 @@ section { font-family: Menlo, Monaco, "Courier New", monospace; font-size: 12px; color: #d14; - background-color: #f7f7f9; } .download-builder input[type=text]:focus { background-color: #fff; @@ -473,7 +479,6 @@ section { /* Custom, larger checkbox labels */ .download .checkbox { padding: 6px 10px 6px 25px; - font-size: 14px; color: #555; background-color: #f9f9f9; -webkit-border-radius: 3px; @@ -485,10 +490,6 @@ section { color: #333; background-color: #f5f5f5; } -.download .checkbox input[type=checkbox] { - position: relative; - top: 1px; -} .download .checkbox small { font-size: 12px; color: #777; @@ -496,17 +497,23 @@ section { /* Giant download button */ .download-btn { - pading: 18px 20px; - margin: 45px 0; + margin: 36px 0 108px; +} +.download p, +.download h4 { + max-width: 50%; + margin: 0 auto 18px; + color: #999; text-align: center; - border: 1px solid #eee; - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; +} +.download-btn h4 { + margin-bottom: 0; } .btn.xlarge { - margin: 36px auto; - padding: 14px 24px; + display: block; + width: auto; + padding: 19px 24px; + margin-bottom: 27px; font-size: 30px; text-align: center; -webkit-border-radius: 6px; diff --git a/docs/assets/img/twitter-logo-no-bird.png b/docs/assets/img/twitter-logo-no-bird.png Binary files differdeleted file mode 100644 index 70b6573d7..000000000 --- a/docs/assets/img/twitter-logo-no-bird.png +++ /dev/null diff --git a/docs/base-css.html b/docs/base-css.html index 60b5640df..8340e0f60 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -1023,66 +1023,68 @@ <div class="row"> <div class="span8"> <form class="form-horizontal"> - <legend>Form control states</legend> - <div class="control-group"> - <label class="control-label" for="focusedInput">Focused input</label> - <div class="controls"> - <input class="input-xlarge focused" id="focusedInput" name="focusedInput" type="text" value="This is focused…"> + <fieldset> + <legend>Form control states</legend> + <div class="control-group"> + <label class="control-label" for="focusedInput">Focused input</label> + <div class="controls"> + <input class="input-xlarge focused" id="focusedInput" name="focusedInput" type="text" value="This is focused…"> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="disabledInput">Disabled input</label> - <div class="controls"> - <input class="input-xlarge disabled" id="disabledInput" name="disabledInput" type="text" placeholder="Disabled input here…" disabled> + <div class="control-group"> + <label class="control-label" for="disabledInput">Disabled input</label> + <div class="controls"> + <input class="input-xlarge disabled" id="disabledInput" name="disabledInput" type="text" placeholder="Disabled input here…" disabled> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="optionsCheckbox">Disabled checkbox</label> - <div class="controls"> - <label class="checkbox"> - <input type="checkbox" name="optionsCheckbox" value="option1" disabled> - This is a disabled checkbox - </label> + <div class="control-group"> + <label class="control-label" for="optionsCheckbox">Disabled checkbox</label> + <div class="controls"> + <label class="checkbox"> + <input type="checkbox" name="optionsCheckbox" value="option1" disabled> + This is a disabled checkbox + </label> + </div> </div> - </div> - <div class="control-group warning"> - <label class="control-label" for="inputError">Input with warning</label> - <div class="controls"> - <input type="text" name="inputError"> - <span class="help-inline">Something may have gone wrong</span> + <div class="control-group warning"> + <label class="control-label" for="inputError">Input with warning</label> + <div class="controls"> + <input type="text" name="inputError"> + <span class="help-inline">Something may have gone wrong</span> + </div> </div> - </div> - <div class="control-group error"> - <label class="control-label" for="inputError">Input with error</label> - <div class="controls"> - <input type="text" name="inputError"> - <span class="help-inline">Please correct the error</span> + <div class="control-group error"> + <label class="control-label" for="inputError">Input with error</label> + <div class="controls"> + <input type="text" name="inputError"> + <span class="help-inline">Please correct the error</span> + </div> </div> - </div> - <div class="control-group success"> - <label class="control-label" for="inputError">Input with success</label> - <div class="controls"> - <input type="text" name="inputError"> - <span class="help-inline">Woohoo!</span> + <div class="control-group success"> + <label class="control-label" for="inputError">Input with success</label> + <div class="controls"> + <input type="text" name="inputError"> + <span class="help-inline">Woohoo!</span> + </div> </div> - </div> - <div class="control-group success"> - <label class="control-label" for="selectError">Select with success</label> - <div class="controls"> - <select name="selectError"> - <option>1</option> - <option>2</option> - <option>3</option> - <option>4</option> - <option>5</option> - </select> - <span class="help-inline">Woohoo!</span> + <div class="control-group success"> + <label class="control-label" for="selectError">Select with success</label> + <div class="controls"> + <select name="selectError"> + <option>1</option> + <option>2</option> + <option>3</option> + <option>4</option> + <option>5</option> + </select> + <span class="help-inline">Woohoo!</span> + </div> </div> - </div> - <div class="form-actions"> - <button type="submit" class="btn primary">Save changes</button> - <button type="reset" class="btn">Cancel</button> - </div> + <div class="form-actions"> + <button type="submit" class="btn primary">Save changes</button> + <button type="reset" class="btn">Cancel</button> + </div> + </fieldset> </form> </div> <div class="span4"> @@ -1107,85 +1109,87 @@ <div class="row"> <div class="span8"> <form class="form-horizontal"> - <legend>Extending form controls</legend> - <div class="control-group"> - <label class="control-label">Form sizes</label> - <div class="controls docs-input-sizes"> - <input class="span2" type="text" name="" placeholder=".span2"> - <input class="span3" type="text" name="" placeholder=".span3"> - <input class="span4" type="text" name="" placeholder=".span4"> - <p class="help-block">Use the same <code>.span*</code> classes from the grid system for input sizes.</p> + <fieldset> + <legend>Extending form controls</legend> + <div class="control-group"> + <label class="control-label">Form sizes</label> + <div class="controls docs-input-sizes"> + <input class="span2" type="text" name="" placeholder=".span2"> + <input class="span3" type="text" name="" placeholder=".span3"> + <input class="span4" type="text" name="" placeholder=".span4"> + <p class="help-block">Use the same <code>.span*</code> classes from the grid system for input sizes.</p> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="prependedInput">Prepended text</label> - <div class="controls"> - <div class="input-prepend"> - <span class="add-on">@</span> - <input class="span2" id="prependedInput" name="prependedInput" size="16" type="text"> + <div class="control-group"> + <label class="control-label" for="prependedInput">Prepended text</label> + <div class="controls"> + <div class="input-prepend"> + <span class="add-on">@</span> + <input class="span2" id="prependedInput" name="prependedInput" size="16" type="text"> + </div> + <p class="help-block">Here's some help text</p> </div> - <p class="help-block">Here's some help text</p> </div> - </div> - <div class="control-group"> - <label class="control-label" for="appendedInput">Appended text</label> - <div class="controls"> - <div class="input-append"> - <input class="span2" id="appendedInput" name="appendedInput" size="16" type="text"> - <span class="add-on">.00</span> + <div class="control-group"> + <label class="control-label" for="appendedInput">Appended text</label> + <div class="controls"> + <div class="input-append"> + <input class="span2" id="appendedInput" name="appendedInput" size="16" type="text"> + <span class="add-on">.00</span> + </div> + <p class="help-block">Here's more help text</p> </div> - <p class="help-block">Here's more help text</p> </div> - </div> - <div class="control-group"> - <label class="control-label" for="inlineCheckboxes">Inline checkboxes</label> - <div class="controls"> - <label class="checkbox inline"> - <input type="checkbox" name="inlineCheckbox1" value="option1"> 1 - </label> - <label class="checkbox inline"> - <input type="checkbox" name="inlineCheckbox1" value="option1"> 2 - </label> - <label class="checkbox inline"> - <input type="checkbox" name="inlineCheckbox1" value="option1"> 3 - </label> + <div class="control-group"> + <label class="control-label" for="inlineCheckboxes">Inline checkboxes</label> + <div class="controls"> + <label class="checkbox inline"> + <input type="checkbox" name="inlineCheckbox1" value="option1"> 1 + </label> + <label class="checkbox inline"> + <input type="checkbox" name="inlineCheckbox1" value="option1"> 2 + </label> + <label class="checkbox inline"> + <input type="checkbox" name="inlineCheckbox1" value="option1"> 3 + </label> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="optionsCheckboxes">Checkboxes</label> - <div class="controls"> - <label class="checkbox"> - <input type="checkbox" name="optionsCheckboxes" value="option1"> - Option one is this and that—be sure to include why it’s great - </label> - <label class="checkbox"> - <input type="checkbox" name="optionsCheckboxes" value="option2"> - Option two can also be checked and included in form results - </label> - <label class="checkbox"> - <input type="checkbox" name="optionsCheckboxes" value="option3"> - Option three can—yes, you guessed it—also be checked and included in form results - </label> - <p class="help-text"><strong>Note:</strong> Labels surround all the options for much larger click areas and a more usable form.</p> + <div class="control-group"> + <label class="control-label" for="optionsCheckboxes">Checkboxes</label> + <div class="controls"> + <label class="checkbox"> + <input type="checkbox" name="optionsCheckboxes" value="option1"> + Option one is this and that—be sure to include why it’s great + </label> + <label class="checkbox"> + <input type="checkbox" name="optionsCheckboxes" value="option2"> + Option two can also be checked and included in form results + </label> + <label class="checkbox"> + <input type="checkbox" name="optionsCheckboxes" value="option3"> + Option three can—yes, you guessed it—also be checked and included in form results + </label> + <p class="help-text"><strong>Note:</strong> Labels surround all the options for much larger click areas and a more usable form.</p> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="optionsRadios">Radio buttons</label> - <div class="controls"> - <label class="radio"> - <input type="radio" checked name="optionsRadios" value="option1"> - Option one is this and that—be sure to include why it’s great - </label> - <label class="radio"> - <input type="radio" name="optionsRadios" value="option2"> - Option two can is something else and selecting it will deselect option one - </label> + <div class="control-group"> + <label class="control-label" for="optionsRadios">Radio buttons</label> + <div class="controls"> + <label class="radio"> + <input type="radio" checked name="optionsRadios" value="option1"> + Option one is this and that—be sure to include why it’s great + </label> + <label class="radio"> + <input type="radio" name="optionsRadios" value="option2"> + Option two can is something else and selecting it will deselect option one + </label> + </div> </div> - </div> - <div class="form-actions"> - <button type="submit" class="btn primary">Save changes</button> - <button type="reset" class="btn">Cancel</button> - </div> + <div class="form-actions"> + <button type="submit" class="btn primary">Save changes</button> + <button type="reset" class="btn">Cancel</button> + </div> + </fieldset> </form> </div> <div class="span4"> diff --git a/docs/download.html b/docs/download.html index e873b5e74..d4c31ed4d 100644 --- a/docs/download.html +++ b/docs/download.html @@ -69,11 +69,19 @@ <!-- Masthead ================================================== --> <header class="jumbotron subhead" id="overview"> - <h1>Download and customize Bootstrap</h1> + <h1>Download and customize</h1> <p class="lead"><a href="https://github.com/twitter/bootstrap/zipball/master">Download the full repository</a> or customize your entire Bootstrap build by selecting only the components, javascript plugins, and assets you need.</p> + <div class="subnav"> + <ul class="nav pills"> + <li><a href="#components">1. Select components</a></li> + <li><a href="#variables">2. Modify variables</a></li> + <li><a href="#plugins">3. Select jQuery plugins</a></li> + <li><a href="#download">4. Build and download</a></li> + </ul> + </div> </header> -<div class="download"> +<section class="download" id="components"> <div class="page-header"> <a class="pull-right toggle-all" href="#">Toggle all</a> <h1> @@ -131,7 +139,9 @@ <label class="checkbox"><input type="checkbox" value=""> Max-width 1210px</label> </div><!-- /span --> </div><!-- /row --> +</section> +<section class="download" id="variables"> <div class="page-header"> <a class="pull-right toggle-all" href="#">Reset to defaults</a> <h1> @@ -207,7 +217,9 @@ <input type="text" class="span3" value="#bfe1f2"> </div><!-- /span --> </div><!-- /row --> +</section> +<section class="download" id="plugins"> <div class="page-header"> <a class="pull-right toggle-all" href="#">Toggle all</a> <h1> @@ -273,11 +285,21 @@ <p class="muted">All plugins require the latest version of <a href="http://jquery.com/" target="_blank">jQuery</a> to be included.</p> </div><!-- /span --> </div><!-- /row --> +</section> +<section class="download" id="download"> + <div class="page-header"> + <h1> + 4. Download + <small></small> + </h1> + </div> <div class="download-btn"> <a class="btn xlarge primary" href="#">Build and Download</a> + <h4>What's included?</h4> + <p>Downloads include compiled CSS, compiled and minified CSS, and compiled jQuery plugins, all nicely packed up into a zipball for your convenience.</p> </div> -</div><!-- /download --> +</section><!-- /download --> <!-- Footer ================================================== --> diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache index 7a85d1138..cbc0519e5 100644 --- a/docs/templates/pages/base-css.mustache +++ b/docs/templates/pages/base-css.mustache @@ -959,66 +959,68 @@ <div class="row"> <div class="span8"> <form class="form-horizontal"> - <legend>{{_i}}Form control states{{/i}}</legend> - <div class="control-group"> - <label class="control-label" for="focusedInput">{{_i}}Focused input{{/i}}</label> - <div class="controls"> - <input class="input-xlarge focused" id="focusedInput" name="focusedInput" type="text" value="{{_i}}This is focused…{{/i}}"> + <fieldset> + <legend>{{_i}}Form control states{{/i}}</legend> + <div class="control-group"> + <label class="control-label" for="focusedInput">{{_i}}Focused input{{/i}}</label> + <div class="controls"> + <input class="input-xlarge focused" id="focusedInput" name="focusedInput" type="text" value="{{_i}}This is focused…{{/i}}"> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="disabledInput">{{_i}}Disabled input{{/i}}</label> - <div class="controls"> - <input class="input-xlarge disabled" id="disabledInput" name="disabledInput" type="text" placeholder="{{_i}}Disabled input here…{{/i}}" disabled> + <div class="control-group"> + <label class="control-label" for="disabledInput">{{_i}}Disabled input{{/i}}</label> + <div class="controls"> + <input class="input-xlarge disabled" id="disabledInput" name="disabledInput" type="text" placeholder="{{_i}}Disabled input here…{{/i}}" disabled> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="optionsCheckbox">{{_i}}Disabled checkbox{{/i}}</label> - <div class="controls"> - <label class="checkbox"> - <input type="checkbox" name="optionsCheckbox" value="option1" disabled> - {{_i}}This is a disabled checkbox{{/i}} - </label> + <div class="control-group"> + <label class="control-label" for="optionsCheckbox">{{_i}}Disabled checkbox{{/i}}</label> + <div class="controls"> + <label class="checkbox"> + <input type="checkbox" name="optionsCheckbox" value="option1" disabled> + {{_i}}This is a disabled checkbox{{/i}} + </label> + </div> </div> - </div> - <div class="control-group warning"> - <label class="control-label" for="inputError">{{_i}}Input with warning{{/i}}</label> - <div class="controls"> - <input type="text" name="inputError"> - <span class="help-inline">{{_i}}Something may have gone wrong{{/i}}</span> + <div class="control-group warning"> + <label class="control-label" for="inputError">{{_i}}Input with warning{{/i}}</label> + <div class="controls"> + <input type="text" name="inputError"> + <span class="help-inline">{{_i}}Something may have gone wrong{{/i}}</span> + </div> </div> - </div> - <div class="control-group error"> - <label class="control-label" for="inputError">{{_i}}Input with error{{/i}}</label> - <div class="controls"> - <input type="text" name="inputError"> - <span class="help-inline">{{_i}}Please correct the error{{/i}}</span> + <div class="control-group error"> + <label class="control-label" for="inputError">{{_i}}Input with error{{/i}}</label> + <div class="controls"> + <input type="text" name="inputError"> + <span class="help-inline">{{_i}}Please correct the error{{/i}}</span> + </div> </div> - </div> - <div class="control-group success"> - <label class="control-label" for="inputError">{{_i}}Input with success{{/i}}</label> - <div class="controls"> - <input type="text" name="inputError"> - <span class="help-inline">{{_i}}Woohoo!{{/i}}</span> + <div class="control-group success"> + <label class="control-label" for="inputError">{{_i}}Input with success{{/i}}</label> + <div class="controls"> + <input type="text" name="inputError"> + <span class="help-inline">{{_i}}Woohoo!{{/i}}</span> + </div> </div> - </div> - <div class="control-group success"> - <label class="control-label" for="selectError">{{_i}}Select with success{{/i}}</label> - <div class="controls"> - <select name="selectError"> - <option>1</option> - <option>2</option> - <option>3</option> - <option>4</option> - <option>5</option> - </select> - <span class="help-inline">{{_i}}Woohoo!{{/i}}</span> + <div class="control-group success"> + <label class="control-label" for="selectError">{{_i}}Select with success{{/i}}</label> + <div class="controls"> + <select name="selectError"> + <option>1</option> + <option>2</option> + <option>3</option> + <option>4</option> + <option>5</option> + </select> + <span class="help-inline">{{_i}}Woohoo!{{/i}}</span> + </div> </div> - </div> - <div class="form-actions"> - <button type="submit" class="btn primary">{{_i}}Save changes{{/i}}</button> - <button type="reset" class="btn">{{_i}}Cancel{{/i}}</button> - </div> + <div class="form-actions"> + <button type="submit" class="btn primary">{{_i}}Save changes{{/i}}</button> + <button type="reset" class="btn">{{_i}}Cancel{{/i}}</button> + </div> + </fieldset> </form> </div> <div class="span4"> @@ -1043,85 +1045,87 @@ <div class="row"> <div class="span8"> <form class="form-horizontal"> - <legend>{{_i}}Extending form controls{{/i}}</legend> - <div class="control-group"> - <label class="control-label">{{_i}}Form sizes{{/i}}</label> - <div class="controls docs-input-sizes"> - <input class="span2" type="text" name="" placeholder=".span2"> - <input class="span3" type="text" name="" placeholder=".span3"> - <input class="span4" type="text" name="" placeholder=".span4"> - <p class="help-block">{{_i}}Use the same <code>.span*</code> classes from the grid system for input sizes.{{/i}}</p> + <fieldset> + <legend>{{_i}}Extending form controls{{/i}}</legend> + <div class="control-group"> + <label class="control-label">{{_i}}Form sizes{{/i}}</label> + <div class="controls docs-input-sizes"> + <input class="span2" type="text" name="" placeholder=".span2"> + <input class="span3" type="text" name="" placeholder=".span3"> + <input class="span4" type="text" name="" placeholder=".span4"> + <p class="help-block">{{_i}}Use the same <code>.span*</code> classes from the grid system for input sizes.{{/i}}</p> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="prependedInput">{{_i}}Prepended text{{/i}}</label> - <div class="controls"> - <div class="input-prepend"> - <span class="add-on">@</span> - <input class="span2" id="prependedInput" name="prependedInput" size="16" type="text"> + <div class="control-group"> + <label class="control-label" for="prependedInput">{{_i}}Prepended text{{/i}}</label> + <div class="controls"> + <div class="input-prepend"> + <span class="add-on">@</span> + <input class="span2" id="prependedInput" name="prependedInput" size="16" type="text"> + </div> + <p class="help-block">{{_i}}Here's some help text{{/i}}</p> </div> - <p class="help-block">{{_i}}Here's some help text{{/i}}</p> </div> - </div> - <div class="control-group"> - <label class="control-label" for="appendedInput">{{_i}}Appended text{{/i}}</label> - <div class="controls"> - <div class="input-append"> - <input class="span2" id="appendedInput" name="appendedInput" size="16" type="text"> - <span class="add-on">.00</span> + <div class="control-group"> + <label class="control-label" for="appendedInput">{{_i}}Appended text{{/i}}</label> + <div class="controls"> + <div class="input-append"> + <input class="span2" id="appendedInput" name="appendedInput" size="16" type="text"> + <span class="add-on">.00</span> + </div> + <p class="help-block">{{_i}}Here's more help text{{/i}}</p> </div> - <p class="help-block">{{_i}}Here's more help text{{/i}}</p> </div> - </div> - <div class="control-group"> - <label class="control-label" for="inlineCheckboxes">{{_i}}Inline checkboxes{{/i}}</label> - <div class="controls"> - <label class="checkbox inline"> - <input type="checkbox" name="inlineCheckbox1" value="option1"> 1 - </label> - <label class="checkbox inline"> - <input type="checkbox" name="inlineCheckbox1" value="option1"> 2 - </label> - <label class="checkbox inline"> - <input type="checkbox" name="inlineCheckbox1" value="option1"> 3 - </label> + <div class="control-group"> + <label class="control-label" for="inlineCheckboxes">{{_i}}Inline checkboxes{{/i}}</label> + <div class="controls"> + <label class="checkbox inline"> + <input type="checkbox" name="inlineCheckbox1" value="option1"> 1 + </label> + <label class="checkbox inline"> + <input type="checkbox" name="inlineCheckbox1" value="option1"> 2 + </label> + <label class="checkbox inline"> + <input type="checkbox" name="inlineCheckbox1" value="option1"> 3 + </label> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="optionsCheckboxes">{{_i}}Checkboxes{{/i}}</label> - <div class="controls"> - <label class="checkbox"> - <input type="checkbox" name="optionsCheckboxes" value="option1"> - {{_i}}Option one is this and that—be sure to include why it’s great{{/i}} - </label> - <label class="checkbox"> - <input type="checkbox" name="optionsCheckboxes" value="option2"> - {{_i}}Option two can also be checked and included in form results{{/i}} - </label> - <label class="checkbox"> - <input type="checkbox" name="optionsCheckboxes" value="option3"> - {{_i}}Option three can—yes, you guessed it—also be checked and included in form results{{/i}} - </label> - <p class="help-text">{{_i}}<strong>Note:</strong> Labels surround all the options for much larger click areas and a more usable form.{{/i}}</p> + <div class="control-group"> + <label class="control-label" for="optionsCheckboxes">{{_i}}Checkboxes{{/i}}</label> + <div class="controls"> + <label class="checkbox"> + <input type="checkbox" name="optionsCheckboxes" value="option1"> + {{_i}}Option one is this and that—be sure to include why it’s great{{/i}} + </label> + <label class="checkbox"> + <input type="checkbox" name="optionsCheckboxes" value="option2"> + {{_i}}Option two can also be checked and included in form results{{/i}} + </label> + <label class="checkbox"> + <input type="checkbox" name="optionsCheckboxes" value="option3"> + {{_i}}Option three can—yes, you guessed it—also be checked and included in form results{{/i}} + </label> + <p class="help-text">{{_i}}<strong>Note:</strong> Labels surround all the options for much larger click areas and a more usable form.{{/i}}</p> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="optionsRadios">{{_i}}Radio buttons{{/i}}</label> - <div class="controls"> - <label class="radio"> - <input type="radio" checked name="optionsRadios" value="option1"> - {{_i}}Option one is this and that—be sure to include why it’s great{{/i}} - </label> - <label class="radio"> - <input type="radio" name="optionsRadios" value="option2"> - {{_i}}Option two can is something else and selecting it will deselect option one{{/i}} - </label> + <div class="control-group"> + <label class="control-label" for="optionsRadios">{{_i}}Radio buttons{{/i}}</label> + <div class="controls"> + <label class="radio"> + <input type="radio" checked name="optionsRadios" value="option1"> + {{_i}}Option one is this and that—be sure to include why it’s great{{/i}} + </label> + <label class="radio"> + <input type="radio" name="optionsRadios" value="option2"> + {{_i}}Option two can is something else and selecting it will deselect option one{{/i}} + </label> + </div> </div> - </div> - <div class="form-actions"> - <button type="submit" class="btn primary">{{_i}}Save changes{{/i}}</button> - <button type="reset" class="btn">{{_i}}Cancel{{/i}}</button> - </div> + <div class="form-actions"> + <button type="submit" class="btn primary">{{_i}}Save changes{{/i}}</button> + <button type="reset" class="btn">{{_i}}Cancel{{/i}}</button> + </div> + </fieldset> </form> </div> <div class="span4"> diff --git a/docs/templates/pages/download.mustache b/docs/templates/pages/download.mustache index 453bf1141..216098bad 100644 --- a/docs/templates/pages/download.mustache +++ b/docs/templates/pages/download.mustache @@ -5,11 +5,19 @@ <!-- Masthead ================================================== --> <header class="jumbotron subhead" id="overview"> - <h1>{{_i}}Download and customize Bootstrap{{/i}}</h1> + <h1>{{_i}}Download and customize{{/i}}</h1> <p class="lead">{{_i}}<a href="https://github.com/twitter/bootstrap/zipball/master">Download the full repository</a> or customize your entire Bootstrap build by selecting only the components, javascript plugins, and assets you need.{{/i}}</p> + <div class="subnav"> + <ul class="nav pills"> + <li><a href="#components">{{_i}}1. Select components{{/i}}</a></li> + <li><a href="#variables">{{_i}}2. Modify variables{{/i}}</a></li> + <li><a href="#plugins">{{_i}}3. Select jQuery plugins{{/i}}</a></li> + <li><a href="#download">{{_i}}4. Build and download{{/i}}</a></li> + </ul> + </div> </header> -<div class="download"> +<section class="download" id="components"> <div class="page-header"> <a class="pull-right toggle-all" href="#">Toggle all</a> <h1> @@ -67,7 +75,9 @@ <label class="checkbox"><input type="checkbox" value=""> Max-width 1210px</label> </div><!-- /span --> </div><!-- /row --> +</section> +<section class="download" id="variables"> <div class="page-header"> <a class="pull-right toggle-all" href="#">Reset to defaults</a> <h1> @@ -143,7 +153,9 @@ <input type="text" class="span3" value="#bfe1f2"> </div><!-- /span --> </div><!-- /row --> +</section> +<section class="download" id="plugins"> <div class="page-header"> <a class="pull-right toggle-all" href="#">Toggle all</a> <h1> @@ -209,8 +221,18 @@ <p class="muted">{{_i}}All plugins require the latest version of <a href="http://jquery.com/" target="_blank">jQuery</a> to be included.{{/i}}</p> </div><!-- /span --> </div><!-- /row --> +</section> +<section class="download" id="download"> + <div class="page-header"> + <h1> + 4. Download + <small></small> + </h1> + </div> <div class="download-btn"> <a class="btn xlarge primary" href="#">Build and Download</a> + <h4>What's included?</h4> + <p>Downloads include compiled CSS, compiled and minified CSS, and compiled jQuery plugins, all nicely packed up into a zipball for your convenience.</p> </div> -</div><!-- /download --> +</section><!-- /download --> |
