File size: 10.73Kb
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Timeline - Deep Blue Admin</title>
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="font-awesome/css/font-awesome.min.css" />
<link rel="stylesheet" type="text/css" href="css/local.css" />
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
<style>
div {
padding-bottom:20px;
}
</style>
</head>
<body>
<div id="wrapper">
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html">Back to Admin</a>
</div>
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav side-nav">
<li><a href="index.html"><i class="fa fa-bullseye"></i> Dashboard</a></li>
<li><a href="portfolio.html"><i class="fa fa-tasks"></i> Portfolio</a></li>
<li><a href="blog.html"><i class="fa fa-globe"></i> Blog</a></li>
<li><a href="signup.html"><i class="fa fa-list-ol"></i> SignUp</a></li>
<li><a href="register.html"><i class="fa fa-font"></i> Register</a></li>
<li class="active"><a href="timeline.html"><i class="fa fa-font"></i> Timeline</a></li>
<li><a href="forms.html"><i class="fa fa-list-ol"></i> Forms</a></li>
<li><a href="typography.html"><i class="fa fa-font"></i> Typography</a></li>
<li><a href="bootstrap-elements.html"><i class="fa fa-list-ul"></i> Bootstrap Elements</a></li>
<li><a href="bootstrap-grid.html"><i class="fa fa-table"></i > Bootstrap Grid</a></li>
</ul>
<ul class="nav navbar-nav navbar-right navbar-user">
<li class="dropdown messages-dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-envelope"></i> Messages <span class="badge">2</span> <b class="caret"></b></a>
<ul class="dropdown-menu">
<li class="dropdown-header">2 New Messages</li>
<li class="message-preview">
<a href="#">
<span class="avatar"><i class="fa fa-bell"></i></span>
<span class="message">Security alert</span>
</a>
</li>
<li class="divider"></li>
<li class="message-preview">
<a href="#">
<span class="avatar"><i class="fa fa-bell"></i></span>
<span class="message">Security alert</span>
</a>
</li>
<li class="divider"></li>
<li><a href="#">Go to Inbox <span class="badge">2</span></a></li>
</ul>
</li>
<li class="dropdown user-dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-user"></i> Steve Miller<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#"><i class="fa fa-user"></i> Profile</a></li>
<li><a href="#"><i class="fa fa-gear"></i> Settings</a></li>
<li class="divider"></li>
<li><a href="#"><i class="fa fa-power-off"></i> Log Out</a></li>
</ul>
</li>
</ul>
</div>
</nav>
<hr />
<div class="container">
<div class="page-header">
<h1 id="timeline">User Events</h1>
</div>
<ul class="timeline">
<li>
<div class="timeline-badge info"><i class="fa fa-unlock"></i></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4 class="timeline-title">User Logged in</h4>
<span><i class="fa fa-clock-o fa-2x"></i> 1 hour 20 minutes ago</span>
<hr />
</div>
<div class="timeline-body">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>
</div>
</div>
</li>
<li class="timeline-inverted">
<div class="timeline-badge success"><i class="fa fa-search"></i></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4 class="timeline-title">User Content Search</h4>
<span><i class="fa fa-clock-o fa-2x"></i> 57 minutes ago</span>
<hr />
</div>
<div class="timeline-body">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>
</div>
</div>
</li>
<li>
<div class="timeline-badge danger"><i class="fa fa-shopping-cart"></i></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4 class="timeline-title">Items added to shopping cart</h4>
<span><i class="fa fa-clock-o fa-2x"></i> 37 minutes ago</span>
<hr />
</div>
<div class="timeline-body">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>
</div>
</div>
</li>
<li class="timeline-inverted">
<div class="timeline-badge info"><i class="fa fa-dollar"></i></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4 class="timeline-title">Payment processed</h4>
<span><i class="fa fa-clock-o fa-2x"></i> 27 minutes ago</span>
<hr />
</div>
<div class="timeline-body">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>
</div>
</div>
</li>
<li class="timeline-inverted">
<div class="timeline-badge info"><i class="fa fa-share"></i></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4 class="timeline-title">User logged out</h4>
<span><i class="fa fa-clock-o fa-2x"></i> 10 minutes ago</span>
<hr />
</div>
<div class="timeline-body">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>
</div>
</div>
</li>
</ul>
</div>
</div>
</body>
</html>