HTML5 Documentation

This commit is contained in:
Dennis Neufeld
2015-08-04 18:33:36 +02:00
parent 9837243bc9
commit d20b62ca81
5 changed files with 61 additions and 69 deletions

View File

@@ -50,7 +50,7 @@
<li><!-- start message -->
<a href="#">
<div class="pull-left">
<img src="../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
<img src="../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
</div>
<h4>
Support Team
@@ -119,13 +119,13 @@
<!-- User Account: style can be found in dropdown.less -->
<li class="dropdown user user-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<img src="../dist/img/user2-160x160.jpg" class="user-image" alt="User Image" />
<img src="../dist/img/user2-160x160.jpg" class="user-image" alt="User Image">
<span class="hidden-xs">Alexander Pierce</span>
</a>
<ul class="dropdown-menu">
<!-- User image -->
<li class="user-header">
<img src="../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
<img src="../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
<p>
Alexander Pierce - Web Developer
<small>Member since Nov. 2012</small>
@@ -184,7 +184,7 @@
&LT;li>&LT;!-- start message -->
&LT;a href="#">
&LT;div class="pull-left">
&LT;img src="dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
&LT;img src="dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
&LT;/div>
&LT;h4>
Sender Name
@@ -256,13 +256,13 @@
&LT;!-- User Account: style can be found in dropdown.less -->
&LT;li class="dropdown user user-menu">
&LT;a href="#" class="dropdown-toggle" data-toggle="dropdown">
&LT;img src="dist/img/user2-160x160.jpg" class="user-image" alt="User Image" />
&LT;img src="dist/img/user2-160x160.jpg" class="user-image" alt="User Image">
&LT;span class="hidden-xs">Alexander Pierce&LT;/span>
&LT;/a>
&LT;ul class="dropdown-menu">
&LT;!-- User image -->
&LT;li class="user-header">
&LT;img src="dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
&LT;img src="dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
&LT;p>
Alexander Pierce - Web Developer
&LT;small>Member since Nov. 2012&LT;/small>
@@ -421,7 +421,7 @@
&LT;!-- user panel (Optional) -->
&LT;div class="user-panel">
&LT;div class="pull-left image">
&LT;img src="dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
&LT;img src="dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
&LT;/div>
&LT;div class="pull-left info">
&LT;p>User Name&LT;/p>
@@ -433,7 +433,7 @@
&LT;!-- Search Form (Optional) -->
&LT;form action="#" method="get" class="sidebar-form">
&LT;div class="input-group">
&LT;input type="text" name="q" class="form-control" placeholder="Search..." />
&LT;input type="text" name="q" class="form-control" placeholder="Search...">
&LT;span class="input-group-btn">
&LT;button type="submit" name="search" id="search-btn" class="btn btn-flat">&LT;i class="fa fa-search">&LT;/i>&LT;/button>
&LT;/span>
@@ -488,7 +488,7 @@
automatically act as the toggle button.</p>
<p class="lead">Toggle Button Example</p>
<button class="btn btn-primary" data-toggle="control-sidebar">Toggle Right Sidebar</button><br /><br />
<button class="btn btn-primary" data-toggle="control-sidebar">Toggle Right Sidebar</button><br><br>
<p class="lead">Sidebar Toggle Markup</p>
<pre class="prettyprint"><code class="lang-html">&LT;button class="btn btn-default" data-toggle="control-sidebar">Toggle Right Sidebar&LT;/button></code></pre>
@@ -899,7 +899,7 @@
&LT;/div>&LT;!-- /.box --></pre>
</div>
</div><!-- /.row -->
<p>We can also add labels, badges, pagination, tooltips, inputs and many more in the box tools. A few examples:</p>
<p>We can also add labels, badges, pagination, tooltips, inputs and many more in the box tools. A few examples:</p>
<div class="row">
<div class="col-md-4">
<div class="box box-default">
@@ -932,7 +932,7 @@
<h3 class="box-title">Input</h3>
<div class="box-tools pull-right">
<div class="has-feedback">
<input type="text" class="form-control input-sm" placeholder="Search..." />
<input type="text" class="form-control input-sm" placeholder="Search...">
<span class="glyphicon glyphicon-search form-control-feedback text-muted"></span>
</div>
</div><!-- /.box-tools -->
@@ -947,7 +947,7 @@
&LT;h3 class="box-title">Input&LT;/h3>
&LT;div class="box-tools pull-right">
&LT;div class="has-feedback">
&LT;input type="text" class="form-control input-sm" placeholder="Search..." />
&LT;input type="text" class="form-control input-sm" placeholder="Search...">
&LT;span class="glyphicon glyphicon-search form-control-feedback">&LT;/span>
&LT;/div>
&LT;/div>&LT;!-- /.box-tools -->
@@ -1060,7 +1060,7 @@
<span class="direct-chat-name pull-left">Alexander Pierce</span>
<span class="direct-chat-timestamp pull-right">23 Jan 2:00 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image"><!-- /.direct-chat-img -->
<div class="direct-chat-text">
Is this template really for free? That's unbelievable!
</div><!-- /.direct-chat-text -->
@@ -1072,7 +1072,7 @@
<span class="direct-chat-name pull-right">Sarah Bullock</span>
<span class="direct-chat-timestamp pull-left">23 Jan 2:05 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image"><!-- /.direct-chat-img -->
<div class="direct-chat-text">
You better believe it!
</div><!-- /.direct-chat-text -->
@@ -1084,7 +1084,7 @@
<ul class="contacts-list">
<li>
<a href="#">
<img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar" />
<img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar">
<div class="contacts-list-info">
<span class="contacts-list-name">
Count Dracula
@@ -1100,7 +1100,7 @@
<div class="box-footer">
<form action="#" method="post">
<div class="input-group">
<input type="text" name="message" placeholder="Type Message ..." class="form-control" />
<input type="text" name="message" placeholder="Type Message ..." class="form-control">
<span class="input-group-btn">
<button type="button" class="btn btn-primary btn-flat">Send</button>
</span>
@@ -1131,7 +1131,7 @@
<span class="direct-chat-name pull-left">Alexander Pierce</span>
<span class="direct-chat-timestamp pull-right">23 Jan 2:00 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image"><!-- /.direct-chat-img -->
<div class="direct-chat-text">
Is this template really for free? That's unbelievable!
</div><!-- /.direct-chat-text -->
@@ -1143,7 +1143,7 @@
<span class="direct-chat-name pull-right">Sarah Bullock</span>
<span class="direct-chat-timestamp pull-left">23 Jan 2:05 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image"><!-- /.direct-chat-img -->
<div class="direct-chat-text">
You better believe it!
</div><!-- /.direct-chat-text -->
@@ -1155,7 +1155,7 @@
<ul class="contacts-list">
<li>
<a href="#">
<img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar" />
<img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar">
<div class="contacts-list-info">
<span class="contacts-list-name">
Count Dracula
@@ -1171,7 +1171,7 @@
<div class="box-footer">
<form action="#" method="post">
<div class="input-group">
<input type="text" name="message" placeholder="Type Message ..." class="form-control" />
<input type="text" name="message" placeholder="Type Message ..." class="form-control">
<span class="input-group-btn">
<button type="button" class="btn btn-success btn-flat">Send</button>
</span>
@@ -1202,7 +1202,7 @@
<span class="direct-chat-name pull-left">Alexander Pierce</span>
<span class="direct-chat-timestamp pull-right">23 Jan 2:00 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image"><!-- /.direct-chat-img -->
<div class="direct-chat-text">
Is this template really for free? That's unbelievable!
</div><!-- /.direct-chat-text -->
@@ -1214,7 +1214,7 @@
<span class="direct-chat-name pull-right">Sarah Bullock</span>
<span class="direct-chat-timestamp pull-left">23 Jan 2:05 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image"><!-- /.direct-chat-img -->
<div class="direct-chat-text">
You better believe it!
</div><!-- /.direct-chat-text -->
@@ -1226,7 +1226,7 @@
<ul class="contacts-list">
<li>
<a href="#">
<img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar" />
<img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar">
<div class="contacts-list-info">
<span class="contacts-list-name">
Count Dracula
@@ -1242,7 +1242,7 @@
<div class="box-footer">
<form action="#" method="post">
<div class="input-group">
<input type="text" name="message" placeholder="Type Message ..." class="form-control" />
<input type="text" name="message" placeholder="Type Message ..." class="form-control">
<span class="input-group-btn">
<button type="button" class="btn btn-warning btn-flat">Send</button>
</span>
@@ -1273,7 +1273,7 @@
<span class="direct-chat-name pull-left">Alexander Pierce</span>
<span class="direct-chat-timestamp pull-right">23 Jan 2:00 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image"><!-- /.direct-chat-img -->
<div class="direct-chat-text">
Is this template really for free? That's unbelievable!
</div><!-- /.direct-chat-text -->
@@ -1285,7 +1285,7 @@
<span class="direct-chat-name pull-right">Sarah Bullock</span>
<span class="direct-chat-timestamp pull-left">23 Jan 2:05 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image"><!-- /.direct-chat-img -->
<div class="direct-chat-text">
You better believe it!
</div><!-- /.direct-chat-text -->
@@ -1297,7 +1297,7 @@
<ul class="contacts-list">
<li>
<a href="#">
<img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar" />
<img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar">
<div class="contacts-list-info">
<span class="contacts-list-name">
Count Dracula
@@ -1313,7 +1313,7 @@
<div class="box-footer">
<form action="#" method="post">
<div class="input-group">
<input type="text" name="message" placeholder="Type Message ..." class="form-control" />
<input type="text" name="message" placeholder="Type Message ..." class="form-control">
<span class="input-group-btn">
<button type="button" class="btn btn-danger btn-flat">Send</button>
</span>
@@ -1348,7 +1348,7 @@
&LT;span class="direct-chat-name pull-left">Alexander Pierce&LT;/span>
&LT;span class="direct-chat-timestamp pull-right">23 Jan 2:00 pm&LT;/span>
&LT;/div>&LT;!-- /.direct-chat-info -->
&LT;img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image" />&LT;!-- /.direct-chat-img -->
&LT;img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image">&LT;!-- /.direct-chat-img -->
&LT;div class="direct-chat-text">
Is this template really for free? That's unbelievable!
&LT;/div>&LT;!-- /.direct-chat-text -->
@@ -1360,7 +1360,7 @@
&LT;span class="direct-chat-name pull-right">Sarah Bullock&LT;/span>
&LT;span class="direct-chat-timestamp pull-left">23 Jan 2:05 pm&LT;/span>
&LT;/div>&LT;!-- /.direct-chat-info -->
&LT;img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image" />&LT;!-- /.direct-chat-img -->
&LT;img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image">&LT;!-- /.direct-chat-img -->
&LT;div class="direct-chat-text">
You better believe it!
&LT;/div>&LT;!-- /.direct-chat-text -->
@@ -1372,7 +1372,7 @@
&LT;ul class="contacts-list">
&LT;li>
&LT;a href="#">
&LT;img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar" />
&LT;img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar">
&LT;div class="contacts-list-info">
&LT;span class="contacts-list-name">
Count Dracula
@@ -1387,7 +1387,7 @@
&LT;/div>&LT;!-- /.box-body -->
&LT;div class="box-footer">
&LT;div class="input-group">
&LT;input type="text" name="message" placeholder="Type Message ..." class="form-control" />
&LT;input type="text" name="message" placeholder="Type Message ..." class="form-control">
&LT;span class="input-group-btn">
&LT;button type="button" class="btn btn-danger btn-flat">Send&LT;/button>
&LT;/span>
@@ -1421,7 +1421,7 @@
<span class="direct-chat-name pull-left">Alexander Pierce</span>
<span class="direct-chat-timestamp pull-right">23 Jan 2:00 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image"><!-- /.direct-chat-img -->
<div class="direct-chat-text">
Is this template really for free? That's unbelievable!
</div><!-- /.direct-chat-text -->
@@ -1433,7 +1433,7 @@
<span class="direct-chat-name pull-right">Sarah Bullock</span>
<span class="direct-chat-timestamp pull-left">23 Jan 2:05 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image"><!-- /.direct-chat-img -->
<div class="direct-chat-text">
You better believe it!
</div><!-- /.direct-chat-text -->
@@ -1445,7 +1445,7 @@
<ul class="contacts-list">
<li>
<a href="#">
<img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar" />
<img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar">
<div class="contacts-list-info">
<span class="contacts-list-name">
Count Dracula
@@ -1461,7 +1461,7 @@
<div class="box-footer">
<form action="#" method="post">
<div class="input-group">
<input type="text" name="message" placeholder="Type Message ..." class="form-control" />
<input type="text" name="message" placeholder="Type Message ..." class="form-control">
<span class="input-group-btn">
<button type="button" class="btn btn-primary btn-flat">Send</button>
</span>
@@ -1492,7 +1492,7 @@
<span class="direct-chat-name pull-left">Alexander Pierce</span>
<span class="direct-chat-timestamp pull-right">23 Jan 2:00 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="message user image"><!-- /.direct-chat-img -->
<div class="direct-chat-text">
Is this template really for free? That's unbelievable!
</div><!-- /.direct-chat-text -->
@@ -1504,7 +1504,7 @@
<span class="direct-chat-name pull-right">Sarah Bullock</span>
<span class="direct-chat-timestamp pull-left">23 Jan 2:05 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="message user image"><!-- /.direct-chat-img -->
<div class="direct-chat-text">
You better believe it!
</div><!-- /.direct-chat-text -->
@@ -1516,7 +1516,7 @@
<ul class="contacts-list">
<li>
<a href="#">
<img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar" />
<img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="Contact Avatar">
<div class="contacts-list-info">
<span class="contacts-list-name">
Count Dracula
@@ -1532,7 +1532,7 @@
<div class="box-footer">
<form action="#" method="post">
<div class="input-group">
<input type="text" name="message" placeholder="Type Message ..." class="form-control" />
<input type="text" name="message" placeholder="Type Message ..." class="form-control">
<span class="input-group-btn">
<button type="button" class="btn btn-info btn-flat">Send</button>
</span>