Skip to content

B
bootstrap
Commit de53f62a authored by Mark Otto's avatar Mark Otto
Browse files
Options

more changes to js and components, playing with new docs subnav

parent 47e2c434
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1079 additions and 1187 deletions
docs/assets/css/docs.css
View file @ de53f62a
...@@ -11,12 +11,18 @@ ...@@ -11,12 +11,18 @@
body { body {
position: relative; position: relative;
padding-top: 90px; padding-top: 90px;
font-size: 14px;
background-color: #fff; background-color: #fff;
background-image: url(../img/grid-18px-masked.png); background-image: url(../img/grid-18px-masked.png);
background-repeat: repeat-x; background-repeat: repeat-x;
background-position: 0 40px; background-position: 0 40px;
} }
body,
li {
line-height: 20px;
}
.bs-docs-container { .bs-docs-container {
max-width: 780px; max-width: 780px;
margin: 0 auto; margin: 0 auto;
...@@ -24,6 +30,9 @@ body { ...@@ -24,6 +30,9 @@ body {
/* Tweak navbar brand link to be super sleek /* Tweak navbar brand link to be super sleek
-------------------------------------------------- */ -------------------------------------------------- */
.navbar {
font-size: 13px;
}
.navbar-fixed-top .brand { .navbar-fixed-top .brand {
padding-right: 0; padding-right: 0;
padding-left: 0; padding-left: 0;
...@@ -603,7 +612,6 @@ form.well { ...@@ -603,7 +612,6 @@ form.well {
.bs-docs-example > p { .bs-docs-example > p {
font-size: 13px; font-size: 13px;
line-height: 18px; line-height: 18px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
} }
.bs-docs-example p:last-child { .bs-docs-example p:last-child {
margin-bottom: 0; margin-bottom: 0;
......
docs/components.html
View file @ de53f62a
This diff is collapsed.
docs/javascript.html
View file @ de53f62a
...@@ -76,94 +76,94 @@ ...@@ -76,94 +76,94 @@
<div class="bs-docs-container"> <div class="bs-docs-container">
<!-- Masthead <!-- Masthead
================================================== --> ================================================== -->
<header class="jumbotron subhead" id="overview"> <header class="jumbotron subhead" id="overview">
<h1>Javascript for Bootstrap</h1> <h1>Javascript for Bootstrap</h1>
<p class="lead">Bring Bootstrap's components to life&mdash;now with 12 custom <a href="http://jquery.com/" target="_blank">jQuery</a> plugins. <p class="lead">Bring Bootstrap's components to life&mdash;now with 12 custom <a href="http://jquery.com/" target="_blank">jQuery</a> plugins.
<div class="subnav"> <div class="subnav">
<ul class="nav nav-pills"> <ul class="nav nav-pills">
<li><a href="#javascript">All plugins</a></li> <li><a href="#javascript">All plugins</a></li>
<li><a href="#modals">Modal</a></li> <li><a href="#modals">Modal</a></li>
<li><a href="#dropdowns">Dropdown</a></li> <li><a href="#dropdowns">Dropdown</a></li>
<li><a href="#scrollspy">Scrollspy</a></li> <li><a href="#scrollspy">Scrollspy</a></li>
<li><a href="#tabs">Tab</a></li> <li><a href="#tabs">Tab</a></li>
<li><a href="#tooltips">Tooltip</a></li> <li><a href="#tooltips">Tooltip</a></li>
<li><a href="#popovers">Popover</a></li> <li><a href="#popovers">Popover</a></li>
<li><a href="#alerts">Alert</a></li> <li><a href="#alerts">Alert</a></li>
<li><a href="#buttons">Button</a></li> <li><a href="#buttons">Button</a></li>
<li><a href="#collapse">Collapse</a></li> <li><a href="#collapse">Collapse</a></li>
<li><a href="#carousel">Carousel</a></li> <li><a href="#carousel">Carousel</a></li>
<li><a href="#typeahead">Typeahead</a></li> <li><a href="#typeahead">Typeahead</a></li>
</ul> </ul>
</div> </div>
</header> </header>
<!-- Using Javascript w/ Bootstrap <!-- Using Javascript w/ Bootstrap
================================================== --> ================================================== -->
<section id="javascript"> <section id="javascript">
<div class="page-header"> <div class="page-header">
<h1>jQuery plugins <small>A dozen Bootstrap plugins to get you started</small></h1> <h1>jQuery plugins <small>A dozen Bootstrap plugins to get you started</small></h1>
</div> </div>
<div class="row"> <div class="row">
<div class="span3"> <div class="span4">
<h3><a href="./javascript.html#modals">Modals</a></h3> <h3><a href="./javascript.html#modals">Modals</a></h3>
<p>A streamlined, but flexible, take on the traditional javascript modal plugin with only the minimum required functionality and smart defaults.</p> <p>A streamlined, but flexible, take on the traditional javascript modal plugin with only the minimum required functionality and smart defaults.</p>
</div> </div>
<div class="span3"> <div class="span4">
<h3><a href="./javascript.html#dropdowns">Dropdowns</a></h3> <h3><a href="./javascript.html#dropdowns">Dropdowns</a></h3>
<p>Add dropdown menus to nearly anything in Bootstrap with this simple plugin. Bootstrap features full dropdown menu support on in the navbar, tabs, and pills.</p> <p>Add dropdown menus to nearly anything in Bootstrap with this simple plugin. Bootstrap features full dropdown menu support on in the navbar, tabs, and pills.</p>
</div> </div>
<div class="span3"> <div class="span4">
<h3><a href="./javascript.html#scrollspy">Scrollspy</a></h3> <h3><a href="./javascript.html#scrollspy">Scrollspy</a></h3>
<p>Use scrollspy to automatically update the links in your navbar to show the current active link based on scroll position.</p> <p>Use scrollspy to automatically update the links in your navbar to show the current active link based on scroll position.</p>
</div> </div>
<div class="span3"> <div class="span4">
<h3><a href="./javascript.html#tabs">Togglable tabs</a></h3> <h3><a href="./javascript.html#tabs">Togglable tabs</a></h3>
<p>Use this plugin to make tabs and pills more useful by allowing them to toggle through tabbable panes of local content.</p> <p>Use this plugin to make tabs and pills more useful by allowing them to toggle through tabbable panes of local content.</p>
</div> </div>
</div> <!-- /row --> </div> <!-- /row -->
<div class="row"> <div class="row">
<div class="span3"> <div class="span4">
<h3><a href="./javascript.html#tooltips">Tooltips</a></h3> <h3><a href="./javascript.html#tooltips">Tooltips</a></h3>
<p>A new take on the jQuery Tipsy plugin, Tooltips don't rely on images&mdash;they use CSS3 for animations and data-attributes for local title storage.</p> <p>A new take on the jQuery Tipsy plugin, Tooltips don't rely on images&mdash;they use CSS3 for animations and data-attributes for local title storage.</p>
</div> </div>
<div class="span3"> <div class="span4">
<h3><a href="./javascript.html#popovers">Popovers</a> <small class="muted">*</small></h3> <h3><a href="./javascript.html#popovers">Popovers</a> <small class="muted">*</small></h3>
<p>Add small overlays of content, like those on the iPad, to any element for housing secondary information.</p> <p>Add small overlays of content, like those on the iPad, to any element for housing secondary information.</p>
<p class="muted"><strong>*</strong> Requires <a href="#tooltips">Tooltips</a> to be included</p> <p class="muted"><strong>*</strong> Requires <a href="#tooltips">Tooltips</a> to be included</p>
</div> </div>
<div class="span3"> <div class="span4">
<h3><a href="./javascript.html#alerts">Alert messages</a></h3> <h3><a href="./javascript.html#alerts">Alert messages</a></h3>
<p>The alert plugin is a tiny class for adding close functionality to alerts.</p> <p>The alert plugin is a tiny class for adding close functionality to alerts.</p>
</div> </div>
<div class="span3"> <div class="span4">
<h3><a href="./javascript.html#buttons">Buttons</a></h3> <h3><a href="./javascript.html#buttons">Buttons</a></h3>
<p>Do more with buttons. Control button states or create groups of buttons for more components like toolbars.</p> <p>Do more with buttons. Control button states or create groups of buttons for more components like toolbars.</p>
</div> </div>
</div> <!-- /row --> </div> <!-- /row -->
<div class="row" style="margin-bottom: 9px;"> <div class="row" style="margin-bottom: 9px;">
<div class="span3"> <div class="span4">
<h3><a href="./javascript.html#collapse">Collapse</a></h3> <h3><a href="./javascript.html#collapse">Collapse</a></h3>
<p>Get base styles and flexible support for collapsible components like accordions and navigation.</p> <p>Get base styles and flexible support for collapsible components like accordions and navigation.</p>
</div> </div>
<div class="span3"> <div class="span4">
<h3><a href="./javascript.html#carousel">Carousel</a></h3> <h3><a href="./javascript.html#carousel">Carousel</a></h3>
<p>Create a merry-go-round of any content you wish to provide an interactive slideshow of content.</p> <p>Create a merry-go-round of any content you wish to provide an interactive slideshow of content.</p>
</div> </div>
<div class="span3"> <div class="span4">
<h3><a href="./javascript.html#typeahead">Typeahead</a></h3> <h3><a href="./javascript.html#typeahead">Typeahead</a></h3>
<p>A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.</p> <p>A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.</p>
</div> </div>
<div class="span3"> <div class="span4">
<h3>Transitions <small class="muted">*</small></h3> <h3>Transitions <small class="muted">*</small></h3>
<p>For simple transition effects, include bootstrap-transition.js once to slide in modals or fade out alerts.</p> <p>For simple transition effects, include bootstrap-transition.js once to slide in modals or fade out alerts.</p>
<p class="muted"><strong>*</strong> Required for animation in plugins</p> <p class="muted"><strong>*</strong> Required for animation in plugins</p>
</div> </div>
</div> <!-- /row --> </div> <!-- /row -->
<div class="alert alert-info"><strong>Heads up!</strong> If you have downloaded the latest version of Bootstrap, both <strong>bootstrap.js</strong> and <strong>bootstrap.min.js</strong> contain all of these plugins.</div> <div class="alert alert-info"><strong>Heads up!</strong> If you have downloaded the latest version of Bootstrap, both <strong>bootstrap.js</strong> and <strong>bootstrap.min.js</strong> contain all of these plugins.</div>
</section> </section>
......
docs/scaffolding.html
View file @ de53f62a
...@@ -81,7 +81,20 @@ ...@@ -81,7 +81,20 @@
<header class="jumbotron subhead" id="overview"> <header class="jumbotron subhead" id="overview">
<h1>Scaffolding</h1> <h1>Scaffolding</h1>
<p class="lead">Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.</p> <p class="lead">Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.</p>
<div class="subnav">
<div class="bs-docs-contents">
<h4>Contents</h4>
<ul>
<li><a href="#global">Global styles</a></li>
<li><a href="#gridSystem">Grid system</a></li>
<li><a href="#fluidGridSystem">Fluid grid system</a></li>
<li><a href="#gridCustomization">Customizing</a></li>
<li><a href="#layouts">Layouts</a></li>
<li><a href="#responsive">Responsive design</a></li>
</ul>
</div>
<!-- <div class="subnav">
<ul class="nav nav-pills"> <ul class="nav nav-pills">
<li><a href="#global">Global styles</a></li> <li><a href="#global">Global styles</a></li>
<li><a href="#gridSystem">Grid system</a></li> <li><a href="#gridSystem">Grid system</a></li>
...@@ -91,7 +104,7 @@ ...@@ -91,7 +104,7 @@
<li><a href="#responsive">Responsive design</a></li> <li><a href="#responsive">Responsive design</a></li>
</ul> </ul>
</div> </div>
</header> --></header>
......
docs/templates/pages/components.mustache
View file @ de53f62a
This diff is collapsed.
docs/templates/pages/javascript.mustache
View file @ de53f62a
This diff is collapsed.
docs/templates/pages/scaffolding.mustache
View file @ de53f62a
...@@ -3,7 +3,20 @@ ...@@ -3,7 +3,20 @@
<header class="jumbotron subhead" id="overview"> <header class="jumbotron subhead" id="overview">
<h1>{{_i}}Scaffolding{{/i}}</h1> <h1>{{_i}}Scaffolding{{/i}}</h1>
<p class="lead">{{_i}}Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.{{/i}}</p> <p class="lead">{{_i}}Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.{{/i}}</p>
<div class="subnav">
<div class="bs-docs-contents">
<h4>Contents</h4>
<ul>
<li><a href="#global">{{_i}}Global styles{{/i}}</a></li>
<li><a href="#gridSystem">{{_i}}Grid system{{/i}}</a></li>
<li><a href="#fluidGridSystem">{{_i}}Fluid grid system{{/i}}</a></li>
<li><a href="#gridCustomization">{{_i}}Customizing{{/i}}</a></li>
<li><a href="#layouts">{{_i}}Layouts{{/i}}</a></li>
<li><a href="#responsive">{{_i}}Responsive design{{/i}}</a></li>
</ul>
</div>
<!-- <div class="subnav">
<ul class="nav nav-pills"> <ul class="nav nav-pills">
<li><a href="#global">{{_i}}Global styles{{/i}}</a></li> <li><a href="#global">{{_i}}Global styles{{/i}}</a></li>
<li><a href="#gridSystem">{{_i}}Grid system{{/i}}</a></li> <li><a href="#gridSystem">{{_i}}Grid system{{/i}}</a></li>
...@@ -13,7 +26,7 @@ ...@@ -13,7 +26,7 @@
<li><a href="#responsive">{{_i}}Responsive design{{/i}}</a></li> <li><a href="#responsive">{{_i}}Responsive design{{/i}}</a></li>
</ul> </ul>
</div> </div>
</header> --></header>
......
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