Permalink
Switch branches/tags
Nothing to show
Find file
Fetching contributors…
Cannot retrieve contributors at this time
167 lines (159 sloc) 5.74 KB
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>Twitter Bootstrap Admin</title>
<meta charset="utf-8">
<link rel="stylesheet" href="assets/css/global.css" type="text/css">
</head>
<body>
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a href="dashboard.html" class="brand">Project Name</a>
<ul class="nav">
<li>
<a href="dashboard.html">Dashboard</a>
</li>
<li>
<a href="list.html">Users</a>
</li>
<li>
<a href="#">Content</a>
</li>
<li>
<a href="#">Media</a>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Settings <b class="caret"></b></a>
<ul class="dropdown-menu">
<li>
<a href="#">Secondary link</a>
</li>
<li>
<a href="#">Something else here</a>
</li>
<li>
<a href="#">Another link</a>
</li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">System <b class="caret"></b></a>
<ul class="dropdown-menu">
<liclass="active">
<a href="help.html">Help</a>
</li>
<li>
<a href="#">About</a>
</li>
<li>
<a href="index.html">Logout</a>
</li>
</ul>
</li>
</ul>
<form action="" class="navbar-search pull-left">
<input type="text" placeholder="Search" class="search-query span2">
</form>
</div>
</div>
</div>
<div class="container top">
<ul class="breadcrumb">
<li>
<a href="dashboard.html">Home</a> <span class="divider">/</span>
</li>
<li class="active">
<a href="#">Help</a>
</li>
</ul>
<div class="page-header">
<h1>Help <small>How do I use it?</small></h1>
</div>
<div class="row">
<div class="span6">
<h2>Default thumbnails</h2>
<p>By default, Bootstrap's thumbnails are designed to showcase linked images with minimal required markup.</p>
<ul class="thumbnails">
<li class="span3">
<a class="thumbnail" href="#">
<img alt="" src="http://placehold.it/260x180">
</a>
</li>
<li class="span3">
<a class="thumbnail" href="#">
<img alt="" src="http://placehold.it/260x180">
</a>
</li>
<li class="span3">
<a class="thumbnail" href="#">
<img alt="" src="http://placehold.it/260x180">
</a>
</li>
<li class="span3">
<a class="thumbnail" href="#">
<img alt="" src="http://placehold.it/260x180">
</a>
</li>
</ul>
</div>
<div class="span6">
<h2>Highly customizable</h2>
<p>With a bit of extra markup, it's possible to add any kind of HTML content like headings, paragraphs, or buttons into thumbnails.</p>
<ul class="thumbnails">
<li class="span3">
<div class="thumbnail">
<img alt="" src="http://placehold.it/260x180">
<div class="caption">
<h5>Thumbnail label</h5>
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<p><a class="btn primary" href="#">Action</a> <a class="btn" href="#">Action</a></p>
</div>
</div>
</li>
<li class="span3">
<div class="thumbnail">
<img alt="" src="http://placehold.it/260x180">
<div class="caption">
<h5>Thumbnail label</h5>
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<p><a class="btn primary" href="#">Action</a> <a class="btn" href="#">Action</a></p>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="row">
<div class="span4">
<h3>Why use thumbnails</h3>
<p>Thumbnails (previously <code>.media-grid</code> up until v1.4) are great for grids of photos or videos, image search results, retail products, portfolios, and much more. They can be links or static content.</p>
</div>
<div class="span4">
<h3>Simple, flexible markup</h3>
<p>Thumbnail markup is simple&mdash;a <code>ul</code> with any number of <code>li</code> elements is all that is required. It's also super flexible, allowing for any type of content with just a bit more markup to wrap your contents.</p>
</div>
<div class="span4">
<h3>Uses grid column sizes</h3>
<p>Lastly, the thumbnails component uses existing grid system classes&mdash;like <code>.span2</code> or <code>.span3</code>&mdash;for control of thumbnail dimensions.</p>
</div>
</div>
</div>
<div id="footer">
<hr>
<div class="inner">
<div class="container">
<p class="right">
<a href="#">Back to top</a>
</p>
<p>
Assembled with ♥ by <a href="http://www.twitter.com/davitferreira" target="_blank">@davitferreira</a>, using <a href="http://twitter.github.com/bottstrap">twitter bootstrap</a> and <a href="http://jquery.com">jquery</a>.
</p>
</div>
</div>
</div>
<script src="assets/js/jquery-1.7.1.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/admin.min.js"></script>
</body>
</html>