diff options
Diffstat (limited to 'docs/index.html')
| -rw-r--r-- | docs/index.html | 156 |
1 files changed, 81 insertions, 75 deletions
diff --git a/docs/index.html b/docs/index.html index ce2a96c22..6cc832344 100644 --- a/docs/index.html +++ b/docs/index.html @@ -878,7 +878,7 @@ <h2>Fixed topbar</h2> <div class="topbar-wrapper" style="z-index: 5;"> <div class="topbar"> - <div class="container fixed"> + <div class="container"> <h3><a href="#">Project Name</a></h3> <ul> <li class="active"><a href="#">Home</a></li> @@ -920,20 +920,20 @@ <br /> -<div class="row"> - <div class="span4 columns"> - <h2>Tabs and pills</h2> - <p>Create simple secondary navigation with a <code><ul></code>. Swap between tabs or pills by adding the appropriate class.</p> - <p>Great for sub-sections of content like our account settings pages and user timelines for toggling between pages of like content. Available in tabbed or pill styles.</p> - </div> - <div class="span12 columns"> -<ul class="tabs"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Profile</a></li> - <li><a href="#">Messages</a></li> - <li><a href="#">Settings</a></li> - <li><a href="#">Contact</a></li> -</ul> + <div class="row"> + <div class="span4 columns"> + <h2>Tabs and pills</h2> + <p>Create simple secondary navigation with a <code><ul></code>. Swap between tabs or pills by adding the appropriate class.</p> + <p>Great for sub-sections of content like our account settings pages and user timelines for toggling between pages of like content. Available in tabbed or pill styles.</p> + </div> + <div class="span12 columns"> + <ul class="tabs"> + <li class="active"><a href="#">Home</a></li> + <li><a href="#">Profile</a></li> + <li><a href="#">Messages</a></li> + <li><a href="#">Settings</a></li> + <li><a href="#">Contact</a></li> + </ul> <pre class="prettyprint linenums"> <ul class="tabs"> <li class="active"><a href="#">Home</a></li> @@ -943,13 +943,13 @@ <li><a href="#">Contact</a></li> </ul> </pre> -<ul class="pills"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Profile</a></li> - <li><a href="#">Messages</a></li> - <li><a href="#">Settings</a></li> - <li><a href="#">Contact</a></li> -</ul> + <ul class="pills"> + <li class="active"><a href="#">Home</a></li> + <li><a href="#">Profile</a></li> + <li><a href="#">Messages</a></li> + <li><a href="#">Settings</a></li> + <li><a href="#">Contact</a></li> + </ul> <pre class="prettyprint linenums"> <ul class="pills"> <li class="active"><a href="#">Home</a></li> @@ -959,56 +959,57 @@ <li><a href="#">Contact</a></li> </ul> </pre> - </div> -</div> - -<div class="row"> - <div class="span4 columns"> - <h2>Pagination</h2> - <p>Ultra simplistic and minimally styled pagination inspired by Rdio. The large block is hard to miss, easily scalable, and provides large click areas.</p> - </div> - <div class="span12 columns"> - <div class="pagination"> - <ul> - <li class="prev disabled"><a href="#">← Previous</a></li> - <li class="active"><a href="#">1</a></li> - <li><a href="#">2</a></li> - <li><a href="#">3</a></li> - <li><a href="#">4</a></li> - <li><a href="#">5</a></li> - <li class="next"><a href="#">Next →</a></li> - </ul> - </div> - <div class="pagination"> - <ul> - <li class="prev"><a href="#">← Previous</a></li> - <li class="active"><a href="#">10</a></li> - <li><a href="#">11</a></li> - <li><a href="#">12</a></li> - <li class="disabled"><a href="#">…</a></li> - <li><a href="#">19</a></li> - <li><a href="#">20</a></li> - <li><a href="#">21</a></li> - <li class="next"><a href="#">Next →</a></li> - </ul> </div> - <div class="pagination"> - <ul> - <li class="prev"><a href="#">← Previous</a></li> - <li><a href="#">10</a></li> - <li><a href="#">11</a></li> - <li><a href="#">12</a></li> - <li><a href="#">13</a></li> - <li><a href="#">14</a></li> - <li class="active"><a href="#">15</a></li> - <li><a href="#">16</a></li> - <li><a href="#">17</a></li> - <li><a href="#">18</a></li> - <li><a href="#">19</a></li> - <li><a href="#">20</a></li> - <li class="next"><a href="#">Next →</a></li> - </ul> + </div> <!-- /row --> + + <!-- Pagination --> + <div class="row"> + <div class="span4 columns"> + <h2>Pagination</h2> + <p>Ultra simplistic and minimally styled pagination inspired by Rdio. The large block is hard to miss, easily scalable, and provides large click areas.</p> </div> + <div class="span12 columns"> + <div class="pagination"> + <ul> + <li class="prev disabled"><a href="#">← Previous</a></li> + <li class="active"><a href="#">1</a></li> + <li><a href="#">2</a></li> + <li><a href="#">3</a></li> + <li><a href="#">4</a></li> + <li><a href="#">5</a></li> + <li class="next"><a href="#">Next →</a></li> + </ul> + </div> + <div class="pagination"> + <ul> + <li class="prev"><a href="#">← Previous</a></li> + <li class="active"><a href="#">10</a></li> + <li><a href="#">11</a></li> + <li><a href="#">12</a></li> + <li class="disabled"><a href="#">…</a></li> + <li><a href="#">19</a></li> + <li><a href="#">20</a></li> + <li><a href="#">21</a></li> + <li class="next"><a href="#">Next →</a></li> + </ul> + </div> + <div class="pagination"> + <ul> + <li class="prev"><a href="#">← Previous</a></li> + <li><a href="#">10</a></li> + <li><a href="#">11</a></li> + <li><a href="#">12</a></li> + <li><a href="#">13</a></li> + <li><a href="#">14</a></li> + <li class="active"><a href="#">15</a></li> + <li><a href="#">16</a></li> + <li><a href="#">17</a></li> + <li><a href="#">18</a></li> + <li><a href="#">19</a></li> + <li><a href="#">20</a></li> + <li class="next"><a href="#">Next →</a></li> + </ul> + </div> <pre class="prettyprint linenums"> <div class="pagination"> <ul> @@ -1022,8 +1023,8 @@ </ul> </div> </pre> - </div> -</div> + </div> + </div> <!-- /row --> </section> @@ -1033,6 +1034,7 @@ <div class="page-header"> <h1>Alerts & Errors <small>Styles for success, warning, and error messages or alerts</small></h1> </div> + <!-- Basic alert messages --> <div class="row"> <div class="span4 columns"> <h2>Basic alerts</h2> @@ -1056,7 +1058,8 @@ <p><strong>Heads up!</strong> This is an alert that needs your attention, but it’s not a huge priority just yet.</p> </div> </div> - </div> + </div> <!-- /row --> + <!-- Block messages --> <div class="row"> <div class="span4 columns"> <h2>Block messages</h2> @@ -1084,11 +1087,13 @@ <p><a class="btn small" href="#">Take this action</a> <a class="btn small" href="#">Or do this</a></p> </div> </div> - </div> + </div> <!-- /row --> </section> <section id="popovers"> + + <!-- Popovers, modals, and tooltips --> <div class="page-header"> <h1>Popovers <small>Components for displaying content in modals, tooltips, and popovers</small></h1> </div> @@ -1117,6 +1122,7 @@ </div> </div> <!-- /row --> + <!-- Tooltips --> <div class="row"> <div class="span4 columns"> <h2>Tool Tips</h2> @@ -1149,6 +1155,7 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita </div> </div> <!-- /row --> + <!-- Popovers --> <div class="row"> <div class="span4 columns"> <h2>Popovers</h2> @@ -1172,7 +1179,6 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita </div> </div> <!-- /row --> - </section> |