Updates to control sidebar

This commit is contained in:
Abdullah Almsaeed
2015-03-28 20:39:26 -04:00
parent 4dacac85ec
commit 5e888faa31
23 changed files with 622 additions and 443 deletions

View File

@@ -654,324 +654,226 @@
</div><!-- /.row -->
</div><!-- /.box-body -->
</div><!-- /.box -->
<div class="row">
<div class="col-md-6">
<!-- DIRECT CHAT -->
<div class="box box-warning direct-chat direct-chat-warning">
<div class="box-header with-border">
<h3 class="box-title">Direct Chat</h3>
<div class="box-tools pull-right">
<span data-toggle="tooltip" title="3 New Messages" class='badge bg-yellow'>3</span>
<button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
<button class="btn btn-box-tool" data-toggle="tooltip" title="Contacts" data-widget="chat-pane-toggle"><i class="fa fa-comments"></i></button>
<button class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
</div>
</div><!-- /.box-header -->
<div class="box-body">
<!-- Conversations are loaded here -->
<div class="direct-chat-messages">
<!-- Message. Default to the left -->
<div class="direct-chat-msg">
<div class='direct-chat-info clearfix'>
<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 -->
<div class="direct-chat-text">
Is this template really for free? That's unbelievable!
</div><!-- /.direct-chat-text -->
</div><!-- /.direct-chat-msg -->
</div><!-- /.col -->
<!-- Message to the right -->
<div class="direct-chat-msg right">
<div class='direct-chat-info clearfix'>
<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 -->
<div class="direct-chat-text">
You better believe it!
</div><!-- /.direct-chat-text -->
</div><!-- /.direct-chat-msg -->
<div class="col-md-4">
<!-- Info Boxes Style 2 -->
<div class="info-box bg-yellow">
<span class="info-box-icon"><i class="ion ion-ios-pricetag-outline"></i></span>
<div class="info-box-content">
<span class="info-box-text">Inventory</span>
<span class="info-box-number">5,200</span>
<div class="progress">
<div class="progress-bar" style="width: 50%"></div>
</div>
<span class="progress-description">
50% Increase in 30 Days
</span>
</div><!-- /.info-box-content -->
</div><!-- /.info-box -->
<div class="info-box bg-green">
<span class="info-box-icon"><i class="ion ion-ios-heart-outline"></i></span>
<div class="info-box-content">
<span class="info-box-text">Mentions</span>
<span class="info-box-number">92,050</span>
<div class="progress">
<div class="progress-bar" style="width: 20%"></div>
</div>
<span class="progress-description">
20% Increase in 30 Days
</span>
</div><!-- /.info-box-content -->
</div><!-- /.info-box -->
<div class="info-box bg-red">
<span class="info-box-icon"><i class="ion ion-ios-cloud-download-outline"></i></span>
<div class="info-box-content">
<span class="info-box-text">Downloads</span>
<span class="info-box-number">114,381</span>
<div class="progress">
<div class="progress-bar" style="width: 70%"></div>
</div>
<span class="progress-description">
70% Increase in 30 Days
</span>
</div><!-- /.info-box-content -->
</div><!-- /.info-box -->
<div class="info-box bg-aqua">
<span class="info-box-icon"><i class="ion-ios-chatbubble-outline"></i></span>
<div class="info-box-content">
<span class="info-box-text">Direct Messages</span>
<span class="info-box-number">163,921</span>
<div class="progress">
<div class="progress-bar" style="width: 40%"></div>
</div>
<span class="progress-description">
40% Increase in 30 Days
</span>
</div><!-- /.info-box-content -->
</div><!-- /.info-box -->
</div><!-- /.col -->
</div><!-- /.row -->
<!-- Message. Default to the left -->
<div class="direct-chat-msg">
<div class='direct-chat-info clearfix'>
<span class='direct-chat-name pull-left'>Alexander Pierce</span>
<span class='direct-chat-timestamp pull-right'>23 Jan 5:37 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="dist/img/user1-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<div class="direct-chat-text">
Working with AdminLTE on a great new app! Wanna join?
</div><!-- /.direct-chat-text -->
</div><!-- /.direct-chat-msg -->
<div class='row'>
<div class='col-md-4'>
<!-- DIRECT CHAT -->
<div class="box box-warning direct-chat direct-chat-warning">
<div class="box-header with-border">
<h3 class="box-title">Direct Chat</h3>
<div class="box-tools pull-right">
<span data-toggle="tooltip" title="3 New Messages" class='badge bg-yellow'>3</span>
<button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
<button class="btn btn-box-tool" data-toggle="tooltip" title="Contacts" data-widget="chat-pane-toggle"><i class="fa fa-comments"></i></button>
<button class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
</div>
</div><!-- /.box-header -->
<div class="box-body">
<!-- Conversations are loaded here -->
<div class="direct-chat-messages">
<!-- Message. Default to the left -->
<div class="direct-chat-msg">
<div class='direct-chat-info clearfix'>
<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 -->
<div class="direct-chat-text">
Is this template really for free? That's unbelievable!
</div><!-- /.direct-chat-text -->
</div><!-- /.direct-chat-msg -->
<!-- Message to the right -->
<div class="direct-chat-msg right">
<div class='direct-chat-info clearfix'>
<span class='direct-chat-name pull-right'>Sarah Bullock</span>
<span class='direct-chat-timestamp pull-left'>23 Jan 6:10 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="dist/img/user3-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<div class="direct-chat-text">
I would love to.
</div><!-- /.direct-chat-text -->
</div><!-- /.direct-chat-msg -->
<!-- Message to the right -->
<div class="direct-chat-msg right">
<div class='direct-chat-info clearfix'>
<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 -->
<div class="direct-chat-text">
You better believe it!
</div><!-- /.direct-chat-text -->
</div><!-- /.direct-chat-msg -->
<!-- Message. Default to the left -->
<div class="direct-chat-msg">
<div class='direct-chat-info clearfix'>
<span class='direct-chat-name pull-left'>Alexander Pierce</span>
<span class='direct-chat-timestamp pull-right'>23 Jan 5:37 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="dist/img/user1-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<div class="direct-chat-text">
Working with AdminLTE on a great new app! Wanna join?
</div><!-- /.direct-chat-text -->
</div><!-- /.direct-chat-msg -->
<!-- Message to the right -->
<div class="direct-chat-msg right">
<div class='direct-chat-info clearfix'>
<span class='direct-chat-name pull-right'>Sarah Bullock</span>
<span class='direct-chat-timestamp pull-left'>23 Jan 6:10 pm</span>
</div><!-- /.direct-chat-info -->
<img class="direct-chat-img" src="dist/img/user3-128x128.jpg" alt="message user image" /><!-- /.direct-chat-img -->
<div class="direct-chat-text">
I would love to.
</div><!-- /.direct-chat-text -->
</div><!-- /.direct-chat-msg -->
</div><!--/.direct-chat-messages-->
</div><!--/.direct-chat-messages-->
<!-- Contacts are loaded here -->
<div class="direct-chat-contacts">
<ul class='contacts-list'>
<li>
<a href='#'>
<img class='contacts-list-img' src='dist/img/user1-128x128.jpg'/>
<div class='contacts-list-info'>
<span class='contacts-list-name'>
Count Dracula
<small class='contacts-list-date pull-right'>2/28/2015</small>
</span>
<span class='contacts-list-msg'>How have you been? I was...</span>
</div><!-- /.contacts-list-info -->
</a>
</li><!-- End Contact Item -->
<li>
<a href='#'>
<img class='contacts-list-img' src='dist/img/user7-128x128.jpg'/>
<div class='contacts-list-info'>
<span class='contacts-list-name'>
Sarah Doe
<small class='contacts-list-date pull-right'>2/23/2015</small>
</span>
<span class='contacts-list-msg'>I will be waiting for...</span>
</div><!-- /.contacts-list-info -->
</a>
</li><!-- End Contact Item -->
<li>
<a href='#'>
<img class='contacts-list-img' src='dist/img/user3-128x128.jpg'/>
<div class='contacts-list-info'>
<span class='contacts-list-name'>
Nadia Jolie
<small class='contacts-list-date pull-right'>2/20/2015</small>
</span>
<span class='contacts-list-msg'>I'll call you back at...</span>
</div><!-- /.contacts-list-info -->
</a>
</li><!-- End Contact Item -->
<li>
<a href='#'>
<img class='contacts-list-img' src='dist/img/user5-128x128.jpg'/>
<div class='contacts-list-info'>
<span class='contacts-list-name'>
Nora S. Vans
<small class='contacts-list-date pull-right'>2/10/2015</small>
</span>
<span class='contacts-list-msg'>Where is your new...</span>
</div><!-- /.contacts-list-info -->
</a>
</li><!-- End Contact Item -->
<li>
<a href='#'>
<img class='contacts-list-img' src='dist/img/user6-128x128.jpg'/>
<div class='contacts-list-info'>
<span class='contacts-list-name'>
John K.
<small class='contacts-list-date pull-right'>1/27/2015</small>
</span>
<span class='contacts-list-msg'>Can I take a look at...</span>
</div><!-- /.contacts-list-info -->
</a>
</li><!-- End Contact Item -->
<li>
<a href='#'>
<img class='contacts-list-img' src='dist/img/user8-128x128.jpg'/>
<div class='contacts-list-info'>
<span class='contacts-list-name'>
Kenneth M.
<small class='contacts-list-date pull-right'>1/4/2015</small>
</span>
<span class='contacts-list-msg'>Never mind I found...</span>
</div><!-- /.contacts-list-info -->
</a>
</li><!-- End Contact Item -->
</ul><!-- /.contatcts-list -->
</div><!-- /.direct-chat-pane -->
</div><!-- /.box-body -->
<div class="box-footer">
<form action="#" method="post">
<div class="input-group">
<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>
</div>
</form>
</div><!-- /.box-footer-->
</div><!--/.direct-chat -->
</div><!-- /.col -->
<div class='col-md-4'>
<!-- USERS LIST -->
<div class="box box-danger">
<div class="box-header with-border">
<h3 class="box-title">Latest Members</h3>
<div class="box-tools pull-right">
<span class="label label-danger">8 New Members</span>
<button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
<button class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
</div>
</div><!-- /.box-header -->
<div class="box-body no-padding">
<ul class="users-list clearfix">
<li>
<img src="dist/img/user1-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Alexander Pierce</a>
<span class="users-list-date">Today</span>
</li>
<li>
<img src="dist/img/user8-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Norman</a>
<span class="users-list-date">Yesterday</span>
</li>
<li>
<img src="dist/img/user7-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Jane</a>
<span class="users-list-date">12 Jan</span>
</li>
<li>
<img src="dist/img/user6-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">John</a>
<span class="users-list-date">12 Jan</span>
</li>
<li>
<img src="dist/img/user2-160x160.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Alexander</a>
<span class="users-list-date">13 Jan</span>
</li>
<li>
<img src="dist/img/user5-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Sarah</a>
<span class="users-list-date">14 Jan</span>
</li>
<li>
<img src="dist/img/user4-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Nora</a>
<span class="users-list-date">15 Jan</span>
</li>
<li>
<img src="dist/img/user3-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Nadia</a>
<span class="users-list-date">15 Jan</span>
</li>
</ul><!-- /.users-list -->
</div><!-- /.box-body -->
<div class="box-footer text-center">
<a href="javascript::" class="uppercase">View All Users</a>
</div><!-- /.box-footer -->
</div><!--/.box -->
</div><!-- /.col -->
<div class='col-md-4'>
<div class="box box-default">
<div class="box-header with-border">
<h3 class="box-title">Browser Usage</h3>
<div class="box-tools pull-right">
<button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
<button class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
</div>
</div><!-- /.box-header -->
<div class="box-body">
<div class="row">
<div class="col-md-8">
<div class="chart-responsive">
<canvas id="pieChart" height="150"></canvas>
</div><!-- ./chart-responsive -->
</div><!-- /.col -->
<div class="col-md-4">
<ul class="chart-legend clearfix">
<li><i class="fa fa-circle-o text-red"></i> Chrome</li>
<li><i class="fa fa-circle-o text-green"></i> IE</li>
<li><i class="fa fa-circle-o text-yellow"></i> FireFox</li>
<li><i class="fa fa-circle-o text-aqua"></i> Safari</li>
<li><i class="fa fa-circle-o text-light-blue"></i> Opera</li>
<li><i class="fa fa-circle-o text-gray"></i> Navigator</li>
</ul>
</div><!-- /.col -->
</div><!-- /.row -->
</div><!-- /.box-body -->
<div class="box-footer no-padding">
<ul class="nav nav-pills nav-stacked">
<li><a href="#">United States of America <span class="pull-right text-red"><i class="fa fa-angle-down"></i> 12%</span></a></li>
<li><a href="#">India <span class="pull-right text-green"><i class="fa fa-angle-up"></i> 4%</span></a></li>
<li><a href="#">China <span class="pull-right text-yellow"><i class="fa fa-angle-left"></i> 0%</span></a></li>
</ul>
</div><!-- /.footer -->
</div><!-- /.box -->
</div><!-- /.col -->
</div><!-- /.row -->
<!-- Contacts are loaded here -->
<div class="direct-chat-contacts">
<ul class='contacts-list'>
<li>
<a href='#'>
<img class='contacts-list-img' src='dist/img/user1-128x128.jpg'/>
<div class='contacts-list-info'>
<span class='contacts-list-name'>
Count Dracula
<small class='contacts-list-date pull-right'>2/28/2015</small>
</span>
<span class='contacts-list-msg'>How have you been? I was...</span>
</div><!-- /.contacts-list-info -->
</a>
</li><!-- End Contact Item -->
<li>
<a href='#'>
<img class='contacts-list-img' src='dist/img/user7-128x128.jpg'/>
<div class='contacts-list-info'>
<span class='contacts-list-name'>
Sarah Doe
<small class='contacts-list-date pull-right'>2/23/2015</small>
</span>
<span class='contacts-list-msg'>I will be waiting for...</span>
</div><!-- /.contacts-list-info -->
</a>
</li><!-- End Contact Item -->
<li>
<a href='#'>
<img class='contacts-list-img' src='dist/img/user3-128x128.jpg'/>
<div class='contacts-list-info'>
<span class='contacts-list-name'>
Nadia Jolie
<small class='contacts-list-date pull-right'>2/20/2015</small>
</span>
<span class='contacts-list-msg'>I'll call you back at...</span>
</div><!-- /.contacts-list-info -->
</a>
</li><!-- End Contact Item -->
<li>
<a href='#'>
<img class='contacts-list-img' src='dist/img/user5-128x128.jpg'/>
<div class='contacts-list-info'>
<span class='contacts-list-name'>
Nora S. Vans
<small class='contacts-list-date pull-right'>2/10/2015</small>
</span>
<span class='contacts-list-msg'>Where is your new...</span>
</div><!-- /.contacts-list-info -->
</a>
</li><!-- End Contact Item -->
<li>
<a href='#'>
<img class='contacts-list-img' src='dist/img/user6-128x128.jpg'/>
<div class='contacts-list-info'>
<span class='contacts-list-name'>
John K.
<small class='contacts-list-date pull-right'>1/27/2015</small>
</span>
<span class='contacts-list-msg'>Can I take a look at...</span>
</div><!-- /.contacts-list-info -->
</a>
</li><!-- End Contact Item -->
<li>
<a href='#'>
<img class='contacts-list-img' src='dist/img/user8-128x128.jpg'/>
<div class='contacts-list-info'>
<span class='contacts-list-name'>
Kenneth M.
<small class='contacts-list-date pull-right'>1/4/2015</small>
</span>
<span class='contacts-list-msg'>Never mind I found...</span>
</div><!-- /.contacts-list-info -->
</a>
</li><!-- End Contact Item -->
</ul><!-- /.contatcts-list -->
</div><!-- /.direct-chat-pane -->
</div><!-- /.box-body -->
<div class="box-footer">
<form action="#" method="post">
<div class="input-group">
<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>
</div>
</form>
</div><!-- /.box-footer-->
</div><!--/.direct-chat -->
</div><!-- /.col -->
<div class="row">
<div class="col-md-8">
<div class="col-md-6">
<!-- USERS LIST -->
<div class="box box-danger">
<div class="box-header with-border">
<h3 class="box-title">Latest Members</h3>
<div class="box-tools pull-right">
<span class="label label-danger">8 New Members</span>
<button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
<button class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
</div>
</div><!-- /.box-header -->
<div class="box-body no-padding">
<ul class="users-list clearfix">
<li>
<img src="dist/img/user1-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Alexander Pierce</a>
<span class="users-list-date">Today</span>
</li>
<li>
<img src="dist/img/user8-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Norman</a>
<span class="users-list-date">Yesterday</span>
</li>
<li>
<img src="dist/img/user7-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Jane</a>
<span class="users-list-date">12 Jan</span>
</li>
<li>
<img src="dist/img/user6-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">John</a>
<span class="users-list-date">12 Jan</span>
</li>
<li>
<img src="dist/img/user2-160x160.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Alexander</a>
<span class="users-list-date">13 Jan</span>
</li>
<li>
<img src="dist/img/user5-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Sarah</a>
<span class="users-list-date">14 Jan</span>
</li>
<li>
<img src="dist/img/user4-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Nora</a>
<span class="users-list-date">15 Jan</span>
</li>
<li>
<img src="dist/img/user3-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Nadia</a>
<span class="users-list-date">15 Jan</span>
</li>
</ul><!-- /.users-list -->
</div><!-- /.box-body -->
<div class="box-footer text-center">
<a href="javascript::" class="uppercase">View All Users</a>
</div><!-- /.box-footer -->
</div><!--/.box -->
</div><!-- /.col -->
</div><!-- /.row -->
<!-- TABLE: LATEST ORDERS -->
<div class="box box-info">
<div class="box-header with-border">
@@ -1045,7 +947,98 @@
</div><!-- /.box-footer -->
</div><!-- /.box -->
</div><!-- /.col -->
<div class="col-md-4">
<!-- Info Boxes Style 2 -->
<div class="info-box bg-yellow">
<span class="info-box-icon"><i class="ion ion-ios-pricetag-outline"></i></span>
<div class="info-box-content">
<span class="info-box-text">Inventory</span>
<span class="info-box-number">5,200</span>
<div class="progress">
<div class="progress-bar" style="width: 50%"></div>
</div>
<span class="progress-description">
50% Increase in 30 Days
</span>
</div><!-- /.info-box-content -->
</div><!-- /.info-box -->
<div class="info-box bg-green">
<span class="info-box-icon"><i class="ion ion-ios-heart-outline"></i></span>
<div class="info-box-content">
<span class="info-box-text">Mentions</span>
<span class="info-box-number">92,050</span>
<div class="progress">
<div class="progress-bar" style="width: 20%"></div>
</div>
<span class="progress-description">
20% Increase in 30 Days
</span>
</div><!-- /.info-box-content -->
</div><!-- /.info-box -->
<div class="info-box bg-red">
<span class="info-box-icon"><i class="ion ion-ios-cloud-download-outline"></i></span>
<div class="info-box-content">
<span class="info-box-text">Downloads</span>
<span class="info-box-number">114,381</span>
<div class="progress">
<div class="progress-bar" style="width: 70%"></div>
</div>
<span class="progress-description">
70% Increase in 30 Days
</span>
</div><!-- /.info-box-content -->
</div><!-- /.info-box -->
<div class="info-box bg-aqua">
<span class="info-box-icon"><i class="ion-ios-chatbubble-outline"></i></span>
<div class="info-box-content">
<span class="info-box-text">Direct Messages</span>
<span class="info-box-number">163,921</span>
<div class="progress">
<div class="progress-bar" style="width: 40%"></div>
</div>
<span class="progress-description">
40% Increase in 30 Days
</span>
</div><!-- /.info-box-content -->
</div><!-- /.info-box -->
<div class="box box-default">
<div class="box-header with-border">
<h3 class="box-title">Browser Usage</h3>
<div class="box-tools pull-right">
<button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
<button class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
</div>
</div><!-- /.box-header -->
<div class="box-body">
<div class="row">
<div class="col-md-8">
<div class="chart-responsive">
<canvas id="pieChart" height="150"></canvas>
</div><!-- ./chart-responsive -->
</div><!-- /.col -->
<div class="col-md-4">
<ul class="chart-legend clearfix">
<li><i class="fa fa-circle-o text-red"></i> Chrome</li>
<li><i class="fa fa-circle-o text-green"></i> IE</li>
<li><i class="fa fa-circle-o text-yellow"></i> FireFox</li>
<li><i class="fa fa-circle-o text-aqua"></i> Safari</li>
<li><i class="fa fa-circle-o text-light-blue"></i> Opera</li>
<li><i class="fa fa-circle-o text-gray"></i> Navigator</li>
</ul>
</div><!-- /.col -->
</div><!-- /.row -->
</div><!-- /.box-body -->
<div class="box-footer no-padding">
<ul class="nav nav-pills nav-stacked">
<li><a href="#">United States of America <span class="pull-right text-red"><i class="fa fa-angle-down"></i> 12%</span></a></li>
<li><a href="#">India <span class="pull-right text-green"><i class="fa fa-angle-up"></i> 4%</span></a></li>
<li><a href="#">China <span class="pull-right text-yellow"><i class="fa fa-angle-left"></i> 0%</span></a></li>
</ul>
</div><!-- /.footer -->
</div><!-- /.box -->
<!-- PRODUCT LIST -->
<div class="box box-primary">
<div class="box-header with-border">
@@ -1109,7 +1102,6 @@
</div><!-- /.box -->
</div><!-- /.col -->
</div><!-- /.row -->
</section><!-- /.content -->
</div><!-- /.content-wrapper -->
@@ -1125,18 +1117,100 @@
<!-- Create the tabs -->
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
<li class="active"><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
<li><a href="#control-sidebar-stats-tab" data-toggle="tab"><i class="fa fa-pie-chart"></i></a></li>
<!--li><a href="#control-sidebar-stats-tab" data-toggle="tab"><i class="fa fa-pie-chart"></i></a></li-->
<li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<!-- Home tab content -->
<div class="tab-pane active" id="control-sidebar-home-tab">
<h5 class="control-sidebar-heading">News Feed</h5>
<h3 class="control-sidebar-heading">Recent Activity</h3>
<ul class='control-sidebar-menu'>
<li>
<a href='javascript::;'>
<i class="menu-icon fa fa-birthday-cake bg-red"></i>
<div class="menu-info">
<h4 class="control-sidebar-subheading">Langdon's Birthday</h4>
<p>Will be 23 on April 24th</p>
</div>
</a>
</li>
<li>
<a href='javascript::;'>
<i class="menu-icon fa fa-user bg-yellow"></i>
<div class="menu-info">
<h4 class="control-sidebar-subheading">Frodo Updated His Profile</h4>
<p>New phone +1(800)555-1234</p>
</div>
</a>
</li>
<li>
<a href='javascript::;'>
<i class="menu-icon fa fa-envelope-o bg-light-blue"></i>
<div class="menu-info">
<h4 class="control-sidebar-subheading">Nora Joined Mailing List</h4>
<p>nora@example.com</p>
</div>
</a>
</li>
<li>
<a href='javascript::;'>
<i class="menu-icon fa fa-file-code-o bg-green"></i>
<div class="menu-info">
<h4 class="control-sidebar-subheading">Cron Job 254 Executed</h4>
<p>Execution time 5 seconds</p>
</div>
</a>
</li>
</ul><!-- /.control-sidebar-menu -->
<h5 class="control-sidebar-heading">Mail</h5>
<h5 class="control-sidebar-heading">Todo List</h5>
<h3 class="control-sidebar-heading">Tasks Progress</h3>
<ul class='control-sidebar-menu'>
<li>
<a href='javascript::;'>
<h4 class="control-sidebar-subheading">
Custom Template Design
<span class="label label-danger pull-right">70%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-danger" style="width: 70%"></div>
</div>
</a>
</li>
<li>
<a href='javascript::;'>
<h4 class="control-sidebar-subheading">
Update Resume
<span class="label label-success pull-right">95%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-success" style="width: 95%"></div>
</div>
</a>
</li>
<li>
<a href='javascript::;'>
<h4 class="control-sidebar-subheading">
Laravel Integration
<span class="label label-waring pull-right">50%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-warning" style="width: 50%"></div>
</div>
</a>
</li>
<li>
<a href='javascript::;'>
<h4 class="control-sidebar-subheading">
Back End Framework
<span class="label label-primary pull-right">68%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-primary" style="width: 68%"></div>
</div>
</a>
</li>
</ul><!-- /.control-sidebar-menu -->
</div><!-- /.tab-pane -->
<!-- Stats tab content -->
@@ -1144,7 +1218,7 @@
<!-- Settings tab content -->
<div class="tab-pane" id="control-sidebar-settings-tab">
<form method="post">
<h5 class="control-sidebar-heading">General Settings</h5>
<h3 class="control-sidebar-heading">General Settings</h3>
<div class="form-group">
<label class="control-sidebar-subheading">
Report panel usage
@@ -1154,7 +1228,7 @@
Some information about this general settings option
</p>
</div><!-- /.form-group -->
<div class="form-group">
<label class="control-sidebar-subheading">
Allow mail redirect
@@ -1164,7 +1238,7 @@
Other sets of options are available
</p>
</div><!-- /.form-group -->
<div class="form-group">
<label class="control-sidebar-subheading">
Expose author name in posts
@@ -1174,23 +1248,23 @@
Allow the user to show his name in blog posts
</p>
</div><!-- /.form-group -->
<h5 class="control-sidebar-heading">Chat Settings</h5>
<h3 class="control-sidebar-heading">Chat Settings</h3>
<div class="form-group">
<label class="control-sidebar-subheading">
Show me as online
<input type="checkbox" class="pull-right" checked />
</label>
</div><!-- /.form-group -->
<div class="form-group">
<label class="control-sidebar-subheading">
Turn off notifications
<input type="checkbox" class="pull-right" />
</label>
</div><!-- /.form-group -->
<div class="form-group">
<label class="control-sidebar-subheading">
Delete chat history
@@ -1230,7 +1304,7 @@
<!-- AdminLTE dashboard demo (This is only for demo purposes) -->
<script src="dist/js/pages/dashboard2.js" type="text/javascript"></script>
<!-- AdminLTE for demo purposes --
<script src="dist/js/demo.js" type="text/javascript"></script-->
<!-- AdminLTE for demo purposes -->
<script src="dist/js/demo.js" type="text/javascript"></script>
</body>
</html>