Added colorstrike website to git
This commit is contained in:
Gogs
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
+2334
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,780 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Modals</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
<style>
|
||||
.example-modal .modal {
|
||||
position: relative;
|
||||
top: auto;
|
||||
bottom: auto;
|
||||
right: auto;
|
||||
left: auto;
|
||||
display: block;
|
||||
z-index: 1;
|
||||
}
|
||||
.example-modal .modal {
|
||||
background: transparent!important;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
AdminLTE Design Team
|
||||
<small><i class="fa fa-clock-o"></i> 2 hours</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Developers
|
||||
<small><i class="fa fa-clock-o"></i> Today</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Sales Department
|
||||
<small><i class="fa fa-clock-o"></i> Yesterday</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Reviewers
|
||||
<small><i class="fa fa-clock-o"></i> 2 days</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the page and may cause design problems
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-red"></i> 5 new members joined
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user text-red"></i> You changed your username
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Create a nice theme
|
||||
<small class="pull-right">40%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">40% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Some task I need to do
|
||||
<small class="pull-right">60%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">60% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Make beautiful transitions
|
||||
<small class="pull-right">80%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">80% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li class="active"><a href="modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Modals
|
||||
<small>new</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">UI</a></li>
|
||||
<li class="active">Modals</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="example-modal">
|
||||
<div class="modal">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title">Modal Default</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>One fine body…</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default pull-left" data-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-primary">Save changes</button>
|
||||
</div>
|
||||
</div><!-- /.modal-content -->
|
||||
</div><!-- /.modal-dialog -->
|
||||
</div><!-- /.modal -->
|
||||
</div><!-- /.example-modal -->
|
||||
|
||||
<div class="example-modal">
|
||||
<div class="modal modal-primary">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title">Modal Primary</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>One fine body…</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-outline pull-left" data-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-outline">Save changes</button>
|
||||
</div>
|
||||
</div><!-- /.modal-content -->
|
||||
</div><!-- /.modal-dialog -->
|
||||
</div><!-- /.modal -->
|
||||
</div><!-- /.example-modal -->
|
||||
|
||||
<div class="example-modal">
|
||||
<div class="modal modal-info">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title">Modal Info</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>One fine body…</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-outline pull-left" data-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-outline">Save changes</button>
|
||||
</div>
|
||||
</div><!-- /.modal-content -->
|
||||
</div><!-- /.modal-dialog -->
|
||||
</div><!-- /.modal -->
|
||||
</div><!-- /.example-modal -->
|
||||
|
||||
<div class="example-modal">
|
||||
<div class="modal modal-warning">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title">Modal Warning</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>One fine body…</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-outline pull-left" data-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-outline">Save changes</button>
|
||||
</div>
|
||||
</div><!-- /.modal-content -->
|
||||
</div><!-- /.modal-dialog -->
|
||||
</div><!-- /.modal -->
|
||||
</div><!-- /.example-modal -->
|
||||
|
||||
<div class="example-modal">
|
||||
<div class="modal modal-success">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title">Modal Success</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>One fine body…</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-outline pull-left" data-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-outline">Save changes</button>
|
||||
</div>
|
||||
</div><!-- /.modal-content -->
|
||||
</div><!-- /.modal-dialog -->
|
||||
</div><!-- /.modal -->
|
||||
</div><!-- /.example-modal -->
|
||||
|
||||
<div class="example-modal">
|
||||
<div class="modal modal-danger">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title">Modal Danger</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>One fine body…</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-outline pull-left" data-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-outline">Save changes</button>
|
||||
</div>
|
||||
</div><!-- /.modal-content -->
|
||||
</div><!-- /.modal-dialog -->
|
||||
</div><!-- /.modal -->
|
||||
</div><!-- /.example-modal -->
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,799 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | UI Sliders</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ion Slider -->
|
||||
<link href="../../plugins/ionslider/ion.rangeSlider.css" rel="stylesheet" type="text/css" />
|
||||
<!-- ion slider Nice -->
|
||||
<link href="../../plugins/ionslider/ion.rangeSlider.skinNice.css" rel="stylesheet" type="text/css" />
|
||||
<!-- bootstrap slider -->
|
||||
<link href="../../plugins/bootstrap-slider/slider.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
AdminLTE Design Team
|
||||
<small><i class="fa fa-clock-o"></i> 2 hours</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Developers
|
||||
<small><i class="fa fa-clock-o"></i> Today</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Sales Department
|
||||
<small><i class="fa fa-clock-o"></i> Yesterday</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Reviewers
|
||||
<small><i class="fa fa-clock-o"></i> 2 days</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the page and may cause design problems
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-red"></i> 5 new members joined
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user text-red"></i> You changed your username
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Create a nice theme
|
||||
<small class="pull-right">40%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">40% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Some task I need to do
|
||||
<small class="pull-right">60%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">60% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Make beautiful transitions
|
||||
<small class="pull-right">80%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">80% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li class="active"><a href="sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Sliders
|
||||
<small>range sliders</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">UI</a></li>
|
||||
<li class="active">Sliders</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<div class="box box-primary">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Ion Slider</h3>
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body">
|
||||
<div class="row margin">
|
||||
<div class="col-sm-6">
|
||||
<input id="range_1" type="text" name="range_1" value="" />
|
||||
</div>
|
||||
|
||||
<div class="col-sm-6">
|
||||
<input id="range_2" type="text" name="range_2" value="1000;100000" data-type="double" data-step="500" data-postfix=" €" data-from="30000" data-to="90000" data-hasgrid="true" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row margin">
|
||||
<div class="col-sm-6">
|
||||
<input id="range_5" type="text" name="range_5" value="" />
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<input id="range_6" type="text" name="range_6" value="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row margin">
|
||||
<div class="col-sm-12">
|
||||
<input id="range_4" type="text" name="range_4" value="10000;100000" />
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<div class="box box-primary">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Bootstrap Slider</h3>
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body">
|
||||
<div class="row margin">
|
||||
<div class="col-sm-6">
|
||||
<input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200" data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="horizontal" data-slider-selection="before" data-slider-tooltip="show" data-slider-id="red">
|
||||
<p>data-slider-id="red"</p>
|
||||
<input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200" data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="horizontal" data-slider-selection="before" data-slider-tooltip="show" data-slider-id="blue">
|
||||
<p>data-slider-id="blue"</p>
|
||||
<input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200" data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="horizontal" data-slider-selection="before" data-slider-tooltip="show" data-slider-id="green">
|
||||
<p>data-slider-id="green"</p>
|
||||
<input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200" data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="horizontal" data-slider-selection="before" data-slider-tooltip="show" data-slider-id="yellow">
|
||||
<p>data-slider-id="yellow"</p>
|
||||
<input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200" data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="horizontal" data-slider-selection="before" data-slider-tooltip="show" data-slider-id="aqua">
|
||||
<p>data-slider-id="aqua"</p>
|
||||
<input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200" data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="horizontal" data-slider-selection="before" data-slider-tooltip="show" data-slider-id="purple">
|
||||
<p style="margin-top: 10px">data-slider-id="purple"</p>
|
||||
</div>
|
||||
<div class="col-sm-6 text-center">
|
||||
<input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200" data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="vertical" data-slider-selection="before" data-slider-tooltip="show" data-slider-id="red">
|
||||
<input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200" data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="vertical" data-slider-selection="before" data-slider-tooltip="show" data-slider-id="blue">
|
||||
<input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200" data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="vertical" data-slider-selection="before" data-slider-tooltip="show" data-slider-id="green">
|
||||
<input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200" data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="vertical" data-slider-selection="before" data-slider-tooltip="show" data-slider-id="yellow">
|
||||
<input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200" data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="vertical" data-slider-selection="before" data-slider-tooltip="show" data-slider-id="aqua">
|
||||
<input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200" data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="vertical" data-slider-selection="before" data-slider-tooltip="show" data-slider-id="purple">
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
<!-- Ion Slider -->
|
||||
<script src="../../plugins/ionslider/ion.rangeSlider.min.js" type="text/javascript"></script>
|
||||
|
||||
<!-- Bootstrap slider -->
|
||||
<script src="../../plugins/bootstrap-slider/bootstrap-slider.js" type="text/javascript"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
/* BOOTSTRAP SLIDER */
|
||||
$('.slider').slider();
|
||||
|
||||
/* ION SLIDER */
|
||||
$("#range_1").ionRangeSlider({
|
||||
min: 0,
|
||||
max: 5000,
|
||||
from: 1000,
|
||||
to: 4000,
|
||||
type: 'double',
|
||||
step: 1,
|
||||
prefix: "$",
|
||||
prettify: false,
|
||||
hasGrid: true
|
||||
});
|
||||
$("#range_2").ionRangeSlider();
|
||||
|
||||
$("#range_5").ionRangeSlider({
|
||||
min: 0,
|
||||
max: 10,
|
||||
type: 'single',
|
||||
step: 0.1,
|
||||
postfix: " mm",
|
||||
prettify: false,
|
||||
hasGrid: true
|
||||
});
|
||||
$("#range_6").ionRangeSlider({
|
||||
min: -50,
|
||||
max: 50,
|
||||
from: 0,
|
||||
type: 'single',
|
||||
step: 1,
|
||||
postfix: "°",
|
||||
prettify: false,
|
||||
hasGrid: true
|
||||
});
|
||||
|
||||
$("#range_4").ionRangeSlider({
|
||||
type: "single",
|
||||
step: 100,
|
||||
postfix: " light years",
|
||||
from: 55000,
|
||||
hideMinMax: true,
|
||||
hideFromTo: false
|
||||
});
|
||||
$("#range_3").ionRangeSlider({
|
||||
type: "double",
|
||||
postfix: " miles",
|
||||
step: 10000,
|
||||
from: 25000000,
|
||||
to: 35000000,
|
||||
onChange: function (obj) {
|
||||
var t = "";
|
||||
for (var prop in obj) {
|
||||
t += prop + ": " + obj[prop] + "\r\n";
|
||||
}
|
||||
$("#result").html(t);
|
||||
},
|
||||
onLoad: function (obj) {
|
||||
//
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,803 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Timeline</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
AdminLTE Design Team
|
||||
<small><i class="fa fa-clock-o"></i> 2 hours</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Developers
|
||||
<small><i class="fa fa-clock-o"></i> Today</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Sales Department
|
||||
<small><i class="fa fa-clock-o"></i> Yesterday</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Reviewers
|
||||
<small><i class="fa fa-clock-o"></i> 2 days</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the page and may cause design problems
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-red"></i> 5 new members joined
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user text-red"></i> You changed your username
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Create a nice theme
|
||||
<small class="pull-right">40%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">40% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Some task I need to do
|
||||
<small class="pull-right">60%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">60% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Make beautiful transitions
|
||||
<small class="pull-right">80%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">80% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li class="active"><a href="timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Timeline
|
||||
<small>example</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">UI</a></li>
|
||||
<li class="active">Timeline</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
|
||||
<!-- row -->
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<!-- The time line -->
|
||||
<ul class="timeline">
|
||||
<!-- timeline time label -->
|
||||
<li class="time-label">
|
||||
<span class="bg-red">
|
||||
10 Feb. 2014
|
||||
</span>
|
||||
</li>
|
||||
<!-- /.timeline-label -->
|
||||
<!-- timeline item -->
|
||||
<li>
|
||||
<i class="fa fa-envelope bg-blue"></i>
|
||||
<div class="timeline-item">
|
||||
<span class="time"><i class="fa fa-clock-o"></i> 12:05</span>
|
||||
<h3 class="timeline-header"><a href="#">Support Team</a> sent you an email</h3>
|
||||
<div class="timeline-body">
|
||||
Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles,
|
||||
weebly ning heekya handango imeem plugg dopplr jibjab, movity
|
||||
jajah plickers sifteo edmodo ifttt zimbra. Babblely odeo kaboodle
|
||||
quora plaxo ideeli hulu weebly balihoo...
|
||||
</div>
|
||||
<div class='timeline-footer'>
|
||||
<a class="btn btn-primary btn-xs">Read more</a>
|
||||
<a class="btn btn-danger btn-xs">Delete</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<!-- END timeline item -->
|
||||
<!-- timeline item -->
|
||||
<li>
|
||||
<i class="fa fa-user bg-aqua"></i>
|
||||
<div class="timeline-item">
|
||||
<span class="time"><i class="fa fa-clock-o"></i> 5 mins ago</span>
|
||||
<h3 class="timeline-header no-border"><a href="#">Sarah Young</a> accepted your friend request</h3>
|
||||
</div>
|
||||
</li>
|
||||
<!-- END timeline item -->
|
||||
<!-- timeline item -->
|
||||
<li>
|
||||
<i class="fa fa-comments bg-yellow"></i>
|
||||
<div class="timeline-item">
|
||||
<span class="time"><i class="fa fa-clock-o"></i> 27 mins ago</span>
|
||||
<h3 class="timeline-header"><a href="#">Jay White</a> commented on your post</h3>
|
||||
<div class="timeline-body">
|
||||
Take me to your leader!
|
||||
Switzerland is small and neutral!
|
||||
We are more like Germany, ambitious and misunderstood!
|
||||
</div>
|
||||
<div class='timeline-footer'>
|
||||
<a class="btn btn-warning btn-flat btn-xs">View comment</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<!-- END timeline item -->
|
||||
<!-- timeline time label -->
|
||||
<li class="time-label">
|
||||
<span class="bg-green">
|
||||
3 Jan. 2014
|
||||
</span>
|
||||
</li>
|
||||
<!-- /.timeline-label -->
|
||||
<!-- timeline item -->
|
||||
<li>
|
||||
<i class="fa fa-camera bg-purple"></i>
|
||||
<div class="timeline-item">
|
||||
<span class="time"><i class="fa fa-clock-o"></i> 2 days ago</span>
|
||||
<h3 class="timeline-header"><a href="#">Mina Lee</a> uploaded new photos</h3>
|
||||
<div class="timeline-body">
|
||||
<img src="http://placehold.it/150x100" alt="..." class='margin' />
|
||||
<img src="http://placehold.it/150x100" alt="..." class='margin'/>
|
||||
<img src="http://placehold.it/150x100" alt="..." class='margin'/>
|
||||
<img src="http://placehold.it/150x100" alt="..." class='margin'/>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<!-- END timeline item -->
|
||||
<!-- timeline item -->
|
||||
<li>
|
||||
<i class="fa fa-video-camera bg-maroon"></i>
|
||||
<div class="timeline-item">
|
||||
<span class="time"><i class="fa fa-clock-o"></i> 5 days ago</span>
|
||||
<h3 class="timeline-header"><a href="#">Mr. Doe</a> shared a video</h3>
|
||||
<div class="timeline-body">
|
||||
<div class="embed-responsive embed-responsive-16by9">
|
||||
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/tMWkeBIohBs" frameborder="0" allowfullscreen></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="timeline-footer">
|
||||
<a href="#" class="btn btn-xs bg-maroon">See comments</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<!-- END timeline item -->
|
||||
<li>
|
||||
<i class="fa fa-clock-o bg-gray"></i>
|
||||
</li>
|
||||
</ul>
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
<div class="row" style="margin-top: 10px;">
|
||||
<div class="col-md-12">
|
||||
<div class="box box-primary">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title"><i class="fa fa-code"></i> Timeline Markup</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<pre style="font-weight: 600;">
|
||||
<ul class="timeline">
|
||||
|
||||
<!-- timeline time label -->
|
||||
<li class="time-label">
|
||||
<span class="bg-red">
|
||||
10 Feb. 2014
|
||||
</span>
|
||||
</li>
|
||||
<!-- /.timeline-label -->
|
||||
|
||||
<!-- timeline item -->
|
||||
<li>
|
||||
<!-- timeline icon -->
|
||||
<i class="fa fa-envelope bg-blue"></i>
|
||||
<div class="timeline-item">
|
||||
<span class="time"><i class="fa fa-clock-o"></i> 12:05</span>
|
||||
|
||||
<h3 class="timeline-header"><a href="#">Support Team</a> ...</h3>
|
||||
|
||||
<div class="timeline-body">
|
||||
...
|
||||
Content goes here
|
||||
</div>
|
||||
|
||||
<div class='timeline-footer'>
|
||||
<a class="btn btn-primary btn-xs">...</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<!-- END timeline item -->
|
||||
|
||||
...
|
||||
|
||||
</ul>
|
||||
</pre>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,878 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Calendar</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- fullCalendar 2.2.5-->
|
||||
<link href="../plugins/fullcalendar/fullcalendar.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="../plugins/fullcalendar/fullcalendar.print.css" rel="stylesheet" type="text/css" media='print' />
|
||||
<!-- Theme style -->
|
||||
<link href="../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
AdminLTE Design Team
|
||||
<small><i class="fa fa-clock-o"></i> 2 hours</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Developers
|
||||
<small><i class="fa fa-clock-o"></i> Today</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Sales Department
|
||||
<small><i class="fa fa-clock-o"></i> Yesterday</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Reviewers
|
||||
<small><i class="fa fa-clock-o"></i> 2 days</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the page and may cause design problems
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-red"></i> 5 new members joined
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user text-red"></i> You changed your username
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Create a nice theme
|
||||
<small class="pull-right">40%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">40% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Some task I need to do
|
||||
<small class="pull-right">60%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">60% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Make beautiful transitions
|
||||
<small class="pull-right">80%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">80% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="active">
|
||||
<a href="calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Calendar
|
||||
<small>Control panel</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li class="active">Calendar</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<div class="box box-solid">
|
||||
<div class="box-header with-border">
|
||||
<h4 class="box-title">Draggable Events</h4>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<!-- the events -->
|
||||
<div id='external-events'>
|
||||
<div class='external-event bg-green'>Lunch</div>
|
||||
<div class='external-event bg-yellow'>Go home</div>
|
||||
<div class='external-event bg-aqua'>Do homework</div>
|
||||
<div class='external-event bg-light-blue'>Work on UI design</div>
|
||||
<div class='external-event bg-red'>Sleep tight</div>
|
||||
<div class="checkbox">
|
||||
<label for='drop-remove'>
|
||||
<input type='checkbox' id='drop-remove' />
|
||||
remove after drop
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /. box -->
|
||||
<div class="box box-solid">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Create Event</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div class="btn-group" style="width: 100%; margin-bottom: 10px;">
|
||||
<!--<button type="button" id="color-chooser-btn" class="btn btn-info btn-block dropdown-toggle" data-toggle="dropdown">Color <span class="caret"></span></button>-->
|
||||
<ul class="fc-color-picker" id="color-chooser">
|
||||
<li><a class="text-aqua" href="#"><i class="fa fa-square"></i></a></li>
|
||||
<li><a class="text-blue" href="#"><i class="fa fa-square"></i></a></li>
|
||||
<li><a class="text-light-blue" href="#"><i class="fa fa-square"></i></a></li>
|
||||
<li><a class="text-teal" href="#"><i class="fa fa-square"></i></a></li>
|
||||
<li><a class="text-yellow" href="#"><i class="fa fa-square"></i></a></li>
|
||||
<li><a class="text-orange" href="#"><i class="fa fa-square"></i></a></li>
|
||||
<li><a class="text-green" href="#"><i class="fa fa-square"></i></a></li>
|
||||
<li><a class="text-lime" href="#"><i class="fa fa-square"></i></a></li>
|
||||
<li><a class="text-red" href="#"><i class="fa fa-square"></i></a></li>
|
||||
<li><a class="text-purple" href="#"><i class="fa fa-square"></i></a></li>
|
||||
<li><a class="text-fuchsia" href="#"><i class="fa fa-square"></i></a></li>
|
||||
<li><a class="text-muted" href="#"><i class="fa fa-square"></i></a></li>
|
||||
<li><a class="text-navy" href="#"><i class="fa fa-square"></i></a></li>
|
||||
</ul>
|
||||
</div><!-- /btn-group -->
|
||||
<div class="input-group">
|
||||
<input id="new-event" type="text" class="form-control" placeholder="Event Title">
|
||||
<div class="input-group-btn">
|
||||
<button id="add-new-event" type="button" class="btn btn-primary btn-flat">Add</button>
|
||||
</div><!-- /btn-group -->
|
||||
</div><!-- /input-group -->
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.col -->
|
||||
<div class="col-md-9">
|
||||
<div class="box box-primary">
|
||||
<div class="box-body no-padding">
|
||||
<!-- THE CALENDAR -->
|
||||
<div id="calendar"></div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /. box -->
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- jQuery UI 1.11.1 -->
|
||||
<script src="https://code.jquery.com/ui/1.11.1/jquery-ui.min.js" type="text/javascript"></script>
|
||||
<!-- Slimscroll -->
|
||||
<script src="../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../dist/js/demo.js" type="text/javascript"></script>
|
||||
<!-- fullCalendar 2.2.5 -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js" type="text/javascript"></script>
|
||||
<script src="../plugins/fullcalendar/fullcalendar.min.js" type="text/javascript"></script>
|
||||
<!-- Page specific script -->
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
/* initialize the external events
|
||||
-----------------------------------------------------------------*/
|
||||
function ini_events(ele) {
|
||||
ele.each(function () {
|
||||
|
||||
// create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/)
|
||||
// it doesn't need to have a start or end
|
||||
var eventObject = {
|
||||
title: $.trim($(this).text()) // use the element's text as the event title
|
||||
};
|
||||
|
||||
// store the Event Object in the DOM element so we can get to it later
|
||||
$(this).data('eventObject', eventObject);
|
||||
|
||||
// make the event draggable using jQuery UI
|
||||
$(this).draggable({
|
||||
zIndex: 1070,
|
||||
revert: true, // will cause the event to go back to its
|
||||
revertDuration: 0 // original position after the drag
|
||||
});
|
||||
|
||||
});
|
||||
}
|
||||
ini_events($('#external-events div.external-event'));
|
||||
|
||||
/* initialize the calendar
|
||||
-----------------------------------------------------------------*/
|
||||
//Date for the calendar events (dummy data)
|
||||
var date = new Date();
|
||||
var d = date.getDate(),
|
||||
m = date.getMonth(),
|
||||
y = date.getFullYear();
|
||||
$('#calendar').fullCalendar({
|
||||
header: {
|
||||
left: 'prev,next today',
|
||||
center: 'title',
|
||||
right: 'month,agendaWeek,agendaDay'
|
||||
},
|
||||
buttonText: {
|
||||
today: 'today',
|
||||
month: 'month',
|
||||
week: 'week',
|
||||
day: 'day'
|
||||
},
|
||||
//Random default events
|
||||
events: [
|
||||
{
|
||||
title: 'All Day Event',
|
||||
start: new Date(y, m, 1),
|
||||
backgroundColor: "#f56954", //red
|
||||
borderColor: "#f56954" //red
|
||||
},
|
||||
{
|
||||
title: 'Long Event',
|
||||
start: new Date(y, m, d - 5),
|
||||
end: new Date(y, m, d - 2),
|
||||
backgroundColor: "#f39c12", //yellow
|
||||
borderColor: "#f39c12" //yellow
|
||||
},
|
||||
{
|
||||
title: 'Meeting',
|
||||
start: new Date(y, m, d, 10, 30),
|
||||
allDay: false,
|
||||
backgroundColor: "#0073b7", //Blue
|
||||
borderColor: "#0073b7" //Blue
|
||||
},
|
||||
{
|
||||
title: 'Lunch',
|
||||
start: new Date(y, m, d, 12, 0),
|
||||
end: new Date(y, m, d, 14, 0),
|
||||
allDay: false,
|
||||
backgroundColor: "#00c0ef", //Info (aqua)
|
||||
borderColor: "#00c0ef" //Info (aqua)
|
||||
},
|
||||
{
|
||||
title: 'Birthday Party',
|
||||
start: new Date(y, m, d + 1, 19, 0),
|
||||
end: new Date(y, m, d + 1, 22, 30),
|
||||
allDay: false,
|
||||
backgroundColor: "#00a65a", //Success (green)
|
||||
borderColor: "#00a65a" //Success (green)
|
||||
},
|
||||
{
|
||||
title: 'Click for Google',
|
||||
start: new Date(y, m, 28),
|
||||
end: new Date(y, m, 29),
|
||||
url: 'http://google.com/',
|
||||
backgroundColor: "#3c8dbc", //Primary (light-blue)
|
||||
borderColor: "#3c8dbc" //Primary (light-blue)
|
||||
}
|
||||
],
|
||||
editable: true,
|
||||
droppable: true, // this allows things to be dropped onto the calendar !!!
|
||||
drop: function (date, allDay) { // this function is called when something is dropped
|
||||
|
||||
// retrieve the dropped element's stored Event Object
|
||||
var originalEventObject = $(this).data('eventObject');
|
||||
|
||||
// we need to copy it, so that multiple events don't have a reference to the same object
|
||||
var copiedEventObject = $.extend({}, originalEventObject);
|
||||
|
||||
// assign it the date that was reported
|
||||
copiedEventObject.start = date;
|
||||
copiedEventObject.allDay = allDay;
|
||||
copiedEventObject.backgroundColor = $(this).css("background-color");
|
||||
copiedEventObject.borderColor = $(this).css("border-color");
|
||||
|
||||
// render the event on the calendar
|
||||
// the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
|
||||
$('#calendar').fullCalendar('renderEvent', copiedEventObject, true);
|
||||
|
||||
// is the "remove after drop" checkbox checked?
|
||||
if ($('#drop-remove').is(':checked')) {
|
||||
// if so, remove the element from the "Draggable Events" list
|
||||
$(this).remove();
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
/* ADDING EVENTS */
|
||||
var currColor = "#3c8dbc"; //Red by default
|
||||
//Color chooser button
|
||||
var colorChooser = $("#color-chooser-btn");
|
||||
$("#color-chooser > li > a").click(function (e) {
|
||||
e.preventDefault();
|
||||
//Save color
|
||||
currColor = $(this).css("color");
|
||||
//Add color effect to button
|
||||
$('#add-new-event').css({"background-color": currColor, "border-color": currColor});
|
||||
});
|
||||
$("#add-new-event").click(function (e) {
|
||||
e.preventDefault();
|
||||
//Get value and make sure it is not null
|
||||
var val = $("#new-event").val();
|
||||
if (val.length == 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
//Create events
|
||||
var event = $("<div />");
|
||||
event.css({"background-color": currColor, "border-color": currColor, "color": "#fff"}).addClass("external-event");
|
||||
event.html(val);
|
||||
$('#external-events').prepend(event);
|
||||
|
||||
//Add draggable funtionality
|
||||
ini_events(event);
|
||||
|
||||
//Remove event from text input
|
||||
$("#new-event").val("");
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,821 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | ChartJS</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li class="active"><a href="chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
ChartJS
|
||||
<small>Preview sample</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Charts</a></li>
|
||||
<li class="active">ChartJS</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<!-- AREA CHART -->
|
||||
<div class="box box-primary">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Area Chart</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>
|
||||
<div class="box-body">
|
||||
<div class="chart">
|
||||
<canvas id="areaChart" height="250"></canvas>
|
||||
</div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
<!-- DONUT CHART -->
|
||||
<div class="box box-danger">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Donut Chart</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>
|
||||
<div class="box-body">
|
||||
<canvas id="pieChart" height="250"></canvas>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
</div><!-- /.col (LEFT) -->
|
||||
<div class="col-md-6">
|
||||
<!-- LINE CHART -->
|
||||
<div class="box box-info">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Line Chart</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>
|
||||
<div class="box-body">
|
||||
<div class="chart">
|
||||
<canvas id="lineChart" height="250"></canvas>
|
||||
</div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
<!-- BAR CHART -->
|
||||
<div class="box box-success">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Bar Chart</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>
|
||||
<div class="box-body">
|
||||
<div class="chart">
|
||||
<canvas id="barChart" height="230"></canvas>
|
||||
</div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
</div><!-- /.col (RIGHT) -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- ChartJS 1.0.1 -->
|
||||
<script src="../../plugins/chartjs/Chart.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
<!-- page script -->
|
||||
<script>
|
||||
$(function () {
|
||||
/* ChartJS
|
||||
* -------
|
||||
* Here we will create a few charts using ChartJS
|
||||
*/
|
||||
|
||||
//--------------
|
||||
//- AREA CHART -
|
||||
//--------------
|
||||
|
||||
// Get context with jQuery - using jQuery's .get() method.
|
||||
var areaChartCanvas = $("#areaChart").get(0).getContext("2d");
|
||||
// This will get the first returned node in the jQuery collection.
|
||||
var areaChart = new Chart(areaChartCanvas);
|
||||
|
||||
var areaChartData = {
|
||||
labels: ["January", "February", "March", "April", "May", "June", "July"],
|
||||
datasets: [
|
||||
{
|
||||
label: "Electronics",
|
||||
fillColor: "rgba(210, 214, 222, 1)",
|
||||
strokeColor: "rgba(210, 214, 222, 1)",
|
||||
pointColor: "rgba(210, 214, 222, 1)",
|
||||
pointStrokeColor: "#c1c7d1",
|
||||
pointHighlightFill: "#fff",
|
||||
pointHighlightStroke: "rgba(220,220,220,1)",
|
||||
data: [65, 59, 80, 81, 56, 55, 40]
|
||||
},
|
||||
{
|
||||
label: "Digital Goods",
|
||||
fillColor: "rgba(60,141,188,0.9)",
|
||||
strokeColor: "rgba(60,141,188,0.8)",
|
||||
pointColor: "#3b8bba",
|
||||
pointStrokeColor: "rgba(60,141,188,1)",
|
||||
pointHighlightFill: "#fff",
|
||||
pointHighlightStroke: "rgba(60,141,188,1)",
|
||||
data: [28, 48, 40, 19, 86, 27, 90]
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
var areaChartOptions = {
|
||||
//Boolean - If we should show the scale at all
|
||||
showScale: true,
|
||||
//Boolean - Whether grid lines are shown across the chart
|
||||
scaleShowGridLines: false,
|
||||
//String - Colour of the grid lines
|
||||
scaleGridLineColor: "rgba(0,0,0,.05)",
|
||||
//Number - Width of the grid lines
|
||||
scaleGridLineWidth: 1,
|
||||
//Boolean - Whether to show horizontal lines (except X axis)
|
||||
scaleShowHorizontalLines: true,
|
||||
//Boolean - Whether to show vertical lines (except Y axis)
|
||||
scaleShowVerticalLines: true,
|
||||
//Boolean - Whether the line is curved between points
|
||||
bezierCurve: true,
|
||||
//Number - Tension of the bezier curve between points
|
||||
bezierCurveTension: 0.3,
|
||||
//Boolean - Whether to show a dot for each point
|
||||
pointDot: false,
|
||||
//Number - Radius of each point dot in pixels
|
||||
pointDotRadius: 4,
|
||||
//Number - Pixel width of point dot stroke
|
||||
pointDotStrokeWidth: 1,
|
||||
//Number - amount extra to add to the radius to cater for hit detection outside the drawn point
|
||||
pointHitDetectionRadius: 20,
|
||||
//Boolean - Whether to show a stroke for datasets
|
||||
datasetStroke: true,
|
||||
//Number - Pixel width of dataset stroke
|
||||
datasetStrokeWidth: 2,
|
||||
//Boolean - Whether to fill the dataset with a color
|
||||
datasetFill: true,
|
||||
//String - A legend template
|
||||
legendTemplate: "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].lineColor%>\"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>",
|
||||
//Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
|
||||
maintainAspectRatio: false,
|
||||
//Boolean - whether to make the chart responsive to window resizing
|
||||
responsive: true
|
||||
};
|
||||
|
||||
//Create the line chart
|
||||
areaChart.Line(areaChartData, areaChartOptions);
|
||||
|
||||
//-------------
|
||||
//- LINE CHART -
|
||||
//--------------
|
||||
var lineChartCanvas = $("#lineChart").get(0).getContext("2d");
|
||||
var lineChart = new Chart(lineChartCanvas);
|
||||
var lineChartOptions = areaChartOptions;
|
||||
lineChartOptions.datasetFill = false;
|
||||
lineChart.Line(areaChartData, lineChartOptions);
|
||||
|
||||
//-------------
|
||||
//- PIE CHART -
|
||||
//-------------
|
||||
// Get context with jQuery - using jQuery's .get() method.
|
||||
var pieChartCanvas = $("#pieChart").get(0).getContext("2d");
|
||||
var pieChart = new Chart(pieChartCanvas);
|
||||
var PieData = [
|
||||
{
|
||||
value: 700,
|
||||
color: "#f56954",
|
||||
highlight: "#f56954",
|
||||
label: "Chrome"
|
||||
},
|
||||
{
|
||||
value: 500,
|
||||
color: "#00a65a",
|
||||
highlight: "#00a65a",
|
||||
label: "IE"
|
||||
},
|
||||
{
|
||||
value: 400,
|
||||
color: "#f39c12",
|
||||
highlight: "#f39c12",
|
||||
label: "FireFox"
|
||||
},
|
||||
{
|
||||
value: 600,
|
||||
color: "#00c0ef",
|
||||
highlight: "#00c0ef",
|
||||
label: "Safari"
|
||||
},
|
||||
{
|
||||
value: 300,
|
||||
color: "#3c8dbc",
|
||||
highlight: "#3c8dbc",
|
||||
label: "Opera"
|
||||
},
|
||||
{
|
||||
value: 100,
|
||||
color: "#d2d6de",
|
||||
highlight: "#d2d6de",
|
||||
label: "Navigator"
|
||||
}
|
||||
];
|
||||
var pieOptions = {
|
||||
//Boolean - Whether we should show a stroke on each segment
|
||||
segmentShowStroke: true,
|
||||
//String - The colour of each segment stroke
|
||||
segmentStrokeColor: "#fff",
|
||||
//Number - The width of each segment stroke
|
||||
segmentStrokeWidth: 2,
|
||||
//Number - The percentage of the chart that we cut out of the middle
|
||||
percentageInnerCutout: 50, // This is 0 for Pie charts
|
||||
//Number - Amount of animation steps
|
||||
animationSteps: 100,
|
||||
//String - Animation easing effect
|
||||
animationEasing: "easeOutBounce",
|
||||
//Boolean - Whether we animate the rotation of the Doughnut
|
||||
animateRotate: true,
|
||||
//Boolean - Whether we animate scaling the Doughnut from the centre
|
||||
animateScale: false,
|
||||
//Boolean - whether to make the chart responsive to window resizing
|
||||
responsive: true,
|
||||
// Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
|
||||
maintainAspectRatio: false,
|
||||
//String - A legend template
|
||||
legendTemplate: "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<segments.length; i++){%><li><span style=\"background-color:<%=segments[i].fillColor%>\"></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>"
|
||||
};
|
||||
//Create pie or douhnut chart
|
||||
// You can switch between pie and douhnut using the method below.
|
||||
pieChart.Doughnut(PieData, pieOptions);
|
||||
|
||||
//-------------
|
||||
//- BAR CHART -
|
||||
//-------------
|
||||
var barChartCanvas = $("#barChart").get(0).getContext("2d");
|
||||
var barChart = new Chart(barChartCanvas);
|
||||
var barChartData = areaChartData;
|
||||
barChartData.datasets[1].fillColor = "#00a65a";
|
||||
barChartData.datasets[1].strokeColor = "#00a65a";
|
||||
barChartData.datasets[1].pointColor = "#00a65a";
|
||||
var barChartOptions = {
|
||||
//Boolean - Whether the scale should start at zero, or an order of magnitude down from the lowest value
|
||||
scaleBeginAtZero: true,
|
||||
//Boolean - Whether grid lines are shown across the chart
|
||||
scaleShowGridLines: true,
|
||||
//String - Colour of the grid lines
|
||||
scaleGridLineColor: "rgba(0,0,0,.05)",
|
||||
//Number - Width of the grid lines
|
||||
scaleGridLineWidth: 1,
|
||||
//Boolean - Whether to show horizontal lines (except X axis)
|
||||
scaleShowHorizontalLines: true,
|
||||
//Boolean - Whether to show vertical lines (except Y axis)
|
||||
scaleShowVerticalLines: true,
|
||||
//Boolean - If there is a stroke on each bar
|
||||
barShowStroke: true,
|
||||
//Number - Pixel width of the bar stroke
|
||||
barStrokeWidth: 2,
|
||||
//Number - Spacing between each of the X value sets
|
||||
barValueSpacing: 5,
|
||||
//Number - Spacing between data sets within X values
|
||||
barDatasetSpacing: 1,
|
||||
//String - A legend template
|
||||
legendTemplate: "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].fillColor%>\"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>",
|
||||
//Boolean - whether to make the chart responsive
|
||||
responsive: true,
|
||||
maintainAspectRatio: false
|
||||
};
|
||||
|
||||
barChartOptions.datasetFill = false;
|
||||
barChart.Bar(barChartData, barChartOptions);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,808 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Morris.js Charts</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Morris charts -->
|
||||
<link href="../../plugins/morris/morris.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
AdminLTE Design Team
|
||||
<small><i class="fa fa-clock-o"></i> 2 hours</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Developers
|
||||
<small><i class="fa fa-clock-o"></i> Today</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Sales Department
|
||||
<small><i class="fa fa-clock-o"></i> Yesterday</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Reviewers
|
||||
<small><i class="fa fa-clock-o"></i> 2 days</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the page and may cause design problems
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-red"></i> 5 new members joined
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user text-red"></i> You changed your username
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Create a nice theme
|
||||
<small class="pull-right">40%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">40% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Some task I need to do
|
||||
<small class="pull-right">60%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">60% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Make beautiful transitions
|
||||
<small class="pull-right">80%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">80% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li class="active"><a href="morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Morris Charts
|
||||
<small>Preview sample</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Charts</a></li>
|
||||
<li class="active">Morris</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="callout callout-warning">
|
||||
<h4>Warning!</h4>
|
||||
<p><b>Morris.js</b> charts are no longer maintained by its author. We would recommend using any of the other charts that come with the template.</p>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<!-- AREA CHART -->
|
||||
<div class="box box-primary">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Area Chart</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>
|
||||
<div class="box-body chart-responsive">
|
||||
<div class="chart" id="revenue-chart" style="height: 300px;"></div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
<!-- DONUT CHART -->
|
||||
<div class="box box-danger">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Donut Chart</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>
|
||||
<div class="box-body chart-responsive">
|
||||
<div class="chart" id="sales-chart" style="height: 300px; position: relative;"></div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
</div><!-- /.col (LEFT) -->
|
||||
<div class="col-md-6">
|
||||
<!-- LINE CHART -->
|
||||
<div class="box box-info">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Line Chart</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>
|
||||
<div class="box-body chart-responsive">
|
||||
<div class="chart" id="line-chart" style="height: 300px;"></div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
<!-- BAR CHART -->
|
||||
<div class="box box-success">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Bar Chart</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>
|
||||
<div class="box-body chart-responsive">
|
||||
<div class="chart" id="bar-chart" style="height: 300px;"></div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
</div><!-- /.col (RIGHT) -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- Morris.js charts -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
|
||||
<script src="../../plugins/morris/morris.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
<!-- page script -->
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
"use strict";
|
||||
|
||||
// AREA CHART
|
||||
var area = new Morris.Area({
|
||||
element: 'revenue-chart',
|
||||
resize: true,
|
||||
data: [
|
||||
{y: '2011 Q1', item1: 2666, item2: 2666},
|
||||
{y: '2011 Q2', item1: 2778, item2: 2294},
|
||||
{y: '2011 Q3', item1: 4912, item2: 1969},
|
||||
{y: '2011 Q4', item1: 3767, item2: 3597},
|
||||
{y: '2012 Q1', item1: 6810, item2: 1914},
|
||||
{y: '2012 Q2', item1: 5670, item2: 4293},
|
||||
{y: '2012 Q3', item1: 4820, item2: 3795},
|
||||
{y: '2012 Q4', item1: 15073, item2: 5967},
|
||||
{y: '2013 Q1', item1: 10687, item2: 4460},
|
||||
{y: '2013 Q2', item1: 8432, item2: 5713}
|
||||
],
|
||||
xkey: 'y',
|
||||
ykeys: ['item1', 'item2'],
|
||||
labels: ['Item 1', 'Item 2'],
|
||||
lineColors: ['#a0d0e0', '#3c8dbc'],
|
||||
hideHover: 'auto'
|
||||
});
|
||||
|
||||
// LINE CHART
|
||||
var line = new Morris.Line({
|
||||
element: 'line-chart',
|
||||
resize: true,
|
||||
data: [
|
||||
{y: '2011 Q1', item1: 2666},
|
||||
{y: '2011 Q2', item1: 2778},
|
||||
{y: '2011 Q3', item1: 4912},
|
||||
{y: '2011 Q4', item1: 3767},
|
||||
{y: '2012 Q1', item1: 6810},
|
||||
{y: '2012 Q2', item1: 5670},
|
||||
{y: '2012 Q3', item1: 4820},
|
||||
{y: '2012 Q4', item1: 15073},
|
||||
{y: '2013 Q1', item1: 10687},
|
||||
{y: '2013 Q2', item1: 8432}
|
||||
],
|
||||
xkey: 'y',
|
||||
ykeys: ['item1'],
|
||||
labels: ['Item 1'],
|
||||
lineColors: ['#3c8dbc'],
|
||||
hideHover: 'auto'
|
||||
});
|
||||
|
||||
//DONUT CHART
|
||||
var donut = new Morris.Donut({
|
||||
element: 'sales-chart',
|
||||
resize: true,
|
||||
colors: ["#3c8dbc", "#f56954", "#00a65a"],
|
||||
data: [
|
||||
{label: "Download Sales", value: 12},
|
||||
{label: "In-Store Sales", value: 30},
|
||||
{label: "Mail-Order Sales", value: 20}
|
||||
],
|
||||
hideHover: 'auto'
|
||||
});
|
||||
//BAR CHART
|
||||
var bar = new Morris.Bar({
|
||||
element: 'bar-chart',
|
||||
resize: true,
|
||||
data: [
|
||||
{y: '2006', a: 100, b: 90},
|
||||
{y: '2007', a: 75, b: 65},
|
||||
{y: '2008', a: 50, b: 40},
|
||||
{y: '2009', a: 75, b: 65},
|
||||
{y: '2010', a: 50, b: 40},
|
||||
{y: '2011', a: 75, b: 65},
|
||||
{y: '2012', a: 100, b: 90}
|
||||
],
|
||||
barColors: ['#00a65a', '#f56954'],
|
||||
xkey: 'y',
|
||||
ykeys: ['a', 'b'],
|
||||
labels: ['CPU', 'DISK'],
|
||||
hideHover: 'auto'
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,669 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | 404 Page not found</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
AdminLTE Design Team
|
||||
<small><i class="fa fa-clock-o"></i> 2 hours</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Developers
|
||||
<small><i class="fa fa-clock-o"></i> Today</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Sales Department
|
||||
<small><i class="fa fa-clock-o"></i> Yesterday</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Reviewers
|
||||
<small><i class="fa fa-clock-o"></i> 2 days</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the page and may cause design problems
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-red"></i> 5 new members joined
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user text-red"></i> You changed your username
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Create a nice theme
|
||||
<small class="pull-right">40%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">40% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Some task I need to do
|
||||
<small class="pull-right">60%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">60% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Make beautiful transitions
|
||||
<small class="pull-right">80%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">80% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li class="active"><a href="404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
404 Error Page
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Examples</a></li>
|
||||
<li class="active">404 error</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
|
||||
<div class="error-page">
|
||||
<h2 class="headline text-yellow"> 404</h2>
|
||||
<div class="error-content">
|
||||
<h3><i class="fa fa-warning text-yellow"></i> Oops! Page not found.</h3>
|
||||
<p>
|
||||
We could not find the page you were looking for.
|
||||
Meanwhile, you may <a href='../../index.html'>return to dashboard</a> or try using the search form.
|
||||
</p>
|
||||
<form class='search-form'>
|
||||
<div class='input-group'>
|
||||
<input type="text" name="search" class='form-control' placeholder="Search"/>
|
||||
<div class="input-group-btn">
|
||||
<button type="submit" name="submit" class="btn btn-warning btn-flat"><i class="fa fa-search"></i></button>
|
||||
</div>
|
||||
</div><!-- /.input-group -->
|
||||
</form>
|
||||
</div><!-- /.error-content -->
|
||||
</div><!-- /.error-page -->
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,670 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | 500 Error</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
AdminLTE Design Team
|
||||
<small><i class="fa fa-clock-o"></i> 2 hours</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Developers
|
||||
<small><i class="fa fa-clock-o"></i> Today</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Sales Department
|
||||
<small><i class="fa fa-clock-o"></i> Yesterday</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Reviewers
|
||||
<small><i class="fa fa-clock-o"></i> 2 days</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the page and may cause design problems
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-red"></i> 5 new members joined
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user text-red"></i> You changed your username
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Create a nice theme
|
||||
<small class="pull-right">40%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">40% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Some task I need to do
|
||||
<small class="pull-right">60%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">60% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Make beautiful transitions
|
||||
<small class="pull-right">80%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">80% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li class="active"><a href="500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
500 Error Page
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Examples</a></li>
|
||||
<li class="active">500 error</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
|
||||
<div class="error-page">
|
||||
<h2 class="headline text-red">500</h2>
|
||||
<div class="error-content">
|
||||
<h3><i class="fa fa-warning text-red"></i> Oops! Something went wrong.</h3>
|
||||
<p>
|
||||
We will work on fixing that right away.
|
||||
Meanwhile, you may <a href='../../index.html'>return to dashboard</a> or try using the search form.
|
||||
</p>
|
||||
<form class='search-form'>
|
||||
<div class='input-group'>
|
||||
<input type="text" name="search" class='form-control' placeholder="Search"/>
|
||||
<div class="input-group-btn">
|
||||
<button type="submit" name="submit" class="btn btn-danger btn-flat"><i class="fa fa-search"></i></button>
|
||||
</div>
|
||||
</div><!-- /.input-group -->
|
||||
</form>
|
||||
</div>
|
||||
</div><!-- /.error-page -->
|
||||
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,571 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Dashboard</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<!-- Site wrapper -->
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<!-- =============================================== -->
|
||||
|
||||
<!-- Left side column. contains the sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">Hot</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li class="active"><a href="blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- =============================================== -->
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Blank page
|
||||
<small>it all starts here</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Examples</a></li>
|
||||
<li class="active">Blank page</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
|
||||
<!-- Default box -->
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Title</h3>
|
||||
<div class="box-tools pull-right">
|
||||
<button class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
|
||||
<button class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
Start creating your amazing application!
|
||||
</div><!-- /.box-body -->
|
||||
<div class="box-footer">
|
||||
Footer
|
||||
</div><!-- /.box-footer-->
|
||||
</div><!-- /.box -->
|
||||
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- SlimScroll -->
|
||||
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
|
||||
<!-- Demo -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,155 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Invoice</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body onload="window.print();">
|
||||
<div class="wrapper">
|
||||
<!-- Main content -->
|
||||
<section class="invoice">
|
||||
<!-- title row -->
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<h2 class="page-header">
|
||||
<i class="fa fa-globe"></i> AdminLTE, Inc.
|
||||
<small class="pull-right">Date: 2/10/2014</small>
|
||||
</h2>
|
||||
</div><!-- /.col -->
|
||||
</div>
|
||||
<!-- info row -->
|
||||
<div class="row invoice-info">
|
||||
<div class="col-sm-4 invoice-col">
|
||||
From
|
||||
<address>
|
||||
<strong>Admin, Inc.</strong><br>
|
||||
795 Folsom Ave, Suite 600<br>
|
||||
San Francisco, CA 94107<br>
|
||||
Phone: (804) 123-5432<br/>
|
||||
Email: info@almasaeedstudio.com
|
||||
</address>
|
||||
</div><!-- /.col -->
|
||||
<div class="col-sm-4 invoice-col">
|
||||
To
|
||||
<address>
|
||||
<strong>John Doe</strong><br>
|
||||
795 Folsom Ave, Suite 600<br>
|
||||
San Francisco, CA 94107<br>
|
||||
Phone: (555) 539-1037<br/>
|
||||
Email: john.doe@example.com
|
||||
</address>
|
||||
</div><!-- /.col -->
|
||||
<div class="col-sm-4 invoice-col">
|
||||
<b>Invoice #007612</b><br/>
|
||||
<br/>
|
||||
<b>Order ID:</b> 4F3S8J<br/>
|
||||
<b>Payment Due:</b> 2/22/2014<br/>
|
||||
<b>Account:</b> 968-34567
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
<!-- Table row -->
|
||||
<div class="row">
|
||||
<div class="col-xs-12 table-responsive">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Qty</th>
|
||||
<th>Product</th>
|
||||
<th>Serial #</th>
|
||||
<th>Description</th>
|
||||
<th>Subtotal</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Call of Duty</td>
|
||||
<td>455-981-221</td>
|
||||
<td>El snort testosterone trophy driving gloves handsome</td>
|
||||
<td>$64.50</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Need for Speed IV</td>
|
||||
<td>247-925-726</td>
|
||||
<td>Wes Anderson umami biodiesel</td>
|
||||
<td>$50.00</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Monsters DVD</td>
|
||||
<td>735-845-642</td>
|
||||
<td>Terry Richardson helvetica tousled street art master</td>
|
||||
<td>$10.70</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Grown Ups Blue Ray</td>
|
||||
<td>422-568-642</td>
|
||||
<td>Tousled lomo letterpress</td>
|
||||
<td>$25.99</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
<div class="row">
|
||||
<!-- accepted payments column -->
|
||||
<div class="col-xs-6">
|
||||
<p class="lead">Payment Methods:</p>
|
||||
<img src="../../dist/img/credit/visa.png" alt="Visa"/>
|
||||
<img src="../../dist/img/credit/mastercard.png" alt="Mastercard"/>
|
||||
<img src="../../dist/img/credit/american-express.png" alt="American Express"/>
|
||||
<img src="../../dist/img/credit/paypal2.png" alt="Paypal"/>
|
||||
<p class="text-muted well well-sm no-shadow" style="margin-top: 10px;">
|
||||
Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles, weebly ning heekya handango imeem plugg dopplr jibjab, movity jajah plickers sifteo edmodo ifttt zimbra.
|
||||
</p>
|
||||
</div><!-- /.col -->
|
||||
<div class="col-xs-6">
|
||||
<p class="lead">Amount Due 2/22/2014</p>
|
||||
<div class="table-responsive">
|
||||
<table class="table">
|
||||
<tr>
|
||||
<th style="width:50%">Subtotal:</th>
|
||||
<td>$250.30</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Tax (9.3%)</th>
|
||||
<td>$10.34</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Shipping:</th>
|
||||
<td>$5.80</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Total:</th>
|
||||
<td>$265.24</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
</section><!-- /.content -->
|
||||
</div><!-- ./wrapper -->
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,790 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Invoice</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
AdminLTE Design Team
|
||||
<small><i class="fa fa-clock-o"></i> 2 hours</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Developers
|
||||
<small><i class="fa fa-clock-o"></i> Today</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Sales Department
|
||||
<small><i class="fa fa-clock-o"></i> Yesterday</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Reviewers
|
||||
<small><i class="fa fa-clock-o"></i> 2 days</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the page and may cause design problems
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-red"></i> 5 new members joined
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user text-red"></i> You changed your username
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Create a nice theme
|
||||
<small class="pull-right">40%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">40% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Some task I need to do
|
||||
<small class="pull-right">60%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">60% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Make beautiful transitions
|
||||
<small class="pull-right">80%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">80% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li class="active"><a href="invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Invoice
|
||||
<small>#007612</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Examples</a></li>
|
||||
<li class="active">Invoice</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<div class="pad margin no-print">
|
||||
<div class="callout callout-info" style="margin-bottom: 0!important;">
|
||||
<h4><i class="fa fa-info"></i> Note:</h4>
|
||||
This page has been enhanced for printing. Click the print button at the bottom of the invoice to test.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="invoice">
|
||||
<!-- title row -->
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<h2 class="page-header">
|
||||
<i class="fa fa-globe"></i> AdminLTE, Inc.
|
||||
<small class="pull-right">Date: 2/10/2014</small>
|
||||
</h2>
|
||||
</div><!-- /.col -->
|
||||
</div>
|
||||
<!-- info row -->
|
||||
<div class="row invoice-info">
|
||||
<div class="col-sm-4 invoice-col">
|
||||
From
|
||||
<address>
|
||||
<strong>Admin, Inc.</strong><br>
|
||||
795 Folsom Ave, Suite 600<br>
|
||||
San Francisco, CA 94107<br>
|
||||
Phone: (804) 123-5432<br/>
|
||||
Email: info@almasaeedstudio.com
|
||||
</address>
|
||||
</div><!-- /.col -->
|
||||
<div class="col-sm-4 invoice-col">
|
||||
To
|
||||
<address>
|
||||
<strong>John Doe</strong><br>
|
||||
795 Folsom Ave, Suite 600<br>
|
||||
San Francisco, CA 94107<br>
|
||||
Phone: (555) 539-1037<br/>
|
||||
Email: john.doe@example.com
|
||||
</address>
|
||||
</div><!-- /.col -->
|
||||
<div class="col-sm-4 invoice-col">
|
||||
<b>Invoice #007612</b><br/>
|
||||
<br/>
|
||||
<b>Order ID:</b> 4F3S8J<br/>
|
||||
<b>Payment Due:</b> 2/22/2014<br/>
|
||||
<b>Account:</b> 968-34567
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
<!-- Table row -->
|
||||
<div class="row">
|
||||
<div class="col-xs-12 table-responsive">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Qty</th>
|
||||
<th>Product</th>
|
||||
<th>Serial #</th>
|
||||
<th>Description</th>
|
||||
<th>Subtotal</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Call of Duty</td>
|
||||
<td>455-981-221</td>
|
||||
<td>El snort testosterone trophy driving gloves handsome</td>
|
||||
<td>$64.50</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Need for Speed IV</td>
|
||||
<td>247-925-726</td>
|
||||
<td>Wes Anderson umami biodiesel</td>
|
||||
<td>$50.00</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Monsters DVD</td>
|
||||
<td>735-845-642</td>
|
||||
<td>Terry Richardson helvetica tousled street art master</td>
|
||||
<td>$10.70</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Grown Ups Blue Ray</td>
|
||||
<td>422-568-642</td>
|
||||
<td>Tousled lomo letterpress</td>
|
||||
<td>$25.99</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
<div class="row">
|
||||
<!-- accepted payments column -->
|
||||
<div class="col-xs-6">
|
||||
<p class="lead">Payment Methods:</p>
|
||||
<img src="../../dist/img/credit/visa.png" alt="Visa"/>
|
||||
<img src="../../dist/img/credit/mastercard.png" alt="Mastercard"/>
|
||||
<img src="../../dist/img/credit/american-express.png" alt="American Express"/>
|
||||
<img src="../../dist/img/credit/paypal2.png" alt="Paypal"/>
|
||||
<p class="text-muted well well-sm no-shadow" style="margin-top: 10px;">
|
||||
Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles, weebly ning heekya handango imeem plugg dopplr jibjab, movity jajah plickers sifteo edmodo ifttt zimbra.
|
||||
</p>
|
||||
</div><!-- /.col -->
|
||||
<div class="col-xs-6">
|
||||
<p class="lead">Amount Due 2/22/2014</p>
|
||||
<div class="table-responsive">
|
||||
<table class="table">
|
||||
<tr>
|
||||
<th style="width:50%">Subtotal:</th>
|
||||
<td>$250.30</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Tax (9.3%)</th>
|
||||
<td>$10.34</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Shipping:</th>
|
||||
<td>$5.80</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Total:</th>
|
||||
<td>$265.24</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
<!-- this row will not appear when printing -->
|
||||
<div class="row no-print">
|
||||
<div class="col-xs-12">
|
||||
<a href="invoice-print.html" target="_blank" class="btn btn-default"><i class="fa fa-print"></i> Print</a>
|
||||
<button class="btn btn-success pull-right"><i class="fa fa-credit-card"></i> Submit Payment</button>
|
||||
<button class="btn btn-primary pull-right" style="margin-right: 5px;"><i class="fa fa-download"></i> Generate PDF</button>
|
||||
</div>
|
||||
</div>
|
||||
</section><!-- /.content -->
|
||||
<div class="clearfix"></div>
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer no-print">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,66 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Lockscreen</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="lockscreen">
|
||||
<!-- Automatic element centering -->
|
||||
<div class="lockscreen-wrapper">
|
||||
<div class="lockscreen-logo">
|
||||
<a href="../../index2.html"><b>Admin</b>LTE</a>
|
||||
</div>
|
||||
<!-- User name -->
|
||||
<div class="lockscreen-name">John Doe</div>
|
||||
|
||||
<!-- START LOCK SCREEN ITEM -->
|
||||
<div class="lockscreen-item">
|
||||
<!-- lockscreen image -->
|
||||
<div class="lockscreen-image">
|
||||
<img src="../../dist/img/user1-128x128.jpg" alt="user image"/>
|
||||
</div>
|
||||
<!-- /.lockscreen-image -->
|
||||
|
||||
<!-- lockscreen credentials (contains the form) -->
|
||||
<form class="lockscreen-credentials">
|
||||
<div class="input-group">
|
||||
<input type="password" class="form-control" placeholder="password" />
|
||||
<div class="input-group-btn">
|
||||
<button class="btn"><i class="fa fa-arrow-right text-muted"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</form><!-- /.lockscreen credentials -->
|
||||
|
||||
</div><!-- /.lockscreen-item -->
|
||||
<div class="help-block text-center">
|
||||
Enter your password to retrieve your session
|
||||
</div>
|
||||
<div class='text-center'>
|
||||
<a href="login.html">Or sign in as a different user</a>
|
||||
</div>
|
||||
<div class='lockscreen-footer text-center'>
|
||||
Copyright © 2014-2015 <b><a href="http://almsaeedstudio.com" class='text-black'>Almsaeed Studio</a></b><br>
|
||||
All rights reserved
|
||||
</div>
|
||||
</div><!-- /.center -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,81 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Log in</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- iCheck -->
|
||||
<link href="../../plugins/iCheck/square/blue.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="login-page">
|
||||
<div class="login-box">
|
||||
<div class="login-logo">
|
||||
<a href="../../index2.html"><b>Admin</b>LTE</a>
|
||||
</div><!-- /.login-logo -->
|
||||
<div class="login-box-body">
|
||||
<p class="login-box-msg">Sign in to start your session</p>
|
||||
<form action="../../index2.html" method="post">
|
||||
<div class="form-group has-feedback">
|
||||
<input type="email" class="form-control" placeholder="Email"/>
|
||||
<span class="glyphicon glyphicon-envelope form-control-feedback"></span>
|
||||
</div>
|
||||
<div class="form-group has-feedback">
|
||||
<input type="password" class="form-control" placeholder="Password"/>
|
||||
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-8">
|
||||
<div class="checkbox icheck">
|
||||
<label>
|
||||
<input type="checkbox"> Remember Me
|
||||
</label>
|
||||
</div>
|
||||
</div><!-- /.col -->
|
||||
<div class="col-xs-4">
|
||||
<button type="submit" class="btn btn-primary btn-block btn-flat">Sign In</button>
|
||||
</div><!-- /.col -->
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="social-auth-links text-center">
|
||||
<p>- OR -</p>
|
||||
<a href="#" class="btn btn-block btn-social btn-facebook btn-flat"><i class="fa fa-facebook"></i> Sign in using Facebook</a>
|
||||
<a href="#" class="btn btn-block btn-social btn-google-plus btn-flat"><i class="fa fa-google-plus"></i> Sign in using Google+</a>
|
||||
</div><!-- /.social-auth-links -->
|
||||
|
||||
<a href="#">I forgot my password</a><br>
|
||||
<a href="register.html" class="text-center">Register a new membership</a>
|
||||
|
||||
</div><!-- /.login-box-body -->
|
||||
</div><!-- /.login-box -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- iCheck -->
|
||||
<script src="../../plugins/iCheck/icheck.min.js" type="text/javascript"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
$('input').iCheck({
|
||||
checkboxClass: 'icheckbox_square-blue',
|
||||
radioClass: 'iradio_square-blue',
|
||||
increaseArea: '20%' // optional
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,88 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Registration Page</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- iCheck -->
|
||||
<link href="../../plugins/iCheck/square/blue.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="register-page">
|
||||
<div class="register-box">
|
||||
<div class="register-logo">
|
||||
<a href="../../index2.html"><b>Admin</b>LTE</a>
|
||||
</div>
|
||||
|
||||
<div class="register-box-body">
|
||||
<p class="login-box-msg">Register a new membership</p>
|
||||
<form action="../../index.html" method="post">
|
||||
<div class="form-group has-feedback">
|
||||
<input type="text" class="form-control" placeholder="Full name"/>
|
||||
<span class="glyphicon glyphicon-user form-control-feedback"></span>
|
||||
</div>
|
||||
<div class="form-group has-feedback">
|
||||
<input type="email" class="form-control" placeholder="Email"/>
|
||||
<span class="glyphicon glyphicon-envelope form-control-feedback"></span>
|
||||
</div>
|
||||
<div class="form-group has-feedback">
|
||||
<input type="password" class="form-control" placeholder="Password"/>
|
||||
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
|
||||
</div>
|
||||
<div class="form-group has-feedback">
|
||||
<input type="password" class="form-control" placeholder="Retype password"/>
|
||||
<span class="glyphicon glyphicon-log-in form-control-feedback"></span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-8">
|
||||
<div class="checkbox icheck">
|
||||
<label>
|
||||
<input type="checkbox"> I agree to the <a href="#">terms</a>
|
||||
</label>
|
||||
</div>
|
||||
</div><!-- /.col -->
|
||||
<div class="col-xs-4">
|
||||
<button type="submit" class="btn btn-primary btn-block btn-flat">Register</button>
|
||||
</div><!-- /.col -->
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="social-auth-links text-center">
|
||||
<p>- OR -</p>
|
||||
<a href="#" class="btn btn-block btn-social btn-facebook btn-flat"><i class="fa fa-facebook"></i> Sign up using Facebook</a>
|
||||
<a href="#" class="btn btn-block btn-social btn-google-plus btn-flat"><i class="fa fa-google-plus"></i> Sign up using Google+</a>
|
||||
</div>
|
||||
|
||||
<a href="login.html" class="text-center">I already have a membership</a>
|
||||
</div><!-- /.form-box -->
|
||||
</div><!-- /.register-box -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- iCheck -->
|
||||
<script src="../../plugins/iCheck/icheck.min.js" type="text/javascript"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
$('input').iCheck({
|
||||
checkboxClass: 'icheckbox_square-blue',
|
||||
radioClass: 'iradio_square-blue',
|
||||
increaseArea: '20%' // optional
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,986 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Advanced form elements</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- daterange picker -->
|
||||
<link href="../../plugins/daterangepicker/daterangepicker-bs3.css" rel="stylesheet" type="text/css" />
|
||||
<!-- iCheck for checkboxes and radio inputs -->
|
||||
<link href="../../plugins/iCheck/all.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Bootstrap Color Picker -->
|
||||
<link href="../../plugins/colorpicker/bootstrap-colorpicker.min.css" rel="stylesheet"/>
|
||||
<!-- Bootstrap time Picker -->
|
||||
<link href="../../plugins/timepicker/bootstrap-timepicker.min.css" rel="stylesheet"/>
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../plugins/iCheck/all.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
AdminLTE Design Team
|
||||
<small><i class="fa fa-clock-o"></i> 2 hours</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Developers
|
||||
<small><i class="fa fa-clock-o"></i> Today</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Sales Department
|
||||
<small><i class="fa fa-clock-o"></i> Yesterday</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Reviewers
|
||||
<small><i class="fa fa-clock-o"></i> 2 days</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the page and may cause design problems
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-red"></i> 5 new members joined
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user text-red"></i> You changed your username
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Create a nice theme
|
||||
<small class="pull-right">40%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">40% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Some task I need to do
|
||||
<small class="pull-right">60%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">60% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Make beautiful transitions
|
||||
<small class="pull-right">80%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">80% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li class="active"><a href="advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Advanced Form Elements
|
||||
<small>Preview</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Forms</a></li>
|
||||
<li class="active">Advanced Elements</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
|
||||
<div class="box box-danger">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Input masks</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<!-- Date dd/mm/yyyy -->
|
||||
<div class="form-group">
|
||||
<label>Date masks:</label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">
|
||||
<i class="fa fa-calendar"></i>
|
||||
</div>
|
||||
<input type="text" class="form-control" data-inputmask="'alias': 'dd/mm/yyyy'" data-mask/>
|
||||
</div><!-- /.input group -->
|
||||
</div><!-- /.form group -->
|
||||
|
||||
<!-- Date mm/dd/yyyy -->
|
||||
<div class="form-group">
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">
|
||||
<i class="fa fa-calendar"></i>
|
||||
</div>
|
||||
<input type="text" class="form-control" data-inputmask="'alias': 'mm/dd/yyyy'" data-mask/>
|
||||
</div><!-- /.input group -->
|
||||
</div><!-- /.form group -->
|
||||
|
||||
<!-- phone mask -->
|
||||
<div class="form-group">
|
||||
<label>US phone mask:</label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">
|
||||
<i class="fa fa-phone"></i>
|
||||
</div>
|
||||
<input type="text" class="form-control" data-inputmask='"mask": "(999) 999-9999"' data-mask/>
|
||||
</div><!-- /.input group -->
|
||||
</div><!-- /.form group -->
|
||||
|
||||
<!-- phone mask -->
|
||||
<div class="form-group">
|
||||
<label>Intl US phone mask:</label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">
|
||||
<i class="fa fa-phone"></i>
|
||||
</div>
|
||||
<input type="text" class="form-control" data-inputmask="'mask': ['999-999-9999 [x99999]', '+099 99 99 9999[9]-9999']" data-mask/>
|
||||
</div><!-- /.input group -->
|
||||
</div><!-- /.form group -->
|
||||
|
||||
<!-- IP mask -->
|
||||
<div class="form-group">
|
||||
<label>IP mask:</label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">
|
||||
<i class="fa fa-laptop"></i>
|
||||
</div>
|
||||
<input type="text" class="form-control" data-inputmask="'alias': 'ip'" data-mask/>
|
||||
</div><!-- /.input group -->
|
||||
</div><!-- /.form group -->
|
||||
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
<div class="box box-info">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Color & Time Picker</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<!-- Color Picker -->
|
||||
<div class="form-group">
|
||||
<label>Color picker:</label>
|
||||
<input type="text" class="form-control my-colorpicker1"/>
|
||||
</div><!-- /.form group -->
|
||||
|
||||
<!-- Color Picker -->
|
||||
<div class="form-group">
|
||||
<label>Color picker with addon:</label>
|
||||
<div class="input-group my-colorpicker2">
|
||||
<input type="text" class="form-control"/>
|
||||
<div class="input-group-addon">
|
||||
<i></i>
|
||||
</div>
|
||||
</div><!-- /.input group -->
|
||||
</div><!-- /.form group -->
|
||||
|
||||
<!-- time Picker -->
|
||||
<div class="bootstrap-timepicker">
|
||||
<div class="form-group">
|
||||
<label>Time picker:</label>
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control timepicker"/>
|
||||
<div class="input-group-addon">
|
||||
<i class="fa fa-clock-o"></i>
|
||||
</div>
|
||||
</div><!-- /.input group -->
|
||||
</div><!-- /.form group -->
|
||||
</div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
</div><!-- /.col (left) -->
|
||||
<div class="col-md-6">
|
||||
<div class="box box-primary">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Date picker</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<!-- Date range -->
|
||||
<div class="form-group">
|
||||
<label>Date range:</label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">
|
||||
<i class="fa fa-calendar"></i>
|
||||
</div>
|
||||
<input type="text" class="form-control pull-right" id="reservation"/>
|
||||
</div><!-- /.input group -->
|
||||
</div><!-- /.form group -->
|
||||
|
||||
<!-- Date and time range -->
|
||||
<div class="form-group">
|
||||
<label>Date and time range:</label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">
|
||||
<i class="fa fa-clock-o"></i>
|
||||
</div>
|
||||
<input type="text" class="form-control pull-right" id="reservationtime"/>
|
||||
</div><!-- /.input group -->
|
||||
</div><!-- /.form group -->
|
||||
|
||||
<!-- Date and time range -->
|
||||
<div class="form-group">
|
||||
<label>Date range button:</label>
|
||||
<div class="input-group">
|
||||
<button class="btn btn-default pull-right" id="daterange-btn">
|
||||
<i class="fa fa-calendar"></i> Date range picker
|
||||
<i class="fa fa-caret-down"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div><!-- /.form group -->
|
||||
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
<!-- iCheck -->
|
||||
<div class="box box-success">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">iCheck - Checkbox & Radio Inputs</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<!-- Minimal style -->
|
||||
|
||||
<!-- checkbox -->
|
||||
<div class="form-group">
|
||||
<label>
|
||||
<input type="checkbox" class="minimal" checked/>
|
||||
</label>
|
||||
<label>
|
||||
<input type="checkbox" class="minimal"/>
|
||||
</label>
|
||||
<label>
|
||||
<input type="checkbox" class="minimal" disabled/>
|
||||
Minimal skin checkbox
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<!-- radio -->
|
||||
<div class="form-group">
|
||||
<label>
|
||||
<input type="radio" name="r1" class="minimal" checked/>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="r1" class="minimal"/>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="r1" class="minimal" disabled/>
|
||||
Minimal skin radio
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<!-- Minimal red style -->
|
||||
|
||||
<!-- checkbox -->
|
||||
<div class="form-group">
|
||||
<label>
|
||||
<input type="checkbox" class="minimal-red" checked/>
|
||||
</label>
|
||||
<label>
|
||||
<input type="checkbox" class="minimal-red"/>
|
||||
</label>
|
||||
<label>
|
||||
<input type="checkbox" class="minimal-red" disabled/>
|
||||
Minimal red skin checkbox
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<!-- radio -->
|
||||
<div class="form-group">
|
||||
<label>
|
||||
<input type="radio" name="r2" class="minimal-red" checked/>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="r2" class="minimal-red"/>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="r2" class="minimal-red" disabled/>
|
||||
Minimal red skin radio
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<!-- Minimal red style -->
|
||||
|
||||
<!-- checkbox -->
|
||||
<div class="form-group">
|
||||
<label>
|
||||
<input type="checkbox" class="flat-red" checked/>
|
||||
</label>
|
||||
<label>
|
||||
<input type="checkbox" class="flat-red"/>
|
||||
</label>
|
||||
<label>
|
||||
<input type="checkbox" class="flat-red" disabled/>
|
||||
Flat green skin checkbox
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<!-- radio -->
|
||||
<div class="form-group">
|
||||
<label>
|
||||
<input type="radio" name="r3" class="flat-red" checked/>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="r3" class="flat-red"/>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="r3" class="flat-red" disabled/>
|
||||
Flat green skin radio
|
||||
</label>
|
||||
</div>
|
||||
</div><!-- /.box-body -->
|
||||
<div class="box-footer">
|
||||
Many more skins available. <a href="http://fronteed.com/iCheck/">Documentation</a>
|
||||
</div>
|
||||
</div><!-- /.box -->
|
||||
</div><!-- /.col (right) -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- InputMask -->
|
||||
<script src="../../plugins/input-mask/jquery.inputmask.js" type="text/javascript"></script>
|
||||
<script src="../../plugins/input-mask/jquery.inputmask.date.extensions.js" type="text/javascript"></script>
|
||||
<script src="../../plugins/input-mask/jquery.inputmask.extensions.js" type="text/javascript"></script>
|
||||
<!-- date-range-picker -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js" type="text/javascript"></script>
|
||||
<script src="../../plugins/daterangepicker/daterangepicker.js" type="text/javascript"></script>
|
||||
<!-- bootstrap color picker -->
|
||||
<script src="../../plugins/colorpicker/bootstrap-colorpicker.min.js" type="text/javascript"></script>
|
||||
<!-- bootstrap time picker -->
|
||||
<script src="../../plugins/timepicker/bootstrap-timepicker.min.js" type="text/javascript"></script>
|
||||
<!-- SlimScroll 1.3.0 -->
|
||||
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<!-- iCheck 1.0.1 -->
|
||||
<script src="../../plugins/iCheck/icheck.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
<!-- Page script -->
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
//Datemask dd/mm/yyyy
|
||||
$("#datemask").inputmask("dd/mm/yyyy", {"placeholder": "dd/mm/yyyy"});
|
||||
//Datemask2 mm/dd/yyyy
|
||||
$("#datemask2").inputmask("mm/dd/yyyy", {"placeholder": "mm/dd/yyyy"});
|
||||
//Money Euro
|
||||
$("[data-mask]").inputmask();
|
||||
|
||||
//Date range picker
|
||||
$('#reservation').daterangepicker();
|
||||
//Date range picker with time picker
|
||||
$('#reservationtime').daterangepicker({timePicker: true, timePickerIncrement: 30, format: 'MM/DD/YYYY h:mm A'});
|
||||
//Date range as a button
|
||||
$('#daterange-btn').daterangepicker(
|
||||
{
|
||||
ranges: {
|
||||
'Today': [moment(), moment()],
|
||||
'Yesterday': [moment().subtract('days', 1), moment().subtract('days', 1)],
|
||||
'Last 7 Days': [moment().subtract('days', 6), moment()],
|
||||
'Last 30 Days': [moment().subtract('days', 29), moment()],
|
||||
'This Month': [moment().startOf('month'), moment().endOf('month')],
|
||||
'Last Month': [moment().subtract('month', 1).startOf('month'), moment().subtract('month', 1).endOf('month')]
|
||||
},
|
||||
startDate: moment().subtract('days', 29),
|
||||
endDate: moment()
|
||||
},
|
||||
function (start, end) {
|
||||
$('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
|
||||
}
|
||||
);
|
||||
|
||||
//iCheck for checkbox and radio inputs
|
||||
$('input[type="checkbox"].minimal, input[type="radio"].minimal').iCheck({
|
||||
checkboxClass: 'icheckbox_minimal-blue',
|
||||
radioClass: 'iradio_minimal-blue'
|
||||
});
|
||||
//Red color scheme for iCheck
|
||||
$('input[type="checkbox"].minimal-red, input[type="radio"].minimal-red').iCheck({
|
||||
checkboxClass: 'icheckbox_minimal-red',
|
||||
radioClass: 'iradio_minimal-red'
|
||||
});
|
||||
//Flat red color scheme for iCheck
|
||||
$('input[type="checkbox"].flat-red, input[type="radio"].flat-red').iCheck({
|
||||
checkboxClass: 'icheckbox_flat-green',
|
||||
radioClass: 'iradio_flat-green'
|
||||
});
|
||||
|
||||
//Colorpicker
|
||||
$(".my-colorpicker1").colorpicker();
|
||||
//color picker with addon
|
||||
$(".my-colorpicker2").colorpicker();
|
||||
|
||||
//Timepicker
|
||||
$(".timepicker").timepicker({
|
||||
showInputs: false
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,705 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Dashboard</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- bootstrap wysihtml5 - text editor -->
|
||||
<link href="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
AdminLTE Design Team
|
||||
<small><i class="fa fa-clock-o"></i> 2 hours</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Developers
|
||||
<small><i class="fa fa-clock-o"></i> Today</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Sales Department
|
||||
<small><i class="fa fa-clock-o"></i> Yesterday</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Reviewers
|
||||
<small><i class="fa fa-clock-o"></i> 2 days</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the page and may cause design problems
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-red"></i> 5 new members joined
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user text-red"></i> You changed your username
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Create a nice theme
|
||||
<small class="pull-right">40%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">40% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Some task I need to do
|
||||
<small class="pull-right">60%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">60% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Make beautiful transitions
|
||||
<small class="pull-right">80%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">80% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li class="active"><a href="editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Text Editors
|
||||
<small>Advanced form element</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Forms</a></li>
|
||||
<li class="active">Editors</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
|
||||
<div class='row'>
|
||||
<div class='col-md-12'>
|
||||
<div class='box box-info'>
|
||||
<div class='box-header'>
|
||||
<h3 class='box-title'>CK Editor <small>Advanced and full of features</small></h3>
|
||||
<!-- tools box -->
|
||||
<div class="pull-right box-tools">
|
||||
<button class="btn btn-info btn-sm" data-widget='collapse' data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
|
||||
<button class="btn btn-info btn-sm" data-widget='remove' data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
|
||||
</div><!-- /. tools -->
|
||||
</div><!-- /.box-header -->
|
||||
<div class='box-body pad'>
|
||||
<form>
|
||||
<textarea id="editor1" name="editor1" rows="10" cols="80">
|
||||
This is my textarea to be replaced with CKEditor.
|
||||
</textarea>
|
||||
</form>
|
||||
</div>
|
||||
</div><!-- /.box -->
|
||||
|
||||
<div class='box'>
|
||||
<div class='box-header'>
|
||||
<h3 class='box-title'>Bootstrap WYSIHTML5 <small>Simple and fast</small></h3>
|
||||
<!-- tools box -->
|
||||
<div class="pull-right box-tools">
|
||||
<button class="btn btn-default btn-sm" data-widget='collapse' data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
|
||||
<button class="btn btn-default btn-sm" data-widget='remove' data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
|
||||
</div><!-- /. tools -->
|
||||
</div><!-- /.box-header -->
|
||||
<div class='box-body pad'>
|
||||
<form>
|
||||
<textarea class="textarea" placeholder="Place some text here" style="width: 100%; height: 200px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;"></textarea>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.col-->
|
||||
</div><!-- ./row -->
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
<!-- CK Editor -->
|
||||
<script src="https://cdn.ckeditor.com/4.4.3/standard/ckeditor.js"></script>
|
||||
<!-- Bootstrap WYSIHTML5 -->
|
||||
<script src="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js" type="text/javascript"></script>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
// Replace the <textarea id="editor1"> with a CKEditor
|
||||
// instance, using default configuration.
|
||||
CKEDITOR.replace('editor1');
|
||||
//bootstrap WYSIHTML5 - text editor
|
||||
$(".textarea").wysihtml5();
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,951 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Dashboard</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
AdminLTE Design Team
|
||||
<small><i class="fa fa-clock-o"></i> 2 hours</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Developers
|
||||
<small><i class="fa fa-clock-o"></i> Today</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Sales Department
|
||||
<small><i class="fa fa-clock-o"></i> Yesterday</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Reviewers
|
||||
<small><i class="fa fa-clock-o"></i> 2 days</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the page and may cause design problems
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-red"></i> 5 new members joined
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user text-red"></i> You changed your username
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Create a nice theme
|
||||
<small class="pull-right">40%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">40% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Some task I need to do
|
||||
<small class="pull-right">60%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">60% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Make beautiful transitions
|
||||
<small class="pull-right">80%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">80% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li class="active"><a href="general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
General Form Elements
|
||||
<small>Preview</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Forms</a></li>
|
||||
<li class="active">General Elements</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="row">
|
||||
<!-- left column -->
|
||||
<div class="col-md-6">
|
||||
<!-- general form elements -->
|
||||
<div class="box box-primary">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Quick Example</h3>
|
||||
</div><!-- /.box-header -->
|
||||
<!-- form start -->
|
||||
<form role="form">
|
||||
<div class="box-body">
|
||||
<div class="form-group">
|
||||
<label for="exampleInputEmail1">Email address</label>
|
||||
<input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1">Password</label>
|
||||
<input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputFile">File input</label>
|
||||
<input type="file" id="exampleInputFile">
|
||||
<p class="help-block">Example block-level help text here.</p>
|
||||
</div>
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"> Check me out
|
||||
</label>
|
||||
</div>
|
||||
</div><!-- /.box-body -->
|
||||
|
||||
<div class="box-footer">
|
||||
<button type="submit" class="btn btn-primary">Submit</button>
|
||||
</div>
|
||||
</form>
|
||||
</div><!-- /.box -->
|
||||
|
||||
<!-- Form Element sizes -->
|
||||
<div class="box box-success">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Different Height</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<input class="form-control input-lg" type="text" placeholder=".input-lg">
|
||||
<br/>
|
||||
<input class="form-control" type="text" placeholder="Default input">
|
||||
<br/>
|
||||
<input class="form-control input-sm" type="text" placeholder=".input-sm">
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
<div class="box box-danger">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Different Width</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div class="row">
|
||||
<div class="col-xs-3">
|
||||
<input type="text" class="form-control" placeholder=".col-xs-3">
|
||||
</div>
|
||||
<div class="col-xs-4">
|
||||
<input type="text" class="form-control" placeholder=".col-xs-4">
|
||||
</div>
|
||||
<div class="col-xs-5">
|
||||
<input type="text" class="form-control" placeholder=".col-xs-5">
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
<!-- Input addon -->
|
||||
<div class="box box-info">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Input Addon</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon">@</span>
|
||||
<input type="text" class="form-control" placeholder="Username">
|
||||
</div>
|
||||
<br/>
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control">
|
||||
<span class="input-group-addon">.00</span>
|
||||
</div>
|
||||
<br/>
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon">$</span>
|
||||
<input type="text" class="form-control">
|
||||
<span class="input-group-addon">.00</span>
|
||||
</div>
|
||||
|
||||
<h4>With icons</h4>
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon"><i class="fa fa-envelope"></i></span>
|
||||
<input type="email" class="form-control" placeholder="Email">
|
||||
</div>
|
||||
<br/>
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control">
|
||||
<span class="input-group-addon"><i class="fa fa-check"></i></span>
|
||||
</div>
|
||||
<br/>
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon"><i class="fa fa-dollar"></i></span>
|
||||
<input type="text" class="form-control">
|
||||
<span class="input-group-addon"><i class="fa fa-ambulance"></i></span>
|
||||
</div>
|
||||
|
||||
<h4>With checkbox and radio inputs</h4>
|
||||
<div class="row">
|
||||
<div class="col-lg-6">
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon">
|
||||
<input type="checkbox">
|
||||
</span>
|
||||
<input type="text" class="form-control">
|
||||
</div><!-- /input-group -->
|
||||
</div><!-- /.col-lg-6 -->
|
||||
<div class="col-lg-6">
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon">
|
||||
<input type="radio">
|
||||
</span>
|
||||
<input type="text" class="form-control">
|
||||
</div><!-- /input-group -->
|
||||
</div><!-- /.col-lg-6 -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
<h4>With buttons</h4>
|
||||
<p class="margin">Large: <code>.input-group.input-group-lg</code></p>
|
||||
<div class="input-group input-group-lg">
|
||||
<div class="input-group-btn">
|
||||
<button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown">Action <span class="fa fa-caret-down"></span></button>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
<li><a href="#">Something else here</a></li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="#">Separated link</a></li>
|
||||
</ul>
|
||||
</div><!-- /btn-group -->
|
||||
<input type="text" class="form-control">
|
||||
</div><!-- /input-group -->
|
||||
<p class="margin">Normal</p>
|
||||
<div class="input-group">
|
||||
<div class="input-group-btn">
|
||||
<button type="button" class="btn btn-danger">Action</button>
|
||||
</div><!-- /btn-group -->
|
||||
<input type="text" class="form-control">
|
||||
</div><!-- /input-group -->
|
||||
<p class="margin">Small <code>.input-group.input-group-sm</code></p>
|
||||
<div class="input-group input-group-sm">
|
||||
<input type="text" class="form-control">
|
||||
<span class="input-group-btn">
|
||||
<button class="btn btn-info btn-flat" type="button">Go!</button>
|
||||
</span>
|
||||
</div><!-- /input-group -->
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
</div><!--/.col (left) -->
|
||||
<!-- right column -->
|
||||
<div class="col-md-6">
|
||||
<!-- general form elements disabled -->
|
||||
<div class="box box-warning">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">General Elements</h3>
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body">
|
||||
<form role="form">
|
||||
<!-- text input -->
|
||||
<div class="form-group">
|
||||
<label>Text</label>
|
||||
<input type="text" class="form-control" placeholder="Enter ..."/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Text Disabled</label>
|
||||
<input type="text" class="form-control" placeholder="Enter ..." disabled/>
|
||||
</div>
|
||||
|
||||
<!-- textarea -->
|
||||
<div class="form-group">
|
||||
<label>Textarea</label>
|
||||
<textarea class="form-control" rows="3" placeholder="Enter ..."></textarea>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Textarea Disabled</label>
|
||||
<textarea class="form-control" rows="3" placeholder="Enter ..." disabled></textarea>
|
||||
</div>
|
||||
|
||||
<!-- input states -->
|
||||
<div class="form-group has-success">
|
||||
<label class="control-label" for="inputSuccess"><i class="fa fa-check"></i> Input with success</label>
|
||||
<input type="text" class="form-control" id="inputSuccess" placeholder="Enter ..."/>
|
||||
</div>
|
||||
<div class="form-group has-warning">
|
||||
<label class="control-label" for="inputWarning"><i class="fa fa-bell-o"></i> Input with warning</label>
|
||||
<input type="text" class="form-control" id="inputWarning" placeholder="Enter ..."/>
|
||||
</div>
|
||||
<div class="form-group has-error">
|
||||
<label class="control-label" for="inputError"><i class="fa fa-times-circle-o"></i> Input with error</label>
|
||||
<input type="text" class="form-control" id="inputError" placeholder="Enter ..."/>
|
||||
</div>
|
||||
|
||||
<!-- checkbox -->
|
||||
<div class="form-group">
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"/>
|
||||
Checkbox 1
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"/>
|
||||
Checkbox 2
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox" disabled/>
|
||||
Checkbox disabled
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- radio -->
|
||||
<div class="form-group">
|
||||
<div class="radio">
|
||||
<label>
|
||||
<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>
|
||||
Option one is this and that—be sure to include why it's great
|
||||
</label>
|
||||
</div>
|
||||
<div class="radio">
|
||||
<label>
|
||||
<input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">
|
||||
Option two can be something else and selecting it will deselect option one
|
||||
</label>
|
||||
</div>
|
||||
<div class="radio">
|
||||
<label>
|
||||
<input type="radio" name="optionsRadios" id="optionsRadios3" value="option3" disabled/>
|
||||
Option three is disabled
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- select -->
|
||||
<div class="form-group">
|
||||
<label>Select</label>
|
||||
<select class="form-control">
|
||||
<option>option 1</option>
|
||||
<option>option 2</option>
|
||||
<option>option 3</option>
|
||||
<option>option 4</option>
|
||||
<option>option 5</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Select Disabled</label>
|
||||
<select class="form-control" disabled>
|
||||
<option>option 1</option>
|
||||
<option>option 2</option>
|
||||
<option>option 3</option>
|
||||
<option>option 4</option>
|
||||
<option>option 5</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- Select multiple-->
|
||||
<div class="form-group">
|
||||
<label>Select Multiple</label>
|
||||
<select multiple class="form-control">
|
||||
<option>option 1</option>
|
||||
<option>option 2</option>
|
||||
<option>option 3</option>
|
||||
<option>option 4</option>
|
||||
<option>option 5</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Select Multiple Disabled</label>
|
||||
<select multiple class="form-control" disabled>
|
||||
<option>option 1</option>
|
||||
<option>option 2</option>
|
||||
<option>option 3</option>
|
||||
<option>option 4</option>
|
||||
<option>option 5</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
</div><!--/.col (right) -->
|
||||
</div> <!-- /.row -->
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,571 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Boxed Layout</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<!-- ADD THE CLASS layout-boxed TO GET A BOXED LAYOUT -->
|
||||
<body class="skin-blue layout-boxed sidebar-mini">
|
||||
<!-- Site wrapper -->
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<!-- =============================================== -->
|
||||
|
||||
<!-- Left side column. contains the sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li class="active"><a href="boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- =============================================== -->
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Boxed Layout
|
||||
<small>Blank example to the boxed layout</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Examples</a></li>
|
||||
<li class="active">Blank page</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="callout callout-info">
|
||||
<h4>Tip!</h4>
|
||||
<p>Add the layout-boxed class to the body tag to get this layout. The boxed layout is helpful when working on large screens because it prevents the site from stretching very wide.</p>
|
||||
</div>
|
||||
<!-- Default box -->
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Title</h3>
|
||||
<div class="box-tools pull-right">
|
||||
<button class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
|
||||
<button class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
Start creating your amazing application!
|
||||
</div><!-- /.box-body -->
|
||||
<div class="box-footer">
|
||||
Footer
|
||||
</div><!-- /.box-footer-->
|
||||
</div><!-- /.box -->
|
||||
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- SlimScroll -->
|
||||
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,574 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Collapsed Sidebar Layout</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<!-- ADD THE CLASS sidedar-collapse TO HIDE THE SIDEBAR PRIOR TO LOADING THE SITE -->
|
||||
<body class="skin-blue sidebar-collapse sidebar-mini">
|
||||
<!-- Site wrapper -->
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<!-- =============================================== -->
|
||||
|
||||
<!-- Left side column. contains the sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li class="active"><a href="collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- =============================================== -->
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Sidebar Collapsed
|
||||
<small>Layout with collapsed sidebar on load</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Examples</a></li>
|
||||
<li class="active">Blank page</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="callout callout-info">
|
||||
<h4>Tip!</h4>
|
||||
<p>Add the sidebar-collapse class to the body tag to get this layout. You should combine this option with a fixed layout if you have a long sidebar. Doing that will prevent your page content from getting stretched vertically.</p>
|
||||
</div>
|
||||
<!-- Default box -->
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Title</h3>
|
||||
<div class="box-tools pull-right">
|
||||
<button class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
|
||||
<button class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
Start creating your amazing application!
|
||||
</div><!-- /.box-body -->
|
||||
<div class="box-footer">
|
||||
Footer
|
||||
</div><!-- /.box-footer-->
|
||||
</div><!-- /.box -->
|
||||
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- SlimScroll -->
|
||||
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,575 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Fixed Layout</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<!-- ADD THE CLASS fixed TO GET A FIXED HEADER AND SIDEBAR LAYOUT -->
|
||||
<!-- the fixed layout is not compatible with sidebar-mini -->
|
||||
<body class="skin-blue fixed sidebar-mini">
|
||||
<!-- Site wrapper -->
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<!-- =============================================== -->
|
||||
|
||||
<!-- Left side column. contains the sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li class="active"><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- =============================================== -->
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Fixed Layout
|
||||
<small>Blank example to the fixed layout</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Examples</a></li>
|
||||
<li class="active">Blank page</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="callout callout-info">
|
||||
<h4>Tip!</h4>
|
||||
<p>Add the fixed class to the body tag to get this layout. The fixed layout is your best option if your sidebar is bigger than your content because it prevents extra unwanted scrolling.</p>
|
||||
</div>
|
||||
<!-- Default box -->
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Title</h3>
|
||||
<div class="box-tools pull-right">
|
||||
<button class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
|
||||
<button class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
Start creating your amazing application!
|
||||
</div><!-- /.box-body -->
|
||||
<div class="box-footer">
|
||||
Footer
|
||||
</div><!-- /.box-footer-->
|
||||
</div><!-- /.box -->
|
||||
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- SlimScroll -->
|
||||
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,574 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="rtl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Collapsed Sidebar Layout</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap-rtl.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE-rtl.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<!-- ADD THE CLASS sidedar-collapse TO HIDE THE SIDEBAR PRIOR TO LOADING THE SITE -->
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<!-- Site wrapper -->
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<!-- =============================================== -->
|
||||
|
||||
<!-- Left side column. contains the sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li class="active"><a href="collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- =============================================== -->
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Sidebar Collapsed
|
||||
<small>Layout with collapsed sidebar on load</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Examples</a></li>
|
||||
<li class="active">Blank page</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="callout callout-info">
|
||||
<h4>Tip!</h4>
|
||||
<p>Add the sidebar-collapse class to the body tag to get this layout. You should combine this option with a fixed layout if you have a long sidebar. Doing that will prevent your page content from getting stretched vertically.</p>
|
||||
</div>
|
||||
<!-- Default box -->
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Title</h3>
|
||||
<div class="box-tools pull-right">
|
||||
<button class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
|
||||
<button class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
Start creating your amazing application!
|
||||
</div><!-- /.box-body -->
|
||||
<div class="box-footer">
|
||||
Footer
|
||||
</div><!-- /.box-footer-->
|
||||
</div><!-- /.box -->
|
||||
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- SlimScroll -->
|
||||
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,262 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Dashboard</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<!-- ADD THE CLASS layout-top-nav TO REMOVE THE SIDEBAR. -->
|
||||
<body class="skin-blue layout-top-nav">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<nav class="navbar navbar-static-top">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
<a href="../../index2.html" class="navbar-brand"><b>Admin</b>LTE</a>
|
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse">
|
||||
<i class="fa fa-bars"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Collect the nav links, forms, and other content for toggling -->
|
||||
<div class="collapse navbar-collapse pull-left" id="navbar-collapse">
|
||||
<ul class="nav navbar-nav">
|
||||
<li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
|
||||
<li><a href="#">Link</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu" role="menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
<li><a href="#">Something else here</a></li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="#">Separated link</a></li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="#">One more separated link</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<form class="navbar-form navbar-left" role="search">
|
||||
<div class="form-group">
|
||||
<input type="text" class="form-control" id="navbar-search-input" placeholder="Search">
|
||||
</div>
|
||||
</form>
|
||||
</div><!-- /.navbar-collapse -->
|
||||
<!-- Navbar Right Menu -->
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<!-- Menu toggle button -->
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the messages -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<!-- User Image -->
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<!-- Message title and timestamp -->
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<!-- The message -->
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
</ul><!-- /.menu -->
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li><!-- /.messages-menu -->
|
||||
|
||||
<!-- Notifications Menu -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<!-- Menu toggle button -->
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- Inner Menu: contains the notifications -->
|
||||
<ul class="menu">
|
||||
<li><!-- start notification -->
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li><!-- end notification -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks Menu -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<!-- Menu Toggle Button -->
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- Inner menu: contains the tasks -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<!-- Task title and progress text -->
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<!-- The progress bar -->
|
||||
<div class="progress xs">
|
||||
<!-- Change the css width attribute to simulate progress -->
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- User Account Menu -->
|
||||
<li class="dropdown user user-menu">
|
||||
<!-- Menu Toggle Button -->
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<!-- The user image in the navbar-->
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="user-image" alt="User Image"/>
|
||||
<!-- hidden-xs hides the username on small devices so only the image appears. -->
|
||||
<span class="hidden-xs">Alexander Pierce</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<!-- The user image in the menu -->
|
||||
<li class="user-header">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div><!-- /.navbar-custom-menu -->
|
||||
</div><!-- /.container-fluid -->
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Full Width Column -->
|
||||
<div class="content-wrapper">
|
||||
<div class="container">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Top Navigation
|
||||
<small>Example 2.0</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li class="active">Dashboard</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="callout callout-info">
|
||||
<h4>Tip!</h4>
|
||||
<p>Add the layout-top-nav class to the body tag to get this layout. This feature can also be used with a sidebar! So use this class if you want to remove the custom dropdown menus from the navbar and use regular links instead.</p>
|
||||
</div>
|
||||
<div class="callout callout-danger">
|
||||
<h4>Warning!</h4>
|
||||
<p>The construction of this layout differs from the normal one. In other words, the HTML markup of the navbar and the content will slightly differ than that of the normal layout.</p>
|
||||
</div>
|
||||
<div class="box box-default">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Blank Box</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
The great content goes here
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.container -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="container">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</div><!-- /.container -->
|
||||
</footer>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- SlimScroll -->
|
||||
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,648 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Compose Message</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- fullCalendar 2.2.5-->
|
||||
<link href="../../plugins/fullcalendar/fullcalendar.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="../../plugins/fullcalendar/fullcalendar.print.css" rel="stylesheet" type="text/css" media='print' />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- iCheck -->
|
||||
<link href="../../plugins/iCheck/flat/blue.css" rel="stylesheet" type="text/css" />
|
||||
<!-- bootstrap wysihtml5 - text editor -->
|
||||
<link href="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="mailbox.html">Inbox <span class="label label-primary pull-right">13</span></a></li>
|
||||
<li class="active"><a href="compose.html">Compose</a></li>
|
||||
<li><a href="read-mail.html">Read</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Mailbox
|
||||
<small>13 new messages</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li class="active">Mailbox</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<a href="mailbox.html" class="btn btn-primary btn-block margin-bottom">Back to Inbox</a>
|
||||
<div class="box box-solid">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Folders</h3>
|
||||
<div class='box-tools'>
|
||||
<button class='btn btn-box-tool' data-widget='collapse'><i class='fa fa-minus'></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-body no-padding">
|
||||
<ul class="nav nav-pills nav-stacked">
|
||||
<li><a href="mailbox.html"><i class="fa fa-inbox"></i> Inbox <span class="label label-primary pull-right">12</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-envelope-o"></i> Sent</a></li>
|
||||
<li><a href="#"><i class="fa fa-file-text-o"></i> Drafts</a></li>
|
||||
<li><a href="#"><i class="fa fa-filter"></i> Junk <span class="label label-waring pull-right">65</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-trash-o"></i> Trash</a></li>
|
||||
</ul>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /. box -->
|
||||
<div class="box box-solid">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Labels</h3>
|
||||
<div class='box-tools'>
|
||||
<button class='btn btn-box-tool' data-widget='collapse'><i class='fa fa-minus'></i></button>
|
||||
</div>
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body no-padding">
|
||||
<ul class="nav nav-pills nav-stacked">
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> Important</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> Promotions</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-light-blue"></i> Social</a></li>
|
||||
</ul>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
</div><!-- /.col -->
|
||||
<div class="col-md-9">
|
||||
<div class="box box-primary">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Compose New Message</h3>
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body">
|
||||
<div class="form-group">
|
||||
<input class="form-control" placeholder="To:"/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input class="form-control" placeholder="Subject:"/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<textarea id="compose-textarea" class="form-control" style="height: 300px">
|
||||
<h1><u>Heading Of Message</u></h1>
|
||||
<h4>Subheading</h4>
|
||||
<p>But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system, and expound the actual teachings of the great explorer of the truth, the master-builder of human happiness. No one rejects, dislikes, or avoids pleasure itself, because it is pleasure, but because those who do not know how to pursue pleasure rationally encounter consequences that are extremely painful. Nor again is there anyone who loves or pursues or desires to obtain pain of itself, because it is pain, but because occasionally circumstances occur in which toil and pain can procure him some great pleasure. To take a trivial example, which of us ever undertakes laborious physical exercise, except to obtain some advantage from it? But who has any right to find fault with a man who chooses to enjoy a pleasure that has no annoying consequences, or one who avoids a pain that produces no resultant pleasure? On the other hand, we denounce with righteous indignation and dislike men who are so beguiled and demoralized by the charms of pleasure of the moment, so blinded by desire, that they cannot foresee</p>
|
||||
<ul>
|
||||
<li>List item one</li>
|
||||
<li>List item two</li>
|
||||
<li>List item three</li>
|
||||
<li>List item four</li>
|
||||
</ul>
|
||||
<p>Thank you,</p>
|
||||
<p>John Doe</p>
|
||||
</textarea>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="btn btn-default btn-file">
|
||||
<i class="fa fa-paperclip"></i> Attachment
|
||||
<input type="file" name="attachment"/>
|
||||
</div>
|
||||
<p class="help-block">Max. 32MB</p>
|
||||
</div>
|
||||
</div><!-- /.box-body -->
|
||||
<div class="box-footer">
|
||||
<div class="pull-right">
|
||||
<button class="btn btn-default"><i class="fa fa-pencil"></i> Draft</button>
|
||||
<button type="submit" class="btn btn-primary"><i class="fa fa-envelope-o"></i> Send</button>
|
||||
</div>
|
||||
<button class="btn btn-default"><i class="fa fa-times"></i> Discard</button>
|
||||
</div><!-- /.box-footer -->
|
||||
</div><!-- /. box -->
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- Slimscroll -->
|
||||
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
<!-- iCheck -->
|
||||
<script src="../../plugins/iCheck/icheck.min.js" type="text/javascript"></script>
|
||||
<!-- Bootstrap WYSIHTML5 -->
|
||||
<script src="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js" type="text/javascript"></script>
|
||||
<!-- Page Script -->
|
||||
<script>
|
||||
$(function () {
|
||||
//Add text editor
|
||||
$("#compose-textarea").wysihtml5();
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,816 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Mailbox</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- fullCalendar 2.2.5-->
|
||||
<link href="../../plugins/fullcalendar/fullcalendar.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="../../plugins/fullcalendar/fullcalendar.print.css" rel="stylesheet" type="text/css" media='print' />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- iCheck -->
|
||||
<link href="../../plugins/iCheck/flat/blue.css" rel="stylesheet" type="text/css" />
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li class="active"><a href="mailbox.html">Inbox <span class="label label-primary pull-right">13</span></a></li>
|
||||
<li><a href="compose.html">Compose</a></li>
|
||||
<li><a href="read-mail.html">Read</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Mailbox
|
||||
<small>13 new messages</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li class="active">Mailbox</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<a href="compose.html" class="btn btn-primary btn-block margin-bottom">Compose</a>
|
||||
<div class="box box-solid">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Folders</h3>
|
||||
<div class='box-tools'>
|
||||
<button class='btn btn-box-tool' data-widget='collapse'><i class='fa fa-minus'></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-body no-padding">
|
||||
<ul class="nav nav-pills nav-stacked">
|
||||
<li class="active"><a href="#"><i class="fa fa-inbox"></i> Inbox <span class="label label-primary pull-right">12</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-envelope-o"></i> Sent</a></li>
|
||||
<li><a href="#"><i class="fa fa-file-text-o"></i> Drafts</a></li>
|
||||
<li><a href="#"><i class="fa fa-filter"></i> Junk <span class="label label-waring pull-right">65</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-trash-o"></i> Trash</a></li>
|
||||
</ul>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /. box -->
|
||||
<div class="box box-solid">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Labels</h3>
|
||||
<div class='box-tools'>
|
||||
<button class='btn btn-box-tool' data-widget='collapse'><i class='fa fa-minus'></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-body no-padding">
|
||||
<ul class="nav nav-pills nav-stacked">
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> Important</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> Promotions</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-light-blue"></i> Social</a></li>
|
||||
</ul>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
</div><!-- /.col -->
|
||||
<div class="col-md-9">
|
||||
<div class="box box-primary">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Inbox</h3>
|
||||
<div class="box-tools pull-right">
|
||||
<div class="has-feedback">
|
||||
<input type="text" class="form-control input-sm" placeholder="Search Mail"/>
|
||||
<span class="glyphicon glyphicon-search form-control-feedback"></span>
|
||||
</div>
|
||||
</div><!-- /.box-tools -->
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body no-padding">
|
||||
<div class="mailbox-controls">
|
||||
<!-- Check all button -->
|
||||
<button class="btn btn-default btn-sm checkbox-toggle"><i class="fa fa-square-o"></i></button>
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-default btn-sm"><i class="fa fa-trash-o"></i></button>
|
||||
<button class="btn btn-default btn-sm"><i class="fa fa-reply"></i></button>
|
||||
<button class="btn btn-default btn-sm"><i class="fa fa-share"></i></button>
|
||||
</div><!-- /.btn-group -->
|
||||
<button class="btn btn-default btn-sm"><i class="fa fa-refresh"></i></button>
|
||||
<div class="pull-right">
|
||||
1-50/200
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-default btn-sm"><i class="fa fa-chevron-left"></i></button>
|
||||
<button class="btn btn-default btn-sm"><i class="fa fa-chevron-right"></i></button>
|
||||
</div><!-- /.btn-group -->
|
||||
</div><!-- /.pull-right -->
|
||||
</div>
|
||||
<div class="table-responsive mailbox-messages">
|
||||
<table class="table table-hover table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"></td>
|
||||
<td class="mailbox-date">5 mins ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star-o text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"><i class="fa fa-paperclip"></i></td>
|
||||
<td class="mailbox-date">28 mins ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star-o text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"><i class="fa fa-paperclip"></i></td>
|
||||
<td class="mailbox-date">11 hours ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"></td>
|
||||
<td class="mailbox-date">15 hours ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"><i class="fa fa-paperclip"></i></td>
|
||||
<td class="mailbox-date">Yesterday</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star-o text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"><i class="fa fa-paperclip"></i></td>
|
||||
<td class="mailbox-date">2 days ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star-o text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"><i class="fa fa-paperclip"></i></td>
|
||||
<td class="mailbox-date">2 days ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"></td>
|
||||
<td class="mailbox-date">2 days ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"></td>
|
||||
<td class="mailbox-date">2 days ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star-o text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"></td>
|
||||
<td class="mailbox-date">2 days ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star-o text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"><i class="fa fa-paperclip"></i></td>
|
||||
<td class="mailbox-date">4 days ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"></td>
|
||||
<td class="mailbox-date">12 days ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star-o text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"><i class="fa fa-paperclip"></i></td>
|
||||
<td class="mailbox-date">12 days ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"><i class="fa fa-paperclip"></i></td>
|
||||
<td class="mailbox-date">14 days ago</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="checkbox" /></td>
|
||||
<td class="mailbox-star"><a href="#"><i class="fa fa-star text-yellow"></i></a></td>
|
||||
<td class="mailbox-name"><a href="read-mail.html">Alexander Pierce</a></td>
|
||||
<td class="mailbox-subject"><b>AdminLTE 2.0 Issue</b> - Trying to find a solution to this problem...</td>
|
||||
<td class="mailbox-attachment"><i class="fa fa-paperclip"></i></td>
|
||||
<td class="mailbox-date">15 days ago</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table><!-- /.table -->
|
||||
</div><!-- /.mail-box-messages -->
|
||||
</div><!-- /.box-body -->
|
||||
<div class="box-footer no-padding">
|
||||
<div class="mailbox-controls">
|
||||
<!-- Check all button -->
|
||||
<button class="btn btn-default btn-sm checkbox-toggle"><i class="fa fa-square-o"></i></button>
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-default btn-sm"><i class="fa fa-trash-o"></i></button>
|
||||
<button class="btn btn-default btn-sm"><i class="fa fa-reply"></i></button>
|
||||
<button class="btn btn-default btn-sm"><i class="fa fa-share"></i></button>
|
||||
</div><!-- /.btn-group -->
|
||||
<button class="btn btn-default btn-sm"><i class="fa fa-refresh"></i></button>
|
||||
<div class="pull-right">
|
||||
1-50/200
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-default btn-sm"><i class="fa fa-chevron-left"></i></button>
|
||||
<button class="btn btn-default btn-sm"><i class="fa fa-chevron-right"></i></button>
|
||||
</div><!-- /.btn-group -->
|
||||
</div><!-- /.pull-right -->
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /. box -->
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- Slimscroll -->
|
||||
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- iCheck -->
|
||||
<script src="../../plugins/iCheck/icheck.min.js" type="text/javascript"></script>
|
||||
<!-- Page Script -->
|
||||
<script>
|
||||
$(function () {
|
||||
//Enable iCheck plugin for checkboxes
|
||||
//iCheck for checkbox and radio inputs
|
||||
$('.mailbox-messages input[type="checkbox"]').iCheck({
|
||||
checkboxClass: 'icheckbox_flat-blue',
|
||||
radioClass: 'iradio_flat-blue'
|
||||
});
|
||||
|
||||
//Enable check and uncheck all functionality
|
||||
$(".checkbox-toggle").click(function () {
|
||||
var clicks = $(this).data('clicks');
|
||||
if (clicks) {
|
||||
//Uncheck all checkboxes
|
||||
$(".mailbox-messages input[type='checkbox']").iCheck("uncheck");
|
||||
$(".fa", this).removeClass("fa-check-square-o").addClass('fa-square-o');
|
||||
} else {
|
||||
//Check all checkboxes
|
||||
$(".mailbox-messages input[type='checkbox']").iCheck("check");
|
||||
$(".fa", this).removeClass("fa-square-o").addClass('fa-check-square-o');
|
||||
}
|
||||
$(this).data("clicks", !clicks);
|
||||
});
|
||||
|
||||
//Handle starring for glyphicon and font awesome
|
||||
$(".mailbox-star").click(function (e) {
|
||||
e.preventDefault();
|
||||
//detect type
|
||||
var $this = $(this).find("a > i");
|
||||
var glyph = $this.hasClass("glyphicon");
|
||||
var fa = $this.hasClass("fa");
|
||||
|
||||
//Switch states
|
||||
if (glyph) {
|
||||
$this.toggleClass("glyphicon-star");
|
||||
$this.toggleClass("glyphicon-star-empty");
|
||||
}
|
||||
|
||||
if (fa) {
|
||||
$this.toggleClass("fa-star");
|
||||
$this.toggleClass("fa-star-o");
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,673 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Read Mail</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- fullCalendar 2.2.5-->
|
||||
<link href="../../plugins/fullcalendar/fullcalendar.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="../../plugins/fullcalendar/fullcalendar.print.css" rel="stylesheet" type="text/css" media='print' />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- iCheck -->
|
||||
<link href="../../plugins/iCheck/flat/blue.css" rel="stylesheet" type="text/css" />
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="mailbox.html">Inbox <span class="label label-primary pull-right">13</span></a></li>
|
||||
<li><a href="compose.html">Compose</a></li>
|
||||
<li class="active"><a href="read-mail.html">Read</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Read Mail
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li class="active">Mailbox</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<a href="compose.html" class="btn btn-primary btn-block margin-bottom">Compose</a>
|
||||
<div class="box box-solid">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Folders</h3>
|
||||
<div class='box-tools'>
|
||||
<button class='btn btn-box-tool' data-widget='collapse'><i class='fa fa-minus'></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-body no-padding">
|
||||
<ul class="nav nav-pills nav-stacked">
|
||||
<li><a href="mailbox.html"><i class="fa fa-inbox"></i> Inbox <span class="label label-primary pull-right">12</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-envelope-o"></i> Sent</a></li>
|
||||
<li><a href="#"><i class="fa fa-file-text-o"></i> Drafts</a></li>
|
||||
<li><a href="#"><i class="fa fa-filter"></i> Junk <span class="label label-waring pull-right">65</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-trash-o"></i> Trash</a></li>
|
||||
</ul>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /. box -->
|
||||
<div class="box box-solid">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Labels</h3>
|
||||
<div class='box-tools'>
|
||||
<button class='btn btn-box-tool' data-widget='collapse'><i class='fa fa-minus'></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-body no-padding">
|
||||
<ul class="nav nav-pills nav-stacked">
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> Important</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> Promotions</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-light-blue"></i> Social</a></li>
|
||||
</ul>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
</div><!-- /.col -->
|
||||
<div class="col-md-9">
|
||||
<div class="box box-primary">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Read Mail</h3>
|
||||
<div class="box-tools pull-right">
|
||||
<a href="#" class="btn btn-box-tool" data-toggle="tooltip" title="Previous"><i class="fa fa-chevron-left"></i></a>
|
||||
<a href="#" class="btn btn-box-tool" data-toggle="tooltip" title="Next"><i class="fa fa-chevron-right"></i></a>
|
||||
</div>
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body no-padding">
|
||||
<div class="mailbox-read-info">
|
||||
<h3>Message Subject Is Placed Here</h3>
|
||||
<h5>From: support@almsaeedstudio.com <span class="mailbox-read-time pull-right">15 Feb. 2015 11:03 PM</span></h5>
|
||||
</div><!-- /.mailbox-read-info -->
|
||||
<div class="mailbox-controls with-border text-center">
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-default btn-sm" data-toggle="tooltip" title="Delete"><i class="fa fa-trash-o"></i></button>
|
||||
<button class="btn btn-default btn-sm" data-toggle="tooltip" title="Reply"><i class="fa fa-reply"></i></button>
|
||||
<button class="btn btn-default btn-sm" data-toggle="tooltip" title="Forward"><i class="fa fa-share"></i></button>
|
||||
</div><!-- /.btn-group -->
|
||||
<button class="btn btn-default btn-sm" data-toggle="tooltip" title="Print"><i class="fa fa-print"></i></button>
|
||||
</div><!-- /.mailbox-controls -->
|
||||
<div class="mailbox-read-message">
|
||||
<p>Hello John,</p>
|
||||
<p>Keffiyeh blog actually fashion axe vegan, irony biodiesel. Cold-pressed hoodie chillwave put a bird on it aesthetic, bitters brunch meggings vegan iPhone. Dreamcatcher vegan scenester mlkshk. Ethical master cleanse Bushwick, occupy Thundercats banjo cliche ennui farm-to-table mlkshk fanny pack gluten-free. Marfa butcher vegan quinoa, bicycle rights disrupt tofu scenester chillwave 3 wolf moon asymmetrical taxidermy pour-over. Quinoa tote bag fashion axe, Godard disrupt migas church-key tofu blog locavore. Thundercats cronut polaroid Neutra tousled, meh food truck selfies narwhal American Apparel.</p>
|
||||
<p>Raw denim McSweeney's bicycle rights, iPhone trust fund quinoa Neutra VHS kale chips vegan PBR&B literally Thundercats +1. Forage tilde four dollar toast, banjo health goth paleo butcher. Four dollar toast Brooklyn pour-over American Apparel sustainable, lumbersexual listicle gluten-free health goth umami hoodie. Synth Echo Park bicycle rights DIY farm-to-table, retro kogi sriracha dreamcatcher PBR&B flannel hashtag irony Wes Anderson. Lumbersexual Williamsburg Helvetica next level. Cold-pressed slow-carb pop-up normcore Thundercats Portland, cardigan literally meditation lumbersexual crucifix. Wayfarers raw denim paleo Bushwick, keytar Helvetica scenester keffiyeh 8-bit irony mumblecore whatever viral Truffaut.</p>
|
||||
<p>Post-ironic shabby chic VHS, Marfa keytar flannel lomo try-hard keffiyeh cray. Actually fap fanny pack yr artisan trust fund. High Life dreamcatcher church-key gentrify. Tumblr stumptown four dollar toast vinyl, cold-pressed try-hard blog authentic keffiyeh Helvetica lo-fi tilde Intelligentsia. Lomo locavore salvia bespoke, twee fixie paleo cliche brunch Schlitz blog McSweeney's messenger bag swag slow-carb. Odd Future photo booth pork belly, you probably haven't heard of them actually tofu ennui keffiyeh lo-fi Truffaut health goth. Narwhal sustainable retro disrupt.</p>
|
||||
<p>Skateboard artisan letterpress before they sold out High Life messenger bag. Bitters chambray leggings listicle, drinking vinegar chillwave synth. Fanny pack hoodie American Apparel twee. American Apparel PBR listicle, salvia aesthetic occupy sustainable Neutra kogi. Organic synth Tumblr viral plaid, shabby chic single-origin coffee Etsy 3 wolf moon slow-carb Schlitz roof party tousled squid vinyl. Readymade next level literally trust fund. Distillery master cleanse migas, Vice sriracha flannel chambray chia cronut.</p>
|
||||
<p>Thanks,<br>Jane</p>
|
||||
</div><!-- /.mailbox-read-message -->
|
||||
</div><!-- /.box-body -->
|
||||
<div class="box-footer">
|
||||
<ul class="mailbox-attachments clearfix">
|
||||
<li>
|
||||
<span class="mailbox-attachment-icon"><i class="fa fa-file-pdf-o"></i></span>
|
||||
<div class="mailbox-attachment-info">
|
||||
<a href="#" class="mailbox-attachment-name"><i class="fa fa-paperclip"></i> Sep2014-report.pdf</a>
|
||||
<span class="mailbox-attachment-size">
|
||||
1,245 KB
|
||||
<a href="#" class="btn btn-default btn-xs pull-right"><i class="fa fa-cloud-download"></i></a>
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<span class="mailbox-attachment-icon"><i class="fa fa-file-word-o"></i></span>
|
||||
<div class="mailbox-attachment-info">
|
||||
<a href="#" class="mailbox-attachment-name"><i class="fa fa-paperclip"></i> App Description.docx</a>
|
||||
<span class="mailbox-attachment-size">
|
||||
1,245 KB
|
||||
<a href="#" class="btn btn-default btn-xs pull-right"><i class="fa fa-cloud-download"></i></a>
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<span class="mailbox-attachment-icon has-img"><img src="../../dist/img/photo1.png" alt="Attachment"/></span>
|
||||
<div class="mailbox-attachment-info">
|
||||
<a href="#" class="mailbox-attachment-name"><i class="fa fa-camera"></i> photo1.png</a>
|
||||
<span class="mailbox-attachment-size">
|
||||
2.67 MB
|
||||
<a href="#" class="btn btn-default btn-xs pull-right"><i class="fa fa-cloud-download"></i></a>
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<span class="mailbox-attachment-icon has-img"><img src="../../dist/img/photo2.png" alt="Attachment"/></span>
|
||||
<div class="mailbox-attachment-info">
|
||||
<a href="#" class="mailbox-attachment-name"><i class="fa fa-camera"></i> photo2.png</a>
|
||||
<span class="mailbox-attachment-size">
|
||||
1.9 MB
|
||||
<a href="#" class="btn btn-default btn-xs pull-right"><i class="fa fa-cloud-download"></i></a>
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div><!-- /.box-footer -->
|
||||
<div class="box-footer">
|
||||
<div class="pull-right">
|
||||
<button class="btn btn-default"><i class="fa fa-reply"></i> Reply</button>
|
||||
<button class="btn btn-default"><i class="fa fa-share"></i> Forward</button>
|
||||
</div>
|
||||
<button class="btn btn-default"><i class="fa fa-trash-o"></i> Delete</button>
|
||||
<button class="btn btn-default"><i class="fa fa-print"></i> Print</button>
|
||||
</div><!-- /.box-footer -->
|
||||
</div><!-- /. box -->
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- Slimscroll -->
|
||||
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,955 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AdminLTE 2 | Simple Tables</title>
|
||||
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
|
||||
<!-- Bootstrap 3.3.4 -->
|
||||
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Font Awesome Icons -->
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Ionicons -->
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- Theme style -->
|
||||
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<!-- AdminLTE Skins. Choose a skin from the css/skins
|
||||
folder instead of downloading all of them to reduce the load. -->
|
||||
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body class="skin-blue sidebar-mini">
|
||||
<div class="wrapper">
|
||||
|
||||
<header class="main-header">
|
||||
<!-- Logo -->
|
||||
<a href="../../index2.html" class="logo">
|
||||
<!-- mini logo for sidebar mini 50x50 pixels -->
|
||||
<span class="logo-mini"><b>A</b>LT</span>
|
||||
<!-- logo for regular state and mobile devices -->
|
||||
<span class="logo-lg"><b>Admin</b>LTE</span>
|
||||
</a>
|
||||
<!-- Header Navbar: style can be found in header.less -->
|
||||
<nav class="navbar navbar-static-top" role="navigation">
|
||||
<!-- Sidebar toggle button-->
|
||||
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<div class="navbar-custom-menu">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- Messages: style can be found in dropdown.less-->
|
||||
<li class="dropdown messages-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-envelope-o"></i>
|
||||
<span class="label label-success">4</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 4 messages</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- start message -->
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Support Team
|
||||
<small><i class="fa fa-clock-o"></i> 5 mins</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li><!-- end message -->
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
AdminLTE Design Team
|
||||
<small><i class="fa fa-clock-o"></i> 2 hours</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Developers
|
||||
<small><i class="fa fa-clock-o"></i> Today</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Sales Department
|
||||
<small><i class="fa fa-clock-o"></i> Yesterday</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="pull-left">
|
||||
<img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="user image"/>
|
||||
</div>
|
||||
<h4>
|
||||
Reviewers
|
||||
<small><i class="fa fa-clock-o"></i> 2 days</small>
|
||||
</h4>
|
||||
<p>Why not buy a new awesome theme?</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">See All Messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Notifications: style can be found in dropdown.less -->
|
||||
<li class="dropdown notifications-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-bell-o"></i>
|
||||
<span class="label label-warning">10</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 10 notifications</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-aqua"></i> 5 new members joined today
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the page and may cause design problems
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-users text-red"></i> 5 new members joined
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user text-red"></i> You changed your username
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer"><a href="#">View all</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Tasks: style can be found in dropdown.less -->
|
||||
<li class="dropdown tasks-menu">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||
<i class="fa fa-flag-o"></i>
|
||||
<span class="label label-danger">9</span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li class="header">You have 9 tasks</li>
|
||||
<li>
|
||||
<!-- inner menu: contains the actual data -->
|
||||
<ul class="menu">
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Design some buttons
|
||||
<small class="pull-right">20%</small>
|
||||
</h3>
|
||||
<div class="progress progress-xs">
|
||||
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">20% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Create a nice theme
|
||||
<small class="pull-right">40%</small>
|
||||
</h3>
|
||||
<div class="progress progress-xs">
|
||||
<div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">40% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Some task I need to do
|
||||
<small class="pull-right">60%</small>
|
||||
</h3>
|
||||
<div class="progress progress-xs">
|
||||
<div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">60% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
<li><!-- Task item -->
|
||||
<a href="#">
|
||||
<h3>
|
||||
Make beautiful transitions
|
||||
<small class="pull-right">80%</small>
|
||||
</h3>
|
||||
<div class="progress progress-xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
||||
<span class="sr-only">80% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li><!-- end task item -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="footer">
|
||||
<a href="#">View all tasks</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- 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"/>
|
||||
<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" />
|
||||
<p>
|
||||
Alexander Pierce - Web Developer
|
||||
<small>Member since Nov. 2012</small>
|
||||
</p>
|
||||
</li>
|
||||
<!-- Menu Body -->
|
||||
<li class="user-body">
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Followers</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Sales</a>
|
||||
</div>
|
||||
<div class="col-xs-4 text-center">
|
||||
<a href="#">Friends</a>
|
||||
</div>
|
||||
</li>
|
||||
<!-- Menu Footer-->
|
||||
<li class="user-footer">
|
||||
<div class="pull-left">
|
||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<a href="#" class="btn btn-default btn-flat">Sign out</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Control Sidebar Toggle Button -->
|
||||
<li>
|
||||
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<!-- Left side column. contains the logo and sidebar -->
|
||||
<aside class="main-sidebar">
|
||||
<!-- sidebar: style can be found in sidebar.less -->
|
||||
<section class="sidebar">
|
||||
<!-- Sidebar user panel -->
|
||||
<div class="user-panel">
|
||||
<div class="pull-left image">
|
||||
<img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image" />
|
||||
</div>
|
||||
<div class="pull-left info">
|
||||
<p>Alexander Pierce</p>
|
||||
|
||||
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<form action="#" method="get" class="sidebar-form">
|
||||
<div class="input-group">
|
||||
<input type="text" name="q" class="form-control" placeholder="Search..."/>
|
||||
<span class="input-group-btn">
|
||||
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /.search form -->
|
||||
<!-- sidebar menu: : style can be found in sidebar.less -->
|
||||
<ul class="sidebar-menu">
|
||||
<li class="header">MAIN NAVIGATION</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-dashboard"></i> <span>Dashboard</span> <i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
|
||||
<li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-files-o"></i>
|
||||
<span>Layout Options</span>
|
||||
<span class="label label-primary pull-right">4</span>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
|
||||
<li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
|
||||
<li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
|
||||
<li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../widgets.html">
|
||||
<i class="fa fa-th"></i> <span>Widgets</span> <small class="label pull-right bg-green">new</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-pie-chart"></i>
|
||||
<span>Charts</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
|
||||
<li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
|
||||
<li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
|
||||
<li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-laptop"></i>
|
||||
<span>UI Elements</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
|
||||
<li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
|
||||
<li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
|
||||
<li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
|
||||
<li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
|
||||
<li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-edit"></i> <span>Forms</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
|
||||
<li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
|
||||
<li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview active">
|
||||
<a href="#">
|
||||
<i class="fa fa-table"></i> <span>Tables</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li class="active"><a href="simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
|
||||
<li><a href="data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../calendar.html">
|
||||
<i class="fa fa-calendar"></i> <span>Calendar</span>
|
||||
<small class="label pull-right bg-red">3</small>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../mailbox/mailbox.html">
|
||||
<i class="fa fa-envelope"></i> <span>Mailbox</span>
|
||||
<small class="label pull-right bg-yellow">12</small>
|
||||
</a>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-folder"></i> <span>Examples</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
|
||||
<li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
|
||||
<li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
|
||||
<li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
|
||||
<li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
|
||||
<li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
|
||||
<li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="treeview">
|
||||
<a href="#">
|
||||
<i class="fa fa-share"></i> <span>Multilevel</span>
|
||||
<i class="fa fa-angle-left pull-right"></i>
|
||||
</a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level One <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
|
||||
<li>
|
||||
<a href="#"><i class="fa fa-circle-o"></i> Level Two <i class="fa fa-angle-left pull-right"></i></a>
|
||||
<ul class="treeview-menu">
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
|
||||
<li class="header">LABELS</li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
|
||||
<li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
</aside>
|
||||
|
||||
<!-- Content Wrapper. Contains page content -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
Simple Tables
|
||||
<small>preview of simple tables</small>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
|
||||
<li><a href="#">Tables</a></li>
|
||||
<li class="active">Simple</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- Main content -->
|
||||
<section class="content">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Bordered Table</h3>
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body">
|
||||
<table class="table table-bordered">
|
||||
<tr>
|
||||
<th style="width: 10px">#</th>
|
||||
<th>Task</th>
|
||||
<th>Progress</th>
|
||||
<th style="width: 40px">Label</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1.</td>
|
||||
<td>Update software</td>
|
||||
<td>
|
||||
<div class="progress progress-xs">
|
||||
<div class="progress-bar progress-bar-danger" style="width: 55%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-red">55%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2.</td>
|
||||
<td>Clean database</td>
|
||||
<td>
|
||||
<div class="progress progress-xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 70%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-yellow">70%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3.</td>
|
||||
<td>Cron job running</td>
|
||||
<td>
|
||||
<div class="progress progress-xs progress-striped active">
|
||||
<div class="progress-bar progress-bar-primary" style="width: 30%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-light-blue">30%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4.</td>
|
||||
<td>Fix and squish bugs</td>
|
||||
<td>
|
||||
<div class="progress progress-xs progress-striped active">
|
||||
<div class="progress-bar progress-bar-success" style="width: 90%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-green">90%</span></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div><!-- /.box-body -->
|
||||
<div class="box-footer clearfix">
|
||||
<ul class="pagination pagination-sm no-margin pull-right">
|
||||
<li><a href="#">«</a></li>
|
||||
<li><a href="#">1</a></li>
|
||||
<li><a href="#">2</a></li>
|
||||
<li><a href="#">3</a></li>
|
||||
<li><a href="#">»</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- /.box -->
|
||||
|
||||
<div class="box">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Condensed Full Width Table</h3>
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body no-padding">
|
||||
<table class="table table-condensed">
|
||||
<tr>
|
||||
<th style="width: 10px">#</th>
|
||||
<th>Task</th>
|
||||
<th>Progress</th>
|
||||
<th style="width: 40px">Label</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1.</td>
|
||||
<td>Update software</td>
|
||||
<td>
|
||||
<div class="progress progress-xs">
|
||||
<div class="progress-bar progress-bar-danger" style="width: 55%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-red">55%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2.</td>
|
||||
<td>Clean database</td>
|
||||
<td>
|
||||
<div class="progress progress-xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 70%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-yellow">70%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3.</td>
|
||||
<td>Cron job running</td>
|
||||
<td>
|
||||
<div class="progress progress-xs progress-striped active">
|
||||
<div class="progress-bar progress-bar-primary" style="width: 30%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-light-blue">30%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4.</td>
|
||||
<td>Fix and squish bugs</td>
|
||||
<td>
|
||||
<div class="progress progress-xs progress-striped active">
|
||||
<div class="progress-bar progress-bar-success" style="width: 90%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-green">90%</span></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
</div><!-- /.col -->
|
||||
<div class="col-md-6">
|
||||
<div class="box">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Simple Full Width Table</h3>
|
||||
<div class="box-tools">
|
||||
<ul class="pagination pagination-sm no-margin pull-right">
|
||||
<li><a href="#">«</a></li>
|
||||
<li><a href="#">1</a></li>
|
||||
<li><a href="#">2</a></li>
|
||||
<li><a href="#">3</a></li>
|
||||
<li><a href="#">»</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body no-padding">
|
||||
<table class="table">
|
||||
<tr>
|
||||
<th style="width: 10px">#</th>
|
||||
<th>Task</th>
|
||||
<th>Progress</th>
|
||||
<th style="width: 40px">Label</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1.</td>
|
||||
<td>Update software</td>
|
||||
<td>
|
||||
<div class="progress progress-xs">
|
||||
<div class="progress-bar progress-bar-danger" style="width: 55%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-red">55%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2.</td>
|
||||
<td>Clean database</td>
|
||||
<td>
|
||||
<div class="progress progress-xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 70%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-yellow">70%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3.</td>
|
||||
<td>Cron job running</td>
|
||||
<td>
|
||||
<div class="progress progress-xs progress-striped active">
|
||||
<div class="progress-bar progress-bar-primary" style="width: 30%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-light-blue">30%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4.</td>
|
||||
<td>Fix and squish bugs</td>
|
||||
<td>
|
||||
<div class="progress progress-xs progress-striped active">
|
||||
<div class="progress-bar progress-bar-success" style="width: 90%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-green">90%</span></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
<div class="box">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Striped Full Width Table</h3>
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body no-padding">
|
||||
<table class="table table-striped">
|
||||
<tr>
|
||||
<th style="width: 10px">#</th>
|
||||
<th>Task</th>
|
||||
<th>Progress</th>
|
||||
<th style="width: 40px">Label</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1.</td>
|
||||
<td>Update software</td>
|
||||
<td>
|
||||
<div class="progress progress-xs">
|
||||
<div class="progress-bar progress-bar-danger" style="width: 55%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-red">55%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2.</td>
|
||||
<td>Clean database</td>
|
||||
<td>
|
||||
<div class="progress progress-xs">
|
||||
<div class="progress-bar progress-bar-yellow" style="width: 70%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-yellow">70%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3.</td>
|
||||
<td>Cron job running</td>
|
||||
<td>
|
||||
<div class="progress progress-xs progress-striped active">
|
||||
<div class="progress-bar progress-bar-primary" style="width: 30%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-light-blue">30%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4.</td>
|
||||
<td>Fix and squish bugs</td>
|
||||
<td>
|
||||
<div class="progress progress-xs progress-striped active">
|
||||
<div class="progress-bar progress-bar-success" style="width: 90%"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="badge bg-green">90%</span></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
</div><!-- /.col -->
|
||||
</div><!-- /.row -->
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<div class="box">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">Responsive Hover Table</h3>
|
||||
<div class="box-tools">
|
||||
<div class="input-group">
|
||||
<input type="text" name="table_search" class="form-control input-sm pull-right" style="width: 150px;" placeholder="Search"/>
|
||||
<div class="input-group-btn">
|
||||
<button class="btn btn-sm btn-default"><i class="fa fa-search"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body table-responsive no-padding">
|
||||
<table class="table table-hover">
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>User</th>
|
||||
<th>Date</th>
|
||||
<th>Status</th>
|
||||
<th>Reason</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>183</td>
|
||||
<td>John Doe</td>
|
||||
<td>11-7-2014</td>
|
||||
<td><span class="label label-success">Approved</span></td>
|
||||
<td>Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>219</td>
|
||||
<td>Alexander Pierce</td>
|
||||
<td>11-7-2014</td>
|
||||
<td><span class="label label-warning">Pending</span></td>
|
||||
<td>Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>657</td>
|
||||
<td>Bob Doe</td>
|
||||
<td>11-7-2014</td>
|
||||
<td><span class="label label-primary">Approved</span></td>
|
||||
<td>Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>175</td>
|
||||
<td>Mike Doe</td>
|
||||
<td>11-7-2014</td>
|
||||
<td><span class="label label-danger">Denied</span></td>
|
||||
<td>Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
</div>
|
||||
</div>
|
||||
</section><!-- /.content -->
|
||||
</div><!-- /.content-wrapper -->
|
||||
<footer class="main-footer">
|
||||
<div class="pull-right hidden-xs">
|
||||
<b>Version</b> 2.0
|
||||
</div>
|
||||
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
|
||||
</footer>
|
||||
|
||||
<!-- Control Sidebar -->
|
||||
<aside class="control-sidebar control-sidebar-dark">
|
||||
<!-- Create the tabs -->
|
||||
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
|
||||
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></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" id="control-sidebar-home-tab">
|
||||
<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 -->
|
||||
|
||||
<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 -->
|
||||
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
|
||||
<!-- Settings tab content -->
|
||||
<div class="tab-pane" id="control-sidebar-settings-tab">
|
||||
<form method="post">
|
||||
<h3 class="control-sidebar-heading">General Settings</h3>
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Report panel usage
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Some information about this general settings option
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Allow mail redirect
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Other sets of options are available
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-sidebar-subheading">
|
||||
Expose author name in posts
|
||||
<input type="checkbox" class="pull-right" checked />
|
||||
</label>
|
||||
<p>
|
||||
Allow the user to show his name in blog posts
|
||||
</p>
|
||||
</div><!-- /.form-group -->
|
||||
|
||||
<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
|
||||
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
|
||||
</label>
|
||||
</div><!-- /.form-group -->
|
||||
</form>
|
||||
</div><!-- /.tab-pane -->
|
||||
</div>
|
||||
</aside><!-- /.control-sidebar -->
|
||||
<!-- Add the sidebar's background. This div must be placed
|
||||
immediately after the control sidebar -->
|
||||
<div class='control-sidebar-bg'></div>
|
||||
</div><!-- ./wrapper -->
|
||||
|
||||
<!-- jQuery 2.1.4 -->
|
||||
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
|
||||
<!-- Bootstrap 3.3.2 JS -->
|
||||
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<!-- Slimscroll -->
|
||||
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
||||
<!-- FastClick -->
|
||||
<script src='../../plugins/fastclick/fastclick.min.js'></script>
|
||||
<!-- AdminLTE App -->
|
||||
<script src="../../dist/js/app.min.js" type="text/javascript"></script>
|
||||
<!-- AdminLTE for demo purposes -->
|
||||
<script src="../../dist/js/demo.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
+1230
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user