<div class="wrapper wrapper-content">
<div class="row">
<div class="col-lg-3">
<div class="ibox float-e-margins">
<div class="ibox-title">
<span class="label label-success pull-right">Monthly</span>
<h5>Income</h5>
</div>
<div class="ibox-content">
<h1 class="no-margins">40 886,200</h1>
<div class="stat-percent font-bold text-success">98% <i class="fa fa-bolt"></i></div>
<small>Total income</small>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="ibox float-e-margins">
<div class="ibox-title">
<span class="label label-info pull-right">Annual</span>
<h5>Orders</h5>
</div>
<div class="ibox-content">
<h1 class="no-margins">275,800</h1>
<div class="stat-percent font-bold text-info">20% <i class="fa fa-level-up"></i></div>
<small>New orders</small>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="ibox float-e-margins">
<div class="ibox-title">
<span class="label label-primary pull-right">Today</span>
<h5>Vistits</h5>
</div>
<div class="ibox-content">
<h1 class="no-margins">106,120</h1>
<div class="stat-percent font-bold text-navy">44% <i class="fa fa-level-up"></i></div>
<small>New visits</small>
</div>
</div>
</div>
<div class="col-lg-3">
<div class="ibox float-e-margins">
<div class="ibox-title">
<span class="label label-danger pull-right">Low value</span>
<h5>User activity</h5>
</div>
<div class="ibox-content">
<h1 class="no-margins">80,600</h1>
<div class="stat-percent font-bold text-danger">38% <i class="fa fa-level-down"></i></div>
<small>In first month</small>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>Orders</h5>
<div class="pull-right">
<div class="btn-group">
<button type="button" class="btn btn-xs btn-white active">Today</button>
<button type="button" class="btn btn-xs btn-white">Monthly</button>
<button type="button" class="btn btn-xs btn-white">Annual</button>
</div>
</div>
</div>
<div class="ibox-content">
<div class="row">
<div class="col-lg-9">
<div class="flot-chart" ng-controller="dashboardFlotTwo as chart">
<div flot class="flot-chart-content" dataset="chart.flotData" options="chart.flotOptions"></div>
</div>
</div>
<div class="col-lg-3">
<ul class="stat-list">
<li>
<h2 class="no-margins">2,346</h2>
<small>Total orders in period</small>
<div class="stat-percent">48% <i class="fa fa-level-up text-navy"></i></div>
<div class="progress progress-mini">
<div style="width: 48%;" class="progress-bar"></div>
</div>
</li>
<li>
<h2 class="no-margins ">4,422</h2>
<small>Orders in last month</small>
<div class="stat-percent">60% <i class="fa fa-level-down text-navy"></i></div>
<div class="progress progress-mini">
<div style="width: 60%;" class="progress-bar"></div>
</div>
</li>
<li>
<h2 class="no-margins ">9,180</h2>
<small>Monthly income from orders</small>
<div class="stat-percent">22% <i class="fa fa-bolt text-navy"></i></div>
<div class="progress progress-mini">
<div style="width: 22%;" class="progress-bar"></div>
</div>
</li>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>Messages</h5>
<div ibox-tools></div>
</div>
<div class="ibox-content ibox-heading">
<h3><i class="fa fa-envelope-o"></i> New messages</h3>
<small><i class="fa fa-tim"></i> You have 22 new messages and 16 waiting in draft folder.</small>
</div>
<div class="ibox-content">
<div class="feed-activity-list">
<div class="feed-element">
<div>
<small class="pull-right text-navy">1m ago</small>
<strong>Monica Smith</strong>
<div>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum</div>
<small class="text-muted">Today 5:60 pm - 12.06.2014</small>
</div>
</div>
<div class="feed-element">
<div>
<small class="pull-right">2m ago</small>
<strong>Jogn Angel</strong>
<div>There are many variations of passages of Lorem Ipsum available</div>
<small class="text-muted">Today 2:23 pm - 11.06.2014</small>
</div>
</div>
<div class="feed-element">
<div>
<small class="pull-right">5m ago</small>
<strong>Jesica Ocean</strong>
<div>Contrary to popular belief, Lorem Ipsum</div>
<small class="text-muted">Today 1:00 pm - 08.06.2014</small>
</div>
</div>
<div class="feed-element">
<div>
<small class="pull-right">5m ago</small>
<strong>Monica Jackson</strong>
<div>The generated Lorem Ipsum is therefore</div>
<small class="text-muted">Yesterday 8:48 pm - 10.06.2014</small>
</div>
</div>
<div class="feed-element">
<div>
<small class="pull-right">5m ago</small>
<strong>Anna Legend</strong>
<div>All the Lorem Ipsum generators on the Internet tend to repeat</div>
<small class="text-muted">Yesterday 8:48 pm - 10.06.2014</small>
</div>
</div>
<div class="feed-element">
<div>
<small class="pull-right">5m ago</small>
<strong>Damian Nowak</strong>
<div>The standard chunk of Lorem Ipsum used</div>
<small class="text-muted">Yesterday 8:48 pm - 10.06.2014</small>
</div>
</div>
<div class="feed-element">
<div>
<small class="pull-right">5m ago</small>
<strong>Gary Smith</strong>
<div>200 Latin words, combined with a handful</div>
<small class="text-muted">Yesterday 8:48 pm - 10.06.2014</small>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-8">
<div class="row">
<div class="col-lg-6">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>User project list</h5>
<div ibox-tools></div>
</div>
<div class="ibox-content">
<table class="table table-hover no-margins">
<thead>
<tr>
<th>Status</th>
<th>Date</th>
<th>User</th>
<th>Value</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<small>Pending...</small>
</td>
<td><i class="fa fa-clock-o"></i> 11:20pm</td>
<td>Samantha</td>
<td class="text-navy"><i class="fa fa-level-up"></i> 24%</td>
</tr>
<tr>
<td><span class="label label-warning">Canceled</span></td>
<td><i class="fa fa-clock-o"></i> 10:40am</td>
<td>Monica</td>
<td class="text-navy"><i class="fa fa-level-up"></i> 66%</td>
</tr>
<tr>
<td>
<small>Pending...</small>
</td>
<td><i class="fa fa-clock-o"></i> 01:30pm</td>
<td>John</td>
<td class="text-navy"><i class="fa fa-level-up"></i> 54%</td>
</tr>
<tr>
<td>
<small>Pending...</small>
</td>
<td><i class="fa fa-clock-o"></i> 02:20pm</td>
<td>Agnes</td>
<td class="text-navy"><i class="fa fa-level-up"></i> 12%</td>
</tr>
<tr>
<td><span class="label label-primary">Completed</span></td>
<td><i class="fa fa-clock-o"></i> 04:10am</td>
<td>Amelia</td>
<td class="text-navy"><i class="fa fa-level-up"></i> 66%</td>
</tr>
<tr>
<td>
<small>Pending...</small>
</td>
<td><i class="fa fa-clock-o"></i> 12:08am</td>
<td>Damian</td>
<td class="text-navy"><i class="fa fa-level-up"></i> 23%</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="ibox">
<div class="ibox-title">
<h5>Small todo list</h5>
<div ibox-tools></div>
</div>
<div class="ibox-content">
<ul class="todo-list m-t small-list">
<li>
<checkbox ng-model="main.checkOne"></checkbox>
<span class="m-l-xs">Buy a milk</span>
</li>
<li>
<checkbox ng-model="check1"></checkbox>
<span class="m-l-xs">Go to shop and find some products.</span>
</li>
<li>
<checkbox ng-model="check2"></checkbox>
<span class="m-l-xs">Send documents to Mike</span>
<small class="label label-primary"><i class="fa fa-clock-o"></i> 1 mins</small>
</li>
<li>
<checkbox ng-model="main.checkTwo"></checkbox>
<span class="m-l-xs">Go to the doctor dr Smith</span>
</li>
<li>
<checkbox ng-model="check4"></checkbox>
<span class="m-l-xs">Plan vacation</span>
</li>
<li>
<checkbox ng-model="check5"></checkbox>
<span class="m-l-xs">Create new stuff</span>
</li>
<li>
<checkbox ng-model="check6"></checkbox>
<span class="m-l-xs">Call to Anna for dinner</span>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>Transactions worldwide</h5>
<div ibox-tools></div>
</div>
<div class="ibox-content">
<div class="row">
<div class="col-lg-6">
<table class="table table-hover margin bottom">
<thead>
<tr>
<th style="width: 1%" class="text-center">No.</th>
<th>Transaction</th>
<th class="text-center">Date</th>
<th class="text-center">Amount</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-center">1</td>
<td> Security doors
</small></td>
<td class="text-center small">16 Jun 2014</td>
<td class="text-center"><span class="label label-primary">$483.00</span></td>
</tr>
<tr>
<td class="text-center">2</td>
<td> Wardrobes
</td>
<td class="text-center small">10 Jun 2014</td>
<td class="text-center"><span class="label label-primary">$327.00</span></td>
</tr>
<tr>
<td class="text-center">3</td>
<td> Set of tools
</td>
<td class="text-center small">12 Jun 2014</td>
<td class="text-center"><span class="label label-warning">$125.00</span></td>
</tr>
<tr>
<td class="text-center">4</td>
<td> Panoramic pictures</td>
<td class="text-center small">22 Jun 2013</td>
<td class="text-center"><span class="label label-primary">$344.00</span></td>
</tr>
<tr>
<td class="text-center">5</td>
<td>Phones</td>
<td class="text-center small">24 Jun 2013</td>
<td class="text-center"><span class="label label-primary">$235.00</span></td>
</tr>
<tr>
<td class="text-center">6</td>
<td>Monitors</td>
<td class="text-center small">26 Jun 2013</td>
<td class="text-center"><span class="label label-primary">$100.00</span></td>
</tr>
</tbody>
</table>
</div>
<div class="col-lg-6" ng-controller="dashboardMap as map">
<div vector-map style="height: 300px;" my-map-data="map.data"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="small-chat-box ng-small-chat fadeInRight animated" ng-show="openChat">
<div class="heading" draggable="true">
<small class="chat-date pull-right">
02.19.2015
</small>
Small chat
</div>
<div class="content" chat-slim-scroll>
<div class="left">
<div class="author-name">
Monica Jackson <small class="chat-date">
10:02 am
</small>
</div>
<div class="chat-message active">
Lorem Ipsum is simply dummy text input.
</div>
</div>
<div class="right">
<div class="author-name">
Mick Smith
<small class="chat-date">
11:24 am
</small>
</div>
<div class="chat-message">
Lorem Ipsum is simpl.
</div>
</div>
<div class="left">
<div class="author-name">
Alice Novak
<small class="chat-date">
08:45 pm
</small>
</div>
<div class="chat-message active">
Check this stock char.
</div>
</div>
<div class="right">
<div class="author-name">
Anna Lamson
<small class="chat-date">
11:24 am
</small>
</div>
<div class="chat-message">
The standard chunk of Lorem Ipsum
</div>
</div>
<div class="left">
<div class="author-name">
Mick Lane
<small class="chat-date">
08:45 pm
</small>
</div>
<div class="chat-message active">
I belive that. Lorem Ipsum is simply dummy text.
</div>
</div>
</div>
<div class="form-chat">
<div class="input-group input-group-sm"><input type="text" class="form-control"> <span class="input-group-btn"> <button
class="btn btn-primary" type="button">Send
</button> </span></div>
</div>
</div>
<div id="small-chat" ng-click="openChat = !openChat">
<span class="badge badge-warning pull-right">5</span>
<a class="open-small-chat">
<i class="fa fa-comments"></i>
</a>
</div>
Christopher W. Olsen