<meta charset="utf-8">
<title>Bootswatch: Default</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
- <meta name="description" content="">
- <meta name="author" content="">
+ <meta name="description" content="Sleek, intuitive, and powerful front-end framework for faster and easier web development.">
+ <meta name="author" content="Thomas Park">
- <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
- <!-- Le styles -->
<link href="bootstrap.min.css" rel="stylesheet">
- <link href="../assets/css/bootstrap-responsive.css" rel="stylesheet">
- <link href="../assets/css/docs.css" rel="stylesheet">
- <link href="../assets/js/google-code-prettify/prettify.css" rel="stylesheet">
+ <link href="../default/bootstrap-responsive.min.css" rel="stylesheet">
+ <link href="../css/font-awesome.min.css" rel="stylesheet">
+ <link href="../css/bootswatch.css" rel="stylesheet">
- <script type="text/javascript">
+ <script type="text/javascript">
- var _gaq = _gaq || [];
- _gaq.push(['_setAccount', 'UA-23019901-1']);
- _gaq.push(['_setDomainName', "bootswatch.com"]);
- _gaq.push(['_setAllowLinker', true]);
- _gaq.push(['_trackPageview']);
+ var _gaq = _gaq || [];
+ _gaq.push(['_setAccount', 'UA-23019901-1']);
+ _gaq.push(['_setDomainName', "bootswatch.com"]);
+ _gaq.push(['_setAllowLinker', true]);
+ _gaq.push(['_trackPageview']);
- (function() {
- var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
- ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
- var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
- })();
+ (function() {
+ var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+ ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+ })();
- </script>
+ </script>
</head>
- <body data-spy="scroll" data-target=".subnav" data-offset="50">
+ <body class="preview" id="top" data-spy="scroll" data-target=".subnav" data-offset="80">
+ <script src="../js/bsa.js"></script>
<!-- Navbar
<span class="icon-bar"></span>
</a>
<a class="brand" href="../">Bootswatch</a>
- <div class="nav-collapse">
-
+ <div class="nav-collapse collapse" id="main-menu">
+ <ul class="nav" id="main-menu-left">
+ <li><a onclick="pageTracker._link(this.href); return false;" href="http://news.bootswatch.com">News</a></li>
+ <li><a id="swatch-link" href="../#gallery">Gallery</a></li>
+ <li class="dropdown">
+ <a class="dropdown-toggle" data-toggle="dropdown" href="#">Preview <b class="caret"></b></a>
+ <ul class="dropdown-menu" id="swatch-menu">
+ <li><a href="../default/">Default</a></li>
+ <li class="divider"></li>
+ <li><a href="../amelia/">Amelia</a></li>
+ <li><a href="../cerulean/">Cerulean</a></li>
+ <li><a href="../cosmo/">Cosmo</a></li>
+ <li><a href="../cyborg/">Cyborg</a></li>
+ <li><a href="../flatly/">Flatly</a></li>
+ <li><a href="../journal/">Journal</a></li>
+ <li><a href="../readable/">Readable</a></li>
+ <li><a href="../simplex/">Simplex</a></li>
+ <li><a href="../slate/">Slate</a></li>
+ <li><a href="../spacelab/">Spacelab</a></li>
+ <li><a href="../spruce/">Spruce</a></li>
+ <li><a href="../superhero/">Superhero</a></li>
+ <li><a href="../united/">United</a></li>
+ </ul>
+ </li>
+ <li class="dropdown" id="preview-menu">
+ <a class="dropdown-toggle" data-toggle="dropdown" href="#">Download <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a target="_blank" href="bootstrap.min.css">bootstrap.min.css</a></li>
+ <li><a target="_blank" href="bootstrap.css">bootstrap.css</a></li>
+ <li class="divider"></li>
+ <li><a target="_blank" href="variables.less">variables.less</a></li>
+ </ul>
+ </li>
+ </ul>
+ <ul class="nav pull-right" id="main-menu-right">
+ <li><a rel="tooltip" target="_blank" href="http://builtwithbootstrap.com/" title="Showcase of Bootstrap sites & apps" onclick="_gaq.push(['_trackEvent', 'click', 'outbound', 'builtwithbootstrap']);">Built With Bootstrap <i class="icon-share-alt"></i></a></li>
+ <li><a rel="tooltip" target="_blank" href="https://wrapbootstrap.com/?ref=bsw" title="Marketplace for premium Bootstrap templates" onclick="_gaq.push(['_trackEvent', 'click', 'outbound', 'wrapbootstrap']);">WrapBootstrap <i class="icon-share-alt"></i></a></li>
+ </ul>
</div>
</div>
</div>
<!-- Masthead
================================================== -->
<header class="jumbotron subhead" id="overview">
- <h1>Default</h1>
- <p class="lead">The default style of Twitter Bootstrap.</p>
+ <div class="row">
+ <div class="span6">
+ <h1>Default</h1>
+ <p class="lead">The original Bootstrap.</p>
+ </div>
+ <div class="span6">
+ <div class="bsa well">
+ <div id="bsap_1277971" class="bsarocks bsap_c466df00a3cd5ee8568b5c4983b6bb19"></div>
+ </div>
+ </div>
+ </div>
<div class="subnav">
<ul class="nav nav-pills">
<li><a href="#typography">Typography</a></li>
<li><a href="#navbar">Navbar</a></li>
<li><a href="#buttons">Buttons</a></li>
<li><a href="#forms">Forms</a></li>
+ <li><a href="#tables">Tables</a></li>
<li><a href="#miscellaneous">Miscellaneous</a></li>
</ul>
</div>
+
<!-- Typography
================================================== -->
<section id="typography">
<!-- Headings & Paragraph Copy -->
<div class="row">
-
+
<div class="span4">
<div class="well">
<h1>h1. Heading 1</h1>
<h6>h6. Heading 6</h6>
</div>
</div>
-
+
<div class="span4">
<h3>Example body text</h3>
<p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui.</p>
</div>
-
+
<div class="span4">
<h3>Example addresses</h3>
<address>
</div>
</div>
+
+ <div class="row">
+ <div class="span6">
+ <blockquote>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
+ <small>Someone famous in <cite title="Source Title">Source Title</cite></small>
+ </blockquote>
+ </div>
+ <div class="span6">
+ <blockquote class="pull-right">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
+ <small>Someone famous in <cite title="Source Title">Source Title</cite></small>
+ </blockquote>
+ </div>
+ </div>
</section>
+
<!-- Navbar
================================================== -->
<section id="navbar">
<div class="page-header">
- <h1>Navbar</h1>
+ <h1>Navbars</h1>
</div>
<div class="navbar">
<div class="navbar-inner">
</div><!-- /navbar-inner -->
</div><!-- /navbar -->
+ <div class="navbar navbar-inverse">
+ <div class="navbar-inner">
+ <div class="container" style="width: auto;">
+ <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </a>
+ <a class="brand" href="#">Project name</a>
+ <div class="nav-collapse">
+ <ul class="nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#">Link</a></li>
+ <li><a href="#">Link</a></li>
+ <li><a href="#">Link</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ <form class="navbar-search pull-left" action="">
+ <input type="text" class="search-query span2" placeholder="Search">
+ </form>
+ <ul class="nav pull-right">
+ <li><a href="#">Link</a></li>
+ <li class="divider-vertical"></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ </div><!-- /.nav-collapse -->
+ </div>
+ </div><!-- /navbar-inner -->
+ </div><!-- /navbar -->
+
</section>
+
<!-- Buttons
================================================== -->
<section id="buttons">
<th>Large Button</th>
<th>Small Button</th>
<th>Disabled Button</th>
- <th>Button with Icon</th>
- <th>Split Button</th>
+ <th>Button with Icon</th>
+ <th>Split Button</th>
</tr>
</thead>
<tbody>
<td><a class="btn btn-small" href="#">Default</a></td>
<td><a class="btn disabled" href="#">Default</a></td>
<td><a class="btn" href="#"><i class="icon-cog"></i> Default</a></td>
- <td>
-
<div class="btn-group">
-
<a class="btn" href="#">Default</a>
-
<a class="btn dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
-
<ul class="dropdown-menu">
-
<li><a href="#">Action</a></li>
-
<li><a href="#">Another action</a></li>
-
<li><a href="#">Something else here</a></li>
- <li class="divider"></li>
-
<li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- </td>
+ <td>
+ <div class="btn-group">
+ <a class="btn" href="#">Default</a>
+ <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ </td>
</tr>
<tr>
<td><a class="btn btn-primary" href="#">Primary</a></td>
<td><a class="btn btn-primary btn-small" href="#">Primary</a></td>
<td><a class="btn btn-primary disabled" href="#">Primary</a></td>
<td><a class="btn btn-primary" href="#"><i class="icon-shopping-cart icon-white"></i> Primary</a></td>
- <td>
-
<div class="btn-group">
-
<a class="btn btn-primary" href="#">Primary</a>
-
<a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
-
<ul class="dropdown-menu">
-
<li><a href="#">Action</a></li>
-
<li><a href="#">Another action</a></li>
-
<li><a href="#">Something else here</a></li>
- <li class="divider"></li>
-
<li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- </td>
+ <td>
+ <div class="btn-group">
+ <a class="btn btn-primary" href="#">Primary</a>
+ <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ </td>
</tr>
<tr>
<td><a class="btn btn-info" href="#">Info</a></td>
<td><a class="btn btn-info btn-small" href="#">Info</a></td>
<td><a class="btn btn-info disabled" href="#">Info</a></td>
<td><a class="btn btn-info" href="#"><i class="icon-exclamation-sign icon-white"></i> Info</a></td>
- <td>
-
<div class="btn-group">
-
<a class="btn btn-info" href="#">Info</a>
-
<a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
-
<ul class="dropdown-menu">
-
<li><a href="#">Action</a></li>
-
<li><a href="#">Another action</a></li>
-
<li><a href="#">Something else here</a></li>
- <li class="divider"></li>
-
<li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- </td>
+ <td>
+ <div class="btn-group">
+ <a class="btn btn-info" href="#">Info</a>
+ <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ </td>
</tr>
<tr>
<td><a class="btn btn-success" href="#">Success</a></td>
<td><a class="btn btn-success btn-small" href="#">Success</a></td>
<td><a class="btn btn-success disabled" href="#">Success</a></td>
<td><a class="btn btn-success" href="#"><i class="icon-ok icon-white"></i> Success</a></td>
- <td>
-
<div class="btn-group">
-
<a class="btn btn-success" href="#">Success</a>
-
<a class="btn btn-success dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
-
<ul class="dropdown-menu">
-
<li><a href="#">Action</a></li>
-
<li><a href="#">Another action</a></li>
-
<li><a href="#">Something else here</a></li>
- <li class="divider"></li>
-
<li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- </td>
+ <td>
+ <div class="btn-group">
+ <a class="btn btn-success" href="#">Success</a>
+ <a class="btn btn-success dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ </td>
</tr>
<tr>
<td><a class="btn btn-warning" href="#">Warning</a></td>
<td><a class="btn btn-warning btn-small" href="#">Warning</a></td>
<td><a class="btn btn-warning disabled" href="#">Warning</a></td>
<td><a class="btn btn-warning" href="#"><i class="icon-warning-sign icon-white"></i> Warning</a></td>
- <td>
-
<div class="btn-group">
-
<a class="btn btn-warning" href="#">Warning</a>
-
<a class="btn btn-warning dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
-
<ul class="dropdown-menu">
-
<li><a href="#">Action</a></li>
-
<li><a href="#">Another action</a></li>
-
<li><a href="#">Something else here</a></li>
- <li class="divider"></li>
-
<li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- </td>
+ <td>
+ <div class="btn-group">
+ <a class="btn btn-warning" href="#">Warning</a>
+ <a class="btn btn-warning dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ </td>
</tr>
<tr>
<td><a class="btn btn-danger" href="#">Danger</a></td>
<td><a class="btn btn-danger btn-small" href="#">Danger</a></td>
<td><a class="btn btn-danger disabled" href="#">Danger</a></td>
<td><a class="btn btn-danger" href="#"><i class="icon-remove icon-white"></i> Danger</a></td>
- <td>
-
<div class="btn-group">
-
<a class="btn btn-danger" href="#">Danger</a>
-
<a class="btn btn-danger dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
-
<ul class="dropdown-menu">
-
<li><a href="#">Action</a></li>
-
<li><a href="#">Another action</a></li>
-
<li><a href="#">Something else here</a></li>
- <li class="divider"></li>
-
<li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- </td>
+ <td>
+ <div class="btn-group">
+ <a class="btn btn-danger" href="#">Danger</a>
+ <a class="btn btn-danger dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ </td>
</tr>
<tr>
<td><a class="btn btn-inverse" href="#">Inverse</a></td>
<td><a class="btn btn-inverse btn-large" href="#">Inverse</a></td>
<td><a class="btn btn-inverse btn-small" href="#">Inverse</a></td>
<td><a class="btn btn-inverse disabled" href="#">Inverse</a></td>
- <td><a class="btn btn-inverse" href="#"><i class="icon-remove icon-white"></i> Inverse</a></td>
- <td>
-
<div class="btn-group">
-
<a class="btn btn-inverse" href="#">Inverse</a>
-
<a class="btn btn-inverse dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
-
<ul class="dropdown-menu">
-
<li><a href="#">Action</a></li>
-
<li><a href="#">Another action</a></li>
-
<li><a href="#">Something else here</a></li>
- <li class="divider"></li>
-
<li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- </td>
+ <td><a class="btn btn-inverse" href="#"><i class="icon-random icon-white"></i> Inverse</a></td>
+ <td>
+ <div class="btn-group">
+ <a class="btn btn-inverse" href="#">Inverse</a>
+ <a class="btn btn-inverse dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ </td>
</tr>
</tbody>
</table>
<div class="page-header">
<h1>Forms</h1>
</div>
-
+
<div class="row">
- <div class="span7 offset1">
-
- <form class="well form-search">
- <input type="text" class="input-medium search-query">
- <button type="submit" class="btn">Search</button>
- </form>
-
+ <div class="span10 offset1">
+
+ <form class="well form-search">
+ <input type="text" class="input-medium search-query">
+ <button type="submit" class="btn">Search</button>
+ </form>
+
<form class="well form-search">
<input type="text" class="input-small" placeholder="Email">
<input type="password" class="input-small" placeholder="Password">
<button type="submit" class="btn">Go</button>
</form>
-
-
+
+
<form class="form-horizontal well">
<fieldset>
<legend>Controls Bootstrap supports</legend>
<span class="help-inline">Woohoo!</span>
</div>
</div>
- <div class="control-group success">
- <label class="control-label" for="selectError">Select with success</label>
+ <div class="control-group info">
+ <label class="control-label" for="selectError">Select with info</label>
<div class="controls">
<select id="selectError">
<option>1</option>
</section>
+<!-- Tables
+================================================== -->
+<section id="tables">
+ <div class="page-header">
+ <h1>Tables</h1>
+ </div>
+
+ <table class="table table-bordered table-striped table-hover">
+ <thead>
+ <tr>
+ <th>#</th>
+ <th>First Name</th>
+ <th>Last Name</th>
+ <th>Username</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>1</td>
+ <td>Mark</td>
+ <td>Otto</td>
+ <td>@mdo</td>
+ </tr>
+ <tr>
+ <td>2</td>
+ <td>Jacob</td>
+ <td>Thornton</td>
+ <td>@fat</td>
+ </tr>
+ <tr>
+ <td>3</td>
+ <td>Larry</td>
+ <td>the Bird</td>
+ <td>@twitter</td>
+ </tr>
+ </tbody>
+ </table>
+</section>
+
<!-- Miscellaneous
================================================== -->
</div>
<div class="row">
- <div class="span5">
+ <div class="span4">
<h3 id="breadcrumbs">Breadcrumbs</h3>
<ul class="breadcrumb">
<li class="active">Home</li>
</ul>
- <ul class="breadcrumb">
- <li><a href="#">Home</a> <span class="divider">/</span></li>
- <li class="active">Library</li>
- </ul>
<ul class="breadcrumb">
<li><a href="#">Home</a> <span class="divider">/</span></li>
<li><a href="#">Library</a> <span class="divider">/</span></li>
<li class="active">Data</li>
</ul>
</div>
- <div class="span6 offset1">
+ <div class="span4">
<h3 id="pagination">Pagination</h3>
- <div class="pagination">
- <ul>
- <li class="disabled"><a href="#">«</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="#">»</a></li>
- </ul>
- </div>
<div class="pagination">
<ul>
<li><a href="#">←</a></li>
</ul>
</div>
</div>
+
+ <div class="span4">
+ <h3 id="pager">Pagers</h3>
+
+ <ul class="pager">
+ <li><a href="#">Previous</a></li>
+ <li><a href="#">Next</a></li>
+ </ul>
+
+ <ul class="pager">
+ <li class="previous disabled"><a href="#">← Older</a></li>
+ <li class="next"><a href="#">Newer →</a></li>
+ </ul>
+ </div>
</div>
+ <!-- Navs
+ ================================================== -->
+
+ <div class="row">
+ <div class="span4">
+
+ <h3 id="tabs">Tabs</h3>
+ <ul class="nav nav-tabs">
+ <li class="active"><a href="#A" data-toggle="tab">Section 1</a></li>
+ <li><a href="#B" data-toggle="tab">Section 2</a></li>
+ <li class="disabled"><a href="#" data-toggle="tab">Section 3</a></li>
+ </ul>
+ <div class="tabbable">
+ <div class="tab-content">
+ <div class="tab-pane active" id="A">
+ <p>I'm in Section A.</p>
+ </div>
+ <div class="tab-pane" id="B">
+ <p>Howdy, I'm in Section B.</p>
+ </div>
+ <div class="tab-pane" id="C">
+ <p>What up girl, this is Section C.</p>
+ </div>
+ </div>
+ </div> <!-- /tabbable -->
+
+ </div>
+ <div class="span4">
+ <h3 id="pills">Pills</h3>
+ <ul class="nav nav-pills">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#">Profile</a></li>
+ <li class="dropdown">
+ <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </li>
+ <li class="disabled"><a href="#">Disabled link</a></li>
+ </ul>
+ </div>
+
+ <div class="span4">
+
+ <h3 id="list">Lists</h3>
+
+ <div class="well" style="padding: 8px 0;">
+ <ul class="nav nav-list">
+ <li class="nav-header">List header</li>
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#">Library</a></li>
+ <li><a href="#">Applications</a></li>
+ <li class="nav-header">Another list header</li>
+ <li><a href="#">Profile</a></li>
+ <li><a href="#">Settings</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Help</a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
<!-- Labels
================================================== -->
<div class="row">
- <div class="span12">
-
+ <div class="span6">
<h3 id="labels">Labels</h3>
-
-
<span class="label">Default</span>
<span class="label label-success">Success</span>
- <span class="label label-warning">Warning</span>
- <span class="label label-important">Important</span>
- <span class="label label-info">Info</span>
-
- </div>
+ <span class="label label-warning">Warning</span>
+ <span class="label label-important">Important</span>
+ <span class="label label-info">Info</span>
+ <span class="label label-inverse">Inverse</span>
+ </div>
+ <div class="span6">
+ <h3 id="badges">Badges</h3>
+ <span class="badge">Default</span>
+ <span class="badge badge-success">Success</span>
+ <span class="badge badge-warning">Warning</span>
+ <span class="badge badge-important">Important</span>
+ <span class="badge badge-info">Info</span>
+ <span class="badge badge-inverse">Inverse</span>
+ </div>
</div>
- <br />
+ <br />
<!-- Progress bars
================================================== -->
<h3 id="progressbars">Progress bars</h3>
-
+
<div class="row">
<div class="span4">
<div class="progress">
</div>
</div>
</div>
- <br />
+ <br />
<!-- Alerts & Messages
<h3 id="alerts">Alerts</h3>
<div class="row">
-
<div class="alert alert-block">
-
<a class="close">×</a>
- <h4 class="alert-heading">Alert block</h4>
-
<p>Best check yo self, you're not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
- </div>
- </div>
+ <div class="span12">
+ <div class="alert alert-block">
+ <a class="close">×</a>
+ <h4 class="alert-heading">Alert block</h4>
+ <p>Best check yo self, you're not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
+ </div>
+ </div>
</div>
<div class="row">
<div class="span4">
<!-- Footer
================================================== -->
- <footer class="footer">
- <p class="pull-right"><a href="#">Back to top</a></p>
+ <hr>
+
+ <footer id="footer">
+ <p class="pull-right"><a href="#top">Back to top</a></p>
+ <div class="links">
+ <a href="http://news.bootswatch.com" onclick="pageTracker._link(this.href); return false;">Blog</a>
+ <a href="http://feeds.feedburner.com/bootswatch">RSS</a>
+ <a href="https://twitter.com/thomashpark">Twitter</a>
+ <a href="https://github.com/thomaspark/bootswatch/">GitHub</a>
+ <a rel="tooltip" href="javascript:(function(e,a,g,h,f,c,b,d)%7Bif(!(f%3De.jQuery)%7C%7Cg%3Ef.fn.jquery%7C%7Ch(f))%7Bc%3Da.createElement(%22script%22)%3Bc.type%3D%22text/javascript%22%3Bc.src%3D%22http://ajax.googleapis.com/ajax/libs/jquery/%22%2Bg%2B%22/jquery.min.js%22%3Bc.onload%3Dc.onreadystatechange%3Dfunction()%7Bif(!b%26%26(!(d%3Dthis.readyState)%7C%7Cd%3D%3D%22loaded%22%7C%7Cd%3D%3D%22complete%22))%7Bh((f%3De.jQuery).noConflict(1),b%3D1)%3Bf(c).remove()%7D%7D%3Ba.documentElement.childNodes%5B0%5D.appendChild(c)%7D%7D)(window,document,%221.3.2%22,function(%24,L)%7Bif(%24(%22.bootswatcher%22)%5B0%5D)%7B%24(%22.bootswatcher%22).remove()%7Delse%7Bvar%20%24e%3D%24(%27%3Cselect%20class%3D%22bootswatcher%22%3E%3Coption%3EAmelia%3C/option%3E%3Coption%3ECerulean%3C/option%3E%3Coption%3ECosmo%3C/option%3E%3Coption%3ECyborg%3C/option%3E%3Coption%3EJournal%3C/option%3E%3Coption%3EReadable%3C/option%3E%3Coption%3ESimplex%3C/option%3E%3Coption%3ESlate%3C/option%3E%3Coption%3ESpacelab%3C/option%3E%3Coption%3ESpruce%3C/option%3E%3Coption%3ESuperhero%3C/option%3E%3Coption%3EUnited%3C/option%3E%3C/select%3E%27)%3Bvar%20l%3D1%2BMath.floor(Math.random()*%24e.children().length)%3B%24e.css(%7B%22z-index%22:%2299999%22,position:%22fixed%22,top:%225px%22,right:%225px%22,opacity:%220.5%22%7D).hover(function()%7B%24(this).css(%22opacity%22,%221%22)%7D,function()%7B%24(this).css(%22opacity%22,%220.5%22)%7D).change(function()%7Bif(!%24(%22link.bootswatcher%22)%5B0%5D)%7B%24(%22head%22).append(%27%3Clink%20rel%3D%22stylesheet%22%20class%3D%22bootswatcher%22%3E%27)%7D%24(%22link.bootswatcher%22).attr(%22href%22,%22http://bootswatch.com/%22%2B%24(this).find(%22:selected%22).text().toLowerCase()%2B%22/bootstrap.min.css%22)%7D).find(%22option:nth-child(%22%2Bl%2B%22)%22).attr(%22selected%22,%22selected%22).end().trigger(%22change%22)%3B%24(%22body%22).append(%24e)%7D%3B%7D)%3B" title="Drag to your bookmarks bar">Bookmarklet</a>
+ <a href="https://github.com/thomaspark/bootswatch/tree/gh-pages/swatchmaker">Swatchmaker</a>
+ <a href="http://news.bootswatch.com/post/22193315172/bootswatch-api">API</a>
+ <a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=F22JEM3Q78JC2">Donate</a>
+ </div>
+ Made by <a href="http://thomaspark.me">Thomas Park</a>. Contact him <a href="mailto:hello@thomaspark.me">hello@thomaspark.me</a>.<br/>
+ Code licensed under the <a href="http://www.apache.org/licenses/LICENSE-2.0">Apache License v2.0</a>.<br/>
+ Based on <a href="http://twitter.github.com/bootstrap/">Bootstrap</a>. Hosted on <a href="http://pages.github.com/">GitHub</a>. Icons from <a href="http://fortawesome.github.com/Font-Awesome/">Font Awesome</a>. Web fonts from <a href="http://www.google.com/webfonts">Google</a>. Favicon by <a href="https://twitter.com/geraldhiller">Gerald Hiller</a>.</p>
</footer>
</div><!-- /container -->
<!-- Le javascript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
- <script src="../js/jquery.js"></script>
- <script src="../js/bootstrap-dropdown.js"></script>
- <script src="../js/bootstrap-scrollspy.js"></script>
- <script src="../js/bootstrap-collapse.js"></script>
- <script src="../js/bootstrap-tooltip.js"></script>
- <script src="../js/application.js"></script>
+ <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
+ <script src="../js/jquery.smooth-scroll.min.js"></script>
+ <script src="../js/bootstrap.min.js"></script>
<script src="../js/bootswatch.js"></script>
projects / bootswatch / blobdiff