diff options
Diffstat (limited to 'public/bower_components/admin-lte/pages')
34 files changed, 32053 insertions, 0 deletions
diff --git a/public/bower_components/admin-lte/pages/UI/buttons.html b/public/bower_components/admin-lte/pages/UI/buttons.html new file mode 100644 index 0000000..3aa572a --- /dev/null +++ b/public/bower_components/admin-lte/pages/UI/buttons.html @@ -0,0 +1,1713 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Buttons</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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 class="active"><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><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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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> + Buttons + <small>Control panel</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">Buttons</li> + </ol> + </section> + + <!-- Main content --> + <section class="content"> + + <div class="row"> + <div class="col-md-12"> + <div class="box box-primary"> + <div class="box-header"> + <i class="fa fa-edit"></i> + + <h3 class="box-title">Buttons</h3> + </div> + <div class="box-body pad table-responsive"> + <p>Various types of buttons. Using the base class <code>.btn</code></p> + <table class="table table-bordered text-center"> + <tr> + <th>Normal</th> + <th>Large <code>.btn-lg</code></th> + <th>Small <code>.btn-sm</code></th> + <th>X-Small <code>.btn-xs</code></th> + <th>Flat <code>.btn-flat</code></th> + <th>Disabled <code>.disabled</code></th> + </tr> + <tr> + <td> + <button type="button" class="btn btn-block btn-default">Default</button> + </td> + <td> + <button type="button" class="btn btn-block btn-default btn-lg">Default</button> + </td> + <td> + <button type="button" class="btn btn-block btn-default btn-sm">Default</button> + </td> + <td> + <button type="button" class="btn btn-block btn-default btn-xs">Default</button> + </td> + <td> + <button type="button" class="btn btn-block btn-default btn-flat">Default</button> + </td> + <td> + <button type="button" class="btn btn-block btn-default disabled">Default</button> + </td> + </tr> + <tr> + <td> + <button type="button" class="btn btn-block btn-primary">Primary</button> + </td> + <td> + <button type="button" class="btn btn-block btn-primary btn-lg">Primary</button> + </td> + <td> + <button type="button" class="btn btn-block btn-primary btn-sm">Primary</button> + </td> + <td> + <button type="button" class="btn btn-block btn-primary btn-xs">Primary</button> + </td> + <td> + <button type="button" class="btn btn-block btn-primary btn-flat">Primary</button> + </td> + <td> + <button type="button" class="btn btn-block btn-primary disabled">Primary</button> + </td> + </tr> + <tr> + <td> + <button type="button" class="btn btn-block btn-success">Success</button> + </td> + <td> + <button type="button" class="btn btn-block btn-success btn-lg">Success</button> + </td> + <td> + <button type="button" class="btn btn-block btn-success btn-sm">Success</button> + </td> + <td> + <button type="button" class="btn btn-block btn-success btn-xs">Success</button> + </td> + <td> + <button type="button" class="btn btn-block btn-success btn-flat">Success</button> + </td> + <td> + <button type="button" class="btn btn-block btn-success disabled">Success</button> + </td> + </tr> + <tr> + <td> + <button type="button" class="btn btn-block btn-info">Info</button> + </td> + <td> + <button type="button" class="btn btn-block btn-info btn-lg">Info</button> + </td> + <td> + <button type="button" class="btn btn-block btn-info btn-sm">Info</button> + </td> + <td> + <button type="button" class="btn btn-block btn-info btn-xs">Info</button> + </td> + <td> + <button type="button" class="btn btn-block btn-info btn-flat">Info</button> + </td> + <td> + <button type="button" class="btn btn-block btn-info disabled">Info</button> + </td> + </tr> + <tr> + <td> + <button type="button" class="btn btn-block btn-danger">Danger</button> + </td> + <td> + <button type="button" class="btn btn-block btn-danger btn-lg">Danger</button> + </td> + <td> + <button type="button" class="btn btn-block btn-danger btn-sm">Danger</button> + </td> + <td> + <button type="button" class="btn btn-block btn-danger btn-xs">Danger</button> + </td> + <td> + <button type="button" class="btn btn-block btn-danger btn-flat">Danger</button> + </td> + <td> + <button type="button" class="btn btn-block btn-danger disabled">Danger</button> + </td> + </tr> + <tr> + <td> + <button type="button" class="btn btn-block btn-warning">Warning</button> + </td> + <td> + <button type="button" class="btn btn-block btn-warning btn-lg">Warning</button> + </td> + <td> + <button type="button" class="btn btn-block btn-warning btn-sm">Warning</button> + </td> + <td> + <button type="button" class="btn btn-block btn-warning btn-xs">Warning</button> + </td> + <td> + <button type="button" class="btn btn-block btn-warning btn-flat">Warning</button> + </td> + <td> + <button type="button" class="btn btn-block btn-warning disabled">Warning</button> + </td> + </tr> + </table> + </div> + <!-- /.box --> + </div> + </div> + <!-- /.col --> + </div> + <!-- ./row --> + <div class="row"> + <div class="col-md-6"> + <!-- Block buttons --> + <div class="box"> + <div class="box-header"> + <h3 class="box-title">Block Buttons</h3> + </div> + <div class="box-body"> + <button type="button" class="btn btn-default btn-block">.btn-block</button> + <button type="button" class="btn btn-default btn-block btn-flat">.btn-block .btn-flat</button> + <button type="button" class="btn btn-default btn-block btn-sm">.btn-block .btn-sm</button> + </div> + </div> + <!-- /.box --> + + <!-- Horizontal grouping --> + <div class="box"> + <div class="box-header"> + <h3 class="box-title">Horizontal Button Group</h3> + </div> + <div class="box-body table-responsive pad"> + <p> + Horizontal button groups are easy to create with bootstrap. Just add your buttons + inside <code><div class="btn-group"></div></code> + </p> + + <table class="table table-bordered"> + <tr> + <th>Button</th> + <th>Icons</th> + <th>Flat</th> + <th>Dropdown</th> + </tr> + <!-- Default --> + <tr> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-default">Left</button> + <button type="button" class="btn btn-default">Middle</button> + <button type="button" class="btn btn-default">Right</button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-default"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-default"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-default"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-default btn-flat"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-default btn-flat"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-default btn-flat"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-default">1</button> + <button type="button" class="btn btn-default">2</button> + + <div class="btn-group"> + <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + <li><a href="#">Dropdown link</a></li> + <li><a href="#">Dropdown link</a></li> + </ul> + </div> + </div> + </td> + </tr> + <!-- ./default --> + <!-- Info --> + <tr> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-info">Left</button> + <button type="button" class="btn btn-info">Middle</button> + <button type="button" class="btn btn-info">Right</button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-info"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-info"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-info"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-info btn-flat"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-info btn-flat"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-info btn-flat"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-info">1</button> + <button type="button" class="btn btn-info">2</button> + + <div class="btn-group"> + <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + <li><a href="#">Dropdown link</a></li> + <li><a href="#">Dropdown link</a></li> + </ul> + </div> + </div> + </td> + </tr> + <!-- /. info --> + <!-- /.danger --> + <tr> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-danger">Left</button> + <button type="button" class="btn btn-danger">Middle</button> + <button type="button" class="btn btn-danger">Right</button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-danger"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-danger"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-danger"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-danger btn-flat"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-danger btn-flat"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-danger btn-flat"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-danger">1</button> + <button type="button" class="btn btn-danger">2</button> + + <div class="btn-group"> + <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + <li><a href="#">Dropdown link</a></li> + <li><a href="#">Dropdown link</a></li> + </ul> + </div> + </div> + </td> + </tr> + <!-- /.danger --> + <!-- warning --> + <tr> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-warning">Left</button> + <button type="button" class="btn btn-warning">Middle</button> + <button type="button" class="btn btn-warning">Right</button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-warning"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-warning"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-warning"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-warning btn-flat"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-warning btn-flat"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-warning btn-flat"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-warning">1</button> + <button type="button" class="btn btn-warning">2</button> + + <div class="btn-group"> + <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + <li><a href="#">Dropdown link</a></li> + <li><a href="#">Dropdown link</a></li> + </ul> + </div> + </div> + </td> + </tr> + <!-- /.warning --> + <!-- success --> + <tr> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-success">Left</button> + <button type="button" class="btn btn-success">Middle</button> + <button type="button" class="btn btn-success">Right</button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-success"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-success"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-success"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-success btn-flat"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-success btn-flat"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-success btn-flat"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group"> + <button type="button" class="btn btn-success">1</button> + <button type="button" class="btn btn-success">2</button> + + <div class="btn-group"> + <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + <li><a href="#">Dropdown link</a></li> + <li><a href="#">Dropdown link</a></li> + </ul> + </div> + </div> + </td> + </tr> + <!-- /.success --> + </table> + </div> + </div> + <!-- /.box --> + + <div class="box"> + <div class="box-header"> + <h3 class="box-title">Button Addon</h3> + </div> + <div class="box-body"> + <p>With dropdown</p> + + <div class="input-group margin"> + <div class="input-group-btn"> + <button type="button" class="btn btn-default 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>Normal</p> + + <div class="input-group margin"> + <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>Flat</p> + + <div class="input-group margin"> + <input type="text" class="form-control"> + <span class="input-group-btn"> + <button type="button" class="btn btn-info btn-flat">Go!</button> + </span> + </div> + <!-- /input-group --> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + <!-- split buttons box --> + <div class="box"> + <div class="box-header"> + <h3 class="box-title">Split buttons</h3> + </div> + <div class="box-body"> + <!-- Split button --> + <p>Normal split buttons:</p> + + <div class="margin"> + <div class="btn-group"> + <button type="button" class="btn btn-default">Action</button> + <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + <span class="sr-only">Toggle Dropdown</span> + </button> + <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> + </ul> + </div> + <div class="btn-group"> + <button type="button" class="btn btn-info">Action</button> + <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + <span class="sr-only">Toggle Dropdown</span> + </button> + <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> + </ul> + </div> + <div class="btn-group"> + <button type="button" class="btn btn-danger">Action</button> + <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + <span class="sr-only">Toggle Dropdown</span> + </button> + <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> + </ul> + </div> + <div class="btn-group"> + <button type="button" class="btn btn-success">Action</button> + <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + <span class="sr-only">Toggle Dropdown</span> + </button> + <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> + </ul> + </div> + <div class="btn-group"> + <button type="button" class="btn btn-warning">Action</button> + <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + <span class="sr-only">Toggle Dropdown</span> + </button> + <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> + </ul> + </div> + </div> + <!-- flat split buttons --> + <p>Flat split buttons:</p> + + <div class="margin"> + <div class="btn-group"> + <button type="button" class="btn btn-default btn-flat">Action</button> + <button type="button" class="btn btn-default btn-flat dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + <span class="sr-only">Toggle Dropdown</span> + </button> + <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> + </ul> + </div> + <div class="btn-group"> + <button type="button" class="btn btn-info btn-flat">Action</button> + <button type="button" class="btn btn-info btn-flat dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + <span class="sr-only">Toggle Dropdown</span> + </button> + <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> + </ul> + </div> + <div class="btn-group"> + <button type="button" class="btn btn-danger btn-flat">Action</button> + <button type="button" class="btn btn-danger btn-flat dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + <span class="sr-only">Toggle Dropdown</span> + </button> + <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> + </ul> + </div> + <div class="btn-group"> + <button type="button" class="btn btn-success btn-flat">Action</button> + <button type="button" class="btn btn-success btn-flat dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + <span class="sr-only">Toggle Dropdown</span> + </button> + <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> + </ul> + </div> + <div class="btn-group"> + <button type="button" class="btn btn-warning btn-flat">Action</button> + <button type="button" class="btn btn-warning btn-flat dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + <span class="sr-only">Toggle Dropdown</span> + </button> + <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> + </ul> + </div> + </div> + </div> + <!-- /.box-body --> + </div> + <!-- end split buttons box --> + + <!-- social buttons --> + <div class="box"> + <div class="box-header"> + <h3 class="box-title">Social Buttons (By <a href="https://github.com/lipis/bootstrap-social">Lipis</a>) + </h3> + </div> + <div class="box-body"> + <a class="btn btn-block btn-social btn-bitbucket"> + <i class="fa fa-bitbucket"></i> Sign in with Bitbucket + </a> + <a class="btn btn-block btn-social btn-dropbox"> + <i class="fa fa-dropbox"></i> Sign in with Dropbox + </a> + <a class="btn btn-block btn-social btn-facebook"> + <i class="fa fa-facebook"></i> Sign in with Facebook + </a> + <a class="btn btn-block btn-social btn-flickr"> + <i class="fa fa-flickr"></i> Sign in with Flickr + </a> + <a class="btn btn-block btn-social btn-foursquare"> + <i class="fa fa-foursquare"></i> Sign in with Foursquare + </a> + <a class="btn btn-block btn-social btn-github"> + <i class="fa fa-github"></i> Sign in with GitHub + </a> + <a class="btn btn-block btn-social btn-google"> + <i class="fa fa-google-plus"></i> Sign in with Google + </a> + <a class="btn btn-block btn-social btn-instagram"> + <i class="fa fa-instagram"></i> Sign in with Instagram + </a> + <a class="btn btn-block btn-social btn-linkedin"> + <i class="fa fa-linkedin"></i> Sign in with LinkedIn + </a> + <a class="btn btn-block btn-social btn-tumblr"> + <i class="fa fa-tumblr"></i> Sign in with Tumblr + </a> + <a class="btn btn-block btn-social btn-twitter"> + <i class="fa fa-twitter"></i> Sign in with Twitter + </a> + <a class="btn btn-block btn-social btn-vk"> + <i class="fa fa-vk"></i> Sign in with VK + </a> + <br> + + <div class="text-center"> + <a class="btn btn-social-icon btn-bitbucket"><i class="fa fa-bitbucket"></i></a> + <a class="btn btn-social-icon btn-dropbox"><i class="fa fa-dropbox"></i></a> + <a class="btn btn-social-icon btn-facebook"><i class="fa fa-facebook"></i></a> + <a class="btn btn-social-icon btn-flickr"><i class="fa fa-flickr"></i></a> + <a class="btn btn-social-icon btn-foursquare"><i class="fa fa-foursquare"></i></a> + <a class="btn btn-social-icon btn-github"><i class="fa fa-github"></i></a> + <a class="btn btn-social-icon btn-google"><i class="fa fa-google-plus"></i></a> + <a class="btn btn-social-icon btn-instagram"><i class="fa fa-instagram"></i></a> + <a class="btn btn-social-icon btn-linkedin"><i class="fa fa-linkedin"></i></a> + <a class="btn btn-social-icon btn-tumblr"><i class="fa fa-tumblr"></i></a> + <a class="btn btn-social-icon btn-twitter"><i class="fa fa-twitter"></i></a> + <a class="btn btn-social-icon btn-vk"><i class="fa fa-vk"></i></a> + </div> + </div> + </div> + <!-- /.box --> + + </div> + <!-- /.col --> + <div class="col-md-6"> + <!-- Application buttons --> + <div class="box"> + <div class="box-header"> + <h3 class="box-title">Application Buttons</h3> + </div> + <div class="box-body"> + <p>Add the classes <code>.btn.btn-app</code> to an <code><a></code> tag to achieve the following:</p> + <a class="btn btn-app"> + <i class="fa fa-edit"></i> Edit + </a> + <a class="btn btn-app"> + <i class="fa fa-play"></i> Play + </a> + <a class="btn btn-app"> + <i class="fa fa-repeat"></i> Repeat + </a> + <a class="btn btn-app"> + <i class="fa fa-pause"></i> Pause + </a> + <a class="btn btn-app"> + <i class="fa fa-save"></i> Save + </a> + <a class="btn btn-app"> + <span class="badge bg-yellow">3</span> + <i class="fa fa-bullhorn"></i> Notifications + </a> + <a class="btn btn-app"> + <span class="badge bg-green">300</span> + <i class="fa fa-barcode"></i> Products + </a> + <a class="btn btn-app"> + <span class="badge bg-purple">891</span> + <i class="fa fa-users"></i> Users + </a> + <a class="btn btn-app"> + <span class="badge bg-teal">67</span> + <i class="fa fa-inbox"></i> Orders + </a> + <a class="btn btn-app"> + <span class="badge bg-aqua">12</span> + <i class="fa fa-envelope"></i> Inbox + </a> + <a class="btn btn-app"> + <span class="badge bg-red">531</span> + <i class="fa fa-heart-o"></i> Likes + </a> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + <!-- Various colors --> + <div class="box"> + <div class="box-header"> + <h3 class="box-title">Different colors</h3> + </div> + <div class="box-body"> + <p>Mix and match with various background colors. Use base class <code>.btn</code> and add any available + <code>.bg-*</code> class</p> + <!-- You may notice a .margin class added + here but that's only to make the content + display correctly without having to use a table--> + <p> + <button type="button" class="btn bg-maroon btn-flat margin">.btn.bg-maroon.btn-flat</button> + <button type="button" class="btn bg-purple btn-flat margin">.btn.bg-purple.btn-flat</button> + <button type="button" class="btn bg-navy btn-flat margin">.btn.bg-navy.btn-flat</button> + <button type="button" class="btn bg-orange btn-flat margin">.btn.bg-orange.btn-flat</button> + <button type="button" class="btn bg-olive btn-flat margin">.btn.bg-olive.btn-flat</button> + </p> + + <p> + <button type="button" class="btn bg-maroon margin">.btn.bg-maroon</button> + <button type="button" class="btn bg-purple margin">.btn.bg-purple</button> + <button type="button" class="btn bg-navy margin">.btn.bg-navy</button> + <button type="button" class="btn bg-orange margin">.btn.bg-orange</button> + <button type="button" class="btn bg-olive margin">.btn.bg-olive</button> + </p> + </div> + </div> + <!-- /.box --> + + <!-- Vertical grouping --> + <div class="box"> + <div class="box-header"> + <h3 class="box-title">Vertical Button Group</h3> + </div> + <div class="box-body table-responsive pad"> + + <p> + Vertical button groups are easy to create with bootstrap. Just add your buttons + inside <code><div class="btn-group-vertical"></div></code> + </p> + + <table class="table table-bordered"> + <tr> + <th>Button</th> + <th>Icons</th> + <th>Flat</th> + <th>Dropdown</th> + </tr> + <!-- Default --> + <tr> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-default">Top</button> + <button type="button" class="btn btn-default">Middle</button> + <button type="button" class="btn btn-default">Bottom</button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-default"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-default"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-default"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-default btn-flat"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-default btn-flat"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-default btn-flat"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-default">1</button> + <button type="button" class="btn btn-default">2</button> + + <div class="btn-group"> + <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + <li><a href="#">Dropdown link</a></li> + <li><a href="#">Dropdown link</a></li> + </ul> + </div> + </div> + </td> + </tr> + <!-- ./default --> + <!-- Info --> + <tr> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-info">Top</button> + <button type="button" class="btn btn-info">Middle</button> + <button type="button" class="btn btn-info">Bottom</button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-info"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-info"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-info"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-info btn-flat"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-info btn-flat"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-info btn-flat"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-info">1</button> + <button type="button" class="btn btn-info">2</button> + + <div class="btn-group"> + <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + <li><a href="#">Dropdown link</a></li> + <li><a href="#">Dropdown link</a></li> + </ul> + </div> + </div> + </td> + </tr> + <!-- /. info --> + <!-- /.danger --> + <tr> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-danger">Top</button> + <button type="button" class="btn btn-danger">Middle</button> + <button type="button" class="btn btn-danger">Bottom</button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-danger"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-danger"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-danger"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-danger btn-flat"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-danger btn-flat"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-danger btn-flat"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-danger">1</button> + <button type="button" class="btn btn-danger">2</button> + + <div class="btn-group"> + <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + <li><a href="#">Dropdown link</a></li> + <li><a href="#">Dropdown link</a></li> + </ul> + </div> + </div> + </td> + </tr> + <!-- /.danger --> + <!-- warning --> + <tr> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-warning">Top</button> + <button type="button" class="btn btn-warning">Middle</button> + <button type="button" class="btn btn-warning">Bottom</button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-warning"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-warning"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-warning"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-warning btn-flat"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-warning btn-flat"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-warning btn-flat"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-warning">1</button> + <button type="button" class="btn btn-warning">2</button> + + <div class="btn-group"> + <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + <li><a href="#">Dropdown link</a></li> + <li><a href="#">Dropdown link</a></li> + </ul> + </div> + </div> + </td> + </tr> + <!-- /.warning --> + <!-- success --> + <tr> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-success">Top</button> + <button type="button" class="btn btn-success">Middle</button> + <button type="button" class="btn btn-success">Bottom</button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-success"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-success"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-success"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-success btn-flat"><i class="fa fa-align-left"></i></button> + <button type="button" class="btn btn-success btn-flat"><i class="fa fa-align-center"></i></button> + <button type="button" class="btn btn-success btn-flat"><i class="fa fa-align-right"></i></button> + </div> + </td> + <td> + <div class="btn-group-vertical"> + <button type="button" class="btn btn-success">1</button> + <button type="button" class="btn btn-success">2</button> + + <div class="btn-group"> + <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown"> + <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + <li><a href="#">Dropdown link</a></li> + <li><a href="#">Dropdown link</a></li> + </ul> + </div> + </div> + </td> + </tr> + <!-- /.success --> + </table> + </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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/UI/general.html b/public/bower_components/admin-lte/pages/UI/general.html new file mode 100644 index 0000000..e6d6695 --- /dev/null +++ b/public/bower_components/admin-lte/pages/UI/general.html @@ -0,0 +1,1661 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | General UI</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> + <style> + .color-palette { + height: 35px; + line-height: 35px; + text-align: center; + } + + .color-palette-set { + margin-bottom: 15px; + } + + .color-palette span { + display: none; + font-size: 12px; + } + + .color-palette:hover span { + display: block; + } + + .color-palette-box h4 { + position: absolute; + top: 100%; + left: 25px; + margin-top: -40px; + color: rgba(255, 255, 255, 0.8); + font-size: 12px; + display: block; + z-index: 7; + } + </style> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li class="active"><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><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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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 UI + <small>Preview of UI elements</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">General</li> + </ol> + </section> + + <!-- Main content --> + <section class="content"> + <!-- COLOR PALETTE --> + <div class="box box-default color-palette-box"> + <div class="box-header with-border"> + <h3 class="box-title"><i class="fa fa-tag"></i> Color Palette</h3> + </div> + <div class="box-body"> + <div class="row"> + <div class="col-sm-4 col-md-2"> + <h4 class="text-center">Primary</h4> + + <div class="color-palette-set"> + <div class="bg-light-blue disabled color-palette"><span>Disabled</span></div> + <div class="bg-light-blue color-palette"><span>#3c8dbc</span></div> + <div class="bg-light-blue-active color-palette"><span>Active</span></div> + </div> + </div> + <!-- /.col --> + <div class="col-sm-4 col-md-2"> + <h4 class="text-center">Info</h4> + + <div class="color-palette-set"> + <div class="bg-aqua disabled color-palette"><span>Disabled</span></div> + <div class="bg-aqua color-palette"><span>#00c0ef</span></div> + <div class="bg-aqua-active color-palette"><span>Active</span></div> + </div> + </div> + <!-- /.col --> + <div class="col-sm-4 col-md-2"> + <h4 class="text-center">Success</h4> + + <div class="color-palette-set"> + <div class="bg-green disabled color-palette"><span>Disabled</span></div> + <div class="bg-green color-palette"><span>#00a65a</span></div> + <div class="bg-green-active color-palette"><span>Active</span></div> + </div> + </div> + <!-- /.col --> + <div class="col-sm-4 col-md-2"> + <h4 class="text-center">Warning</h4> + + <div class="color-palette-set"> + <div class="bg-yellow disabled color-palette"><span>Disabled</span></div> + <div class="bg-yellow color-palette"><span>#f39c12</span></div> + <div class="bg-yellow-active color-palette"><span>Active</span></div> + </div> + </div> + <!-- /.col --> + <div class="col-sm-4 col-md-2"> + <h4 class="text-center">Danger</h4> + + <div class="color-palette-set"> + <div class="bg-red disabled color-palette"><span>Disabled</span></div> + <div class="bg-red color-palette"><span>#f56954</span></div> + <div class="bg-red-active color-palette"><span>Active</span></div> + </div> + </div> + <!-- /.col --> + <div class="col-sm-4 col-md-2"> + <h4 class="text-center">Gray</h4> + + <div class="color-palette-set"> + <div class="bg-gray disabled color-palette"><span>Disabled</span></div> + <div class="bg-gray color-palette"><span>#d2d6de</span></div> + <div class="bg-gray-active color-palette"><span>Active</span></div> + </div> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + <div class="row"> + <div class="col-sm-4 col-md-2"> + <h4 class="text-center">Navy</h4> + + <div class="color-palette-set"> + <div class="bg-navy disabled color-palette"><span>Disabled</span></div> + <div class="bg-navy color-palette"><span>#001F3F</span></div> + <div class="bg-navy-active color-palette"><span>Active</span></div> + </div> + </div> + <!-- /.col --> + <div class="col-sm-4 col-md-2"> + <h4 class="text-center">Teal</h4> + + <div class="color-palette-set"> + <div class="bg-teal disabled color-palette"><span>Disabled</span></div> + <div class="bg-teal color-palette"><span>#39CCCC</span></div> + <div class="bg-teal-active color-palette"><span>Active</span></div> + </div> + </div> + <!-- /.col --> + <div class="col-sm-4 col-md-2"> + <h4 class="text-center">Purple</h4> + + <div class="color-palette-set"> + <div class="bg-purple disabled color-palette"><span>Disabled</span></div> + <div class="bg-purple color-palette"><span>#605ca8</span></div> + <div class="bg-purple-active color-palette"><span>Active</span></div> + </div> + </div> + <!-- /.col --> + <div class="col-sm-4 col-md-2"> + <h4 class="text-center">Orange</h4> + + <div class="color-palette-set"> + <div class="bg-orange disabled color-palette"><span>Disabled</span></div> + <div class="bg-orange color-palette"><span>#ff851b</span></div> + <div class="bg-orange-active color-palette"><span>Active</span></div> + </div> + </div> + <!-- /.col --> + <div class="col-sm-4 col-md-2"> + <h4 class="text-center">Maroon</h4> + + <div class="color-palette-set"> + <div class="bg-maroon disabled color-palette"><span>Disabled</span></div> + <div class="bg-maroon color-palette"><span>#D81B60</span></div> + <div class="bg-maroon-active color-palette"><span>Active</span></div> + </div> + </div> + <!-- /.col --> + <div class="col-sm-4 col-md-2"> + <h4 class="text-center">Black</h4> + + <div class="color-palette-set"> + <div class="bg-black disabled color-palette"><span>Disabled</span></div> + <div class="bg-black color-palette"><span>#111111</span></div> + <div class="bg-black-active color-palette"><span>Active</span></div> + </div> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + <!-- START ALERTS AND CALLOUTS --> + <h2 class="page-header">Alerts and Callouts</h2> + + <div class="row"> + <div class="col-md-6"> + <div class="box box-default"> + <div class="box-header with-border"> + <i class="fa fa-warning"></i> + + <h3 class="box-title">Alerts</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <div class="alert alert-danger alert-dismissible"> + <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> + <h4><i class="icon fa fa-ban"></i> Alert!</h4> + Danger alert preview. This alert is dismissable. A wonderful serenity has taken possession of my entire + soul, like these sweet mornings of spring which I enjoy with my whole heart. + </div> + <div class="alert alert-info alert-dismissible"> + <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> + <h4><i class="icon fa fa-info"></i> Alert!</h4> + Info alert preview. This alert is dismissable. + </div> + <div class="alert alert-warning alert-dismissible"> + <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> + <h4><i class="icon fa fa-warning"></i> Alert!</h4> + Warning alert preview. This alert is dismissable. + </div> + <div class="alert alert-success alert-dismissible"> + <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> + <h4><i class="icon fa fa-check"></i> Alert!</h4> + Success alert preview. This alert is dismissable. + </div> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + + <div class="col-md-6"> + <div class="box box-default"> + <div class="box-header with-border"> + <i class="fa fa-bullhorn"></i> + + <h3 class="box-title">Callouts</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <div class="callout callout-danger"> + <h4>I am a danger callout!</h4> + + <p>There is a problem that we need to fix. A wonderful serenity has taken possession of my entire soul, + like these sweet mornings of spring which I enjoy with my whole heart.</p> + </div> + <div class="callout callout-info"> + <h4>I am an info callout!</h4> + + <p>Follow the steps to continue to payment.</p> + </div> + <div class="callout callout-warning"> + <h4>I am a warning callout!</h4> + + <p>This is a yellow callout.</p> + </div> + <div class="callout callout-success"> + <h4>I am a success callout!</h4> + + <p>This is a green callout.</p> + </div> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + <!-- END ALERTS AND CALLOUTS --> + <!-- START CUSTOM TABS --> + <h2 class="page-header">AdminLTE Custom Tabs</h2> + + <div class="row"> + <div class="col-md-6"> + <!-- Custom Tabs --> + <div class="nav-tabs-custom"> + <ul class="nav nav-tabs"> + <li class="active"><a href="#tab_1" data-toggle="tab">Tab 1</a></li> + <li><a href="#tab_2" data-toggle="tab">Tab 2</a></li> + <li><a href="#tab_3" data-toggle="tab">Tab 3</a></li> + <li class="dropdown"> + <a class="dropdown-toggle" data-toggle="dropdown" href="#"> + Dropdown <span class="caret"></span> + </a> + <ul class="dropdown-menu"> + <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li> + <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li> + <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li> + <li role="presentation" class="divider"></li> + <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li> + </ul> + </li> + <li class="pull-right"><a href="#" class="text-muted"><i class="fa fa-gear"></i></a></li> + </ul> + <div class="tab-content"> + <div class="tab-pane active" id="tab_1"> + <b>How to use:</b> + + <p>Exactly like the original bootstrap tabs except you should use + the custom wrapper <code>.nav-tabs-custom</code> to achieve this style.</p> + A wonderful serenity has taken possession of my entire soul, + like these sweet mornings of spring which I enjoy with my whole heart. + I am alone, and feel the charm of existence in this spot, + which was created for the bliss of souls like mine. I am so happy, + my dear friend, so absorbed in the exquisite sense of mere tranquil existence, + that I neglect my talents. I should be incapable of drawing a single stroke + at the present moment; and yet I feel that I never was a greater artist than now. + </div> + <!-- /.tab-pane --> + <div class="tab-pane" id="tab_2"> + The European languages are members of the same family. Their separate existence is a myth. + For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ + in their grammar, their pronunciation and their most common words. Everyone realizes why a + new common language would be desirable: one could refuse to pay expensive translators. To + achieve this, it would be necessary to have uniform grammar, pronunciation and more common + words. If several languages coalesce, the grammar of the resulting language is more simple + and regular than that of the individual languages. + </div> + <!-- /.tab-pane --> + <div class="tab-pane" id="tab_3"> + Lorem Ipsum is simply dummy text of the printing and typesetting industry. + Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, + when an unknown printer took a galley of type and scrambled it to make a type specimen book. + It has survived not only five centuries, but also the leap into electronic typesetting, + remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset + sheets containing Lorem Ipsum passages, and more recently with desktop publishing software + like Aldus PageMaker including versions of Lorem Ipsum. + </div> + <!-- /.tab-pane --> + </div> + <!-- /.tab-content --> + </div> + <!-- nav-tabs-custom --> + </div> + <!-- /.col --> + + <div class="col-md-6"> + <!-- Custom Tabs (Pulled to the right) --> + <div class="nav-tabs-custom"> + <ul class="nav nav-tabs pull-right"> + <li class="active"><a href="#tab_1-1" data-toggle="tab">Tab 1</a></li> + <li><a href="#tab_2-2" data-toggle="tab">Tab 2</a></li> + <li><a href="#tab_3-2" data-toggle="tab">Tab 3</a></li> + <li class="dropdown"> + <a class="dropdown-toggle" data-toggle="dropdown" href="#"> + Dropdown <span class="caret"></span> + </a> + <ul class="dropdown-menu"> + <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li> + <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li> + <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li> + <li role="presentation" class="divider"></li> + <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li> + </ul> + </li> + <li class="pull-left header"><i class="fa fa-th"></i> Custom Tabs</li> + </ul> + <div class="tab-content"> + <div class="tab-pane active" id="tab_1-1"> + <b>How to use:</b> + + <p>Exactly like the original bootstrap tabs except you should use + the custom wrapper <code>.nav-tabs-custom</code> to achieve this style.</p> + A wonderful serenity has taken possession of my entire soul, + like these sweet mornings of spring which I enjoy with my whole heart. + I am alone, and feel the charm of existence in this spot, + which was created for the bliss of souls like mine. I am so happy, + my dear friend, so absorbed in the exquisite sense of mere tranquil existence, + that I neglect my talents. I should be incapable of drawing a single stroke + at the present moment; and yet I feel that I never was a greater artist than now. + </div> + <!-- /.tab-pane --> + <div class="tab-pane" id="tab_2-2"> + The European languages are members of the same family. Their separate existence is a myth. + For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ + in their grammar, their pronunciation and their most common words. Everyone realizes why a + new common language would be desirable: one could refuse to pay expensive translators. To + achieve this, it would be necessary to have uniform grammar, pronunciation and more common + words. If several languages coalesce, the grammar of the resulting language is more simple + and regular than that of the individual languages. + </div> + <!-- /.tab-pane --> + <div class="tab-pane" id="tab_3-2"> + Lorem Ipsum is simply dummy text of the printing and typesetting industry. + Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, + when an unknown printer took a galley of type and scrambled it to make a type specimen book. + It has survived not only five centuries, but also the leap into electronic typesetting, + remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset + sheets containing Lorem Ipsum passages, and more recently with desktop publishing software + like Aldus PageMaker including versions of Lorem Ipsum. + </div> + <!-- /.tab-pane --> + </div> + <!-- /.tab-content --> + </div> + <!-- nav-tabs-custom --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + <!-- END CUSTOM TABS --> + <!-- START PROGRESS BARS --> + <h2 class="page-header">Progress Bars</h2> + + <div class="row"> + <div class="col-md-6"> + <div class="box box-solid"> + <div class="box-header with-border"> + <h3 class="box-title">Progress Bars Different Sizes</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <p><code>.progress</code></p> + + <div class="progress"> + <div class="progress-bar progress-bar-primary progress-bar-striped" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%"> + <span class="sr-only">40% Complete (success)</span> + </div> + </div> + <p>Class: <code>.sm</code></p> + + <div class="progress progress-sm active"> + <div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%"> + <span class="sr-only">20% Complete</span> + </div> + </div> + <p>Class: <code>.xs</code></p> + + <div class="progress progress-xs"> + <div class="progress-bar progress-bar-warning progress-bar-striped" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%"> + <span class="sr-only">60% Complete (warning)</span> + </div> + </div> + <p>Class: <code>.xxs</code></p> + + <div class="progress progress-xxs"> + <div class="progress-bar progress-bar-danger progress-bar-striped" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%"> + <span class="sr-only">60% Complete (warning)</span> + </div> + </div> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col (left) --> + <div class="col-md-6"> + <div class="box box-solid"> + <div class="box-header with-border"> + <h3 class="box-title">Progress bars</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <div class="progress"> + <div class="progress-bar progress-bar-green" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%"> + <span class="sr-only">40% Complete (success)</span> + </div> + </div> + <div class="progress"> + <div class="progress-bar progress-bar-aqua" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%"> + <span class="sr-only">20% Complete</span> + </div> + </div> + <div class="progress"> + <div class="progress-bar progress-bar-yellow" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%"> + <span class="sr-only">60% Complete (warning)</span> + </div> + </div> + <div class="progress"> + <div class="progress-bar progress-bar-red" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%"> + <span class="sr-only">80% Complete</span> + </div> + </div> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col (right) --> + </div> + <!-- /.row --> + <div class="row"> + <div class="col-md-6"> + <div class="box box-solid"> + <div class="box-header with-border"> + <h3 class="box-title">Vertical Progress Bars Different Sizes</h3> + </div> + <!-- /.box-header --> + <div class="box-body text-center"> + <p>By adding the class <code>.vertical</code> and <code>.progress-sm</code>, <code>.progress-xs</code> or + <code>.progress-xxs</code> we achieve:</p> + + <div class="progress vertical active"> + <div class="progress-bar progress-bar-primary progress-bar-striped" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="height: 40%"> + <span class="sr-only">40%</span> + </div> + </div> + <div class="progress vertical progress-sm"> + <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="height: 100%"> + <span class="sr-only">100%</span> + </div> + </div> + <div class="progress vertical progress-xs"> + <div class="progress-bar progress-bar-warning progress-bar-striped" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="height: 60%"> + <span class="sr-only">60%</span> + </div> + </div> + <div class="progress vertical progress-xxs"> + <div class="progress-bar progress-bar-info progress-bar-striped" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="height: 60%"> + <span class="sr-only">60%</span> + </div> + </div> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col (left) --> + <div class="col-md-6"> + <div class="box box-solid"> + <div class="box-header with-border"> + <h3 class="box-title">Vertical Progress bars</h3> + </div> + <!-- /.box-header --> + <div class="box-body text-center"> + <p>By adding the class <code>.vertical</code> we achieve:</p> + + <div class="progress vertical"> + <div class="progress-bar progress-bar-green" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="height: 40%"> + <span class="sr-only">40%</span> + </div> + </div> + <div class="progress vertical"> + <div class="progress-bar progress-bar-aqua" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="height: 20%"> + <span class="sr-only">20%</span> + </div> + </div> + <div class="progress vertical"> + <div class="progress-bar progress-bar-yellow" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="height: 60%"> + <span class="sr-only">60%</span> + </div> + </div> + <div class="progress vertical"> + <div class="progress-bar progress-bar-red" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="height: 80%"> + <span class="sr-only">80%</span> + </div> + </div> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col (right) --> + </div> + <!-- /.row --> + <!-- END PROGRESS BARS --> + + <!-- START ACCORDION & CAROUSEL--> + <h2 class="page-header">Bootstrap Accordion & Carousel</h2> + + <div class="row"> + <div class="col-md-6"> + <div class="box box-solid"> + <div class="box-header with-border"> + <h3 class="box-title">Collapsible Accordion</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <div class="box-group" id="accordion"> + <!-- we are adding the .panel class so bootstrap.js collapse plugin detects it --> + <div class="panel box box-primary"> + <div class="box-header with-border"> + <h4 class="box-title"> + <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne"> + Collapsible Group Item #1 + </a> + </h4> + </div> + <div id="collapseOne" class="panel-collapse collapse in"> + <div class="box-body"> + Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 + wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum + eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla + assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred + nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer + farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus + labore sustainable VHS. + </div> + </div> + </div> + <div class="panel box box-danger"> + <div class="box-header with-border"> + <h4 class="box-title"> + <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo"> + Collapsible Group Danger + </a> + </h4> + </div> + <div id="collapseTwo" class="panel-collapse collapse"> + <div class="box-body"> + Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 + wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum + eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla + assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred + nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer + farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus + labore sustainable VHS. + </div> + </div> + </div> + <div class="panel box box-success"> + <div class="box-header with-border"> + <h4 class="box-title"> + <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree"> + Collapsible Group Success + </a> + </h4> + </div> + <div id="collapseThree" class="panel-collapse collapse"> + <div class="box-body"> + Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 + wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum + eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla + assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred + nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer + farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus + labore sustainable VHS. + </div> + </div> + </div> + </div> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + <div class="col-md-6"> + <div class="box box-solid"> + <div class="box-header with-border"> + <h3 class="box-title">Carousel</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> + <ol class="carousel-indicators"> + <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> + <li data-target="#carousel-example-generic" data-slide-to="1" class=""></li> + <li data-target="#carousel-example-generic" data-slide-to="2" class=""></li> + </ol> + <div class="carousel-inner"> + <div class="item active"> + <img src="http://placehold.it/900x500/39CCCC/ffffff&text=I+Love+Bootstrap" alt="First slide"> + + <div class="carousel-caption"> + First Slide + </div> + </div> + <div class="item"> + <img src="http://placehold.it/900x500/3c8dbc/ffffff&text=I+Love+Bootstrap" alt="Second slide"> + + <div class="carousel-caption"> + Second Slide + </div> + </div> + <div class="item"> + <img src="http://placehold.it/900x500/f39c12/ffffff&text=I+Love+Bootstrap" alt="Third slide"> + + <div class="carousel-caption"> + Third Slide + </div> + </div> + </div> + <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev"> + <span class="fa fa-angle-left"></span> + </a> + <a class="right carousel-control" href="#carousel-example-generic" data-slide="next"> + <span class="fa fa-angle-right"></span> + </a> + </div> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + <!-- END ACCORDION & CAROUSEL--> + + <!-- START TYPOGRAPHY --> + <h2 class="page-header">Typography</h2> + + <div class="row"> + <div class="col-md-6"> + <div class="box box-solid"> + <div class="box-header with-border"> + <i class="fa fa-text-width"></i> + + <h3 class="box-title">Headlines</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <h1>h1. Bootstrap heading</h1> + + <h2>h2. Bootstrap heading</h2> + + <h3>h3. Bootstrap heading</h3> + <h4>h4. Bootstrap heading</h4> + <h5>h5. Bootstrap heading</h5> + <h6>h6. Bootstrap heading</h6> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- ./col --> + <div class="col-md-6"> + <div class="box box-solid"> + <div class="box-header with-border"> + <i class="fa fa-text-width"></i> + + <h3 class="box-title">Text Emphasis</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <p class="lead">Lead to emphasize importance</p> + + <p class="text-green">Text green to emphasize success</p> + + <p class="text-aqua">Text aqua to emphasize info</p> + + <p class="text-light-blue">Text light blue to emphasize info (2)</p> + + <p class="text-red">Text red to emphasize danger</p> + + <p class="text-yellow">Text yellow to emphasize warning</p> + + <p class="text-muted">Text muted to emphasize general</p> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- ./col --> + </div> + <!-- /.row --> + + <div class="row"> + <div class="col-md-6"> + <div class="box box-solid"> + <div class="box-header with-border"> + <i class="fa fa-text-width"></i> + + <h3 class="box-title">Block Quotes</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <blockquote> + <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p> + <small>Someone famous in <cite title="Source Title">Source Title</cite></small> + </blockquote> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- ./col --> + <div class="col-md-6"> + <div class="box box-solid"> + <div class="box-header with-border"> + <i class="fa fa-text-width"></i> + + <h3 class="box-title">Block Quotes Pulled Right</h3> + </div> + <!-- /.box-header --> + <div class="box-body clearfix"> + <blockquote class="pull-right"> + <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p> + <small>Someone famous in <cite title="Source Title">Source Title</cite></small> + </blockquote> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- ./col --> + </div> + <!-- /.row --> + + <div class="row"> + <div class="col-md-4"> + <div class="box box-solid"> + <div class="box-header with-border"> + <i class="fa fa-text-width"></i> + + <h3 class="box-title">Unordered List</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <ul> + <li>Lorem ipsum dolor sit amet</li> + <li>Consectetur adipiscing elit</li> + <li>Integer molestie lorem at massa</li> + <li>Facilisis in pretium nisl aliquet</li> + <li>Nulla volutpat aliquam velit + <ul> + <li>Phasellus iaculis neque</li> + <li>Purus sodales ultricies</li> + <li>Vestibulum laoreet porttitor sem</li> + <li>Ac tristique libero volutpat at</li> + </ul> + </li> + <li>Faucibus porta lacus fringilla vel</li> + <li>Aenean sit amet erat nunc</li> + <li>Eget porttitor lorem</li> + </ul> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- ./col --> + <div class="col-md-4"> + <div class="box box-solid"> + <div class="box-header with-border"> + <i class="fa fa-text-width"></i> + + <h3 class="box-title">Ordered Lists</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <ol> + <li>Lorem ipsum dolor sit amet</li> + <li>Consectetur adipiscing elit</li> + <li>Integer molestie lorem at massa</li> + <li>Facilisis in pretium nisl aliquet</li> + <li>Nulla volutpat aliquam velit + <ol> + <li>Phasellus iaculis neque</li> + <li>Purus sodales ultricies</li> + <li>Vestibulum laoreet porttitor sem</li> + <li>Ac tristique libero volutpat at</li> + </ol> + </li> + <li>Faucibus porta lacus fringilla vel</li> + <li>Aenean sit amet erat nunc</li> + <li>Eget porttitor lorem</li> + </ol> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- ./col --> + <div class="col-md-4"> + <div class="box box-solid"> + <div class="box-header with-border"> + <i class="fa fa-text-width"></i> + + <h3 class="box-title">Unstyled List</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <ul class="list-unstyled"> + <li>Lorem ipsum dolor sit amet</li> + <li>Consectetur adipiscing elit</li> + <li>Integer molestie lorem at massa</li> + <li>Facilisis in pretium nisl aliquet</li> + <li>Nulla volutpat aliquam velit + <ul> + <li>Phasellus iaculis neque</li> + <li>Purus sodales ultricies</li> + <li>Vestibulum laoreet porttitor sem</li> + <li>Ac tristique libero volutpat at</li> + </ul> + </li> + <li>Faucibus porta lacus fringilla vel</li> + <li>Aenean sit amet erat nunc</li> + <li>Eget porttitor lorem</li> + </ul> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- ./col --> + </div> + <!-- /.row --> + + <div class="row"> + <div class="col-md-6"> + <div class="box box-solid"> + <div class="box-header with-border"> + <i class="fa fa-text-width"></i> + + <h3 class="box-title">Description</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <dl> + <dt>Description lists</dt> + <dd>A description list is perfect for defining terms.</dd> + <dt>Euismod</dt> + <dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</dd> + <dd>Donec id elit non mi porta gravida at eget metus.</dd> + <dt>Malesuada porta</dt> + <dd>Etiam porta sem malesuada magna mollis euismod.</dd> + </dl> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- ./col --> + <div class="col-md-6"> + <div class="box box-solid"> + <div class="box-header with-border"> + <i class="fa fa-text-width"></i> + + <h3 class="box-title">Description Horizontal</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <dl class="dl-horizontal"> + <dt>Description lists</dt> + <dd>A description list is perfect for defining terms.</dd> + <dt>Euismod</dt> + <dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</dd> + <dd>Donec id elit non mi porta gravida at eget metus.</dd> + <dt>Malesuada porta</dt> + <dd>Etiam porta sem malesuada magna mollis euismod.</dd> + <dt>Felis euismod semper eget lacinia</dt> + <dd>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo + sit amet risus. + </dd> + </dl> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- ./col --> + </div> + <!-- /.row --> + <!-- END TYPOGRAPHY --> + + </section> + <!-- /.content --> + </div> + <!-- /.content-wrapper --> + <footer class="main-footer"> + <div class="pull-right hidden-xs"> + <b>Version</b> 2.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/UI/icons.html b/public/bower_components/admin-lte/pages/UI/icons.html new file mode 100644 index 0000000..c66881d --- /dev/null +++ b/public/bower_components/admin-lte/pages/UI/icons.html @@ -0,0 +1,3035 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Icons</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.css"> + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> + <!-- demo style --> + <style> + /* FROM HTTP://WWW.GETBOOTSTRAP.COM + * Glyphicons + * + * Special styles for displaying the icons and their classes in the docs. + */ + + .bs-glyphicons { + padding-left: 0; + padding-bottom: 1px; + margin-bottom: 20px; + list-style: none; + overflow: hidden; + } + + .bs-glyphicons li { + float: left; + width: 25%; + height: 115px; + padding: 10px; + margin: 0 -1px -1px 0; + font-size: 12px; + line-height: 1.4; + text-align: center; + border: 1px solid #ddd; + } + + .bs-glyphicons .glyphicon { + margin-top: 5px; + margin-bottom: 10px; + font-size: 24px; + } + + .bs-glyphicons .glyphicon-class { + display: block; + text-align: center; + word-wrap: break-word; /* Help out IE10+ with class names */ + } + + .bs-glyphicons li:hover { + background-color: rgba(86, 61, 124, .1); + } + + @media (min-width: 768px) { + .bs-glyphicons li { + width: 12.5%; + } + } + </style> + + <!-- 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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="general.html"><i class="fa fa-circle-o"></i> General</a></li> + <li class="active"><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><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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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> + Icons + <small>a set of beautiful icons</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">Icons</li> + </ol> + </section> + + <!-- Main content --> + <section class="content"> + <div class="row"> + <div class="col-xs-12"> + <div class="nav-tabs-custom"> + <ul class="nav nav-tabs"> + <li class="active"><a href="#fa-icons" data-toggle="tab">Font Awesome</a></li> + <li><a href="#glyphicons" data-toggle="tab">Glyphicons</a></li> + </ul> + <div class="tab-content"> + <!-- Font Awesome Icons --> + <div class="tab-pane active" id="fa-icons"> + <section id="new"> + <h4 class="page-header">66 New Icons in 4.4</h4> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-500px"></i> fa-500px</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-amazon"></i> fa-amazon</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-balance-scale"></i> fa-balance-scale</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-0"></i> fa-battery-0 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-1"></i> fa-battery-1 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-2"></i> fa-battery-2 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-3"></i> fa-battery-3 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-4"></i> fa-battery-4 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-empty"></i> fa-battery-empty</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-full"></i> fa-battery-full</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-half"></i> fa-battery-half</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-quarter"></i> fa-battery-quarter</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-three-quarters"></i> + fa-battery-three-quarters + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-black-tie"></i> fa-black-tie</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-calendar-check-o"></i> fa-calendar-check-o + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-calendar-minus-o"></i> fa-calendar-minus-o + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-calendar-plus-o"></i> fa-calendar-plus-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-calendar-times-o"></i> fa-calendar-times-o + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-diners-club"></i> fa-cc-diners-club</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-jcb"></i> fa-cc-jcb</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-chrome"></i> fa-chrome</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-clone"></i> fa-clone</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-commenting"></i> fa-commenting</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-commenting-o"></i> fa-commenting-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-contao"></i> fa-contao</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-creative-commons"></i> fa-creative-commons + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-expeditedssl"></i> fa-expeditedssl</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-firefox"></i> fa-firefox</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-fonticons"></i> fa-fonticons</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-genderless"></i> fa-genderless</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-get-pocket"></i> fa-get-pocket</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gg"></i> fa-gg</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gg-circle"></i> fa-gg-circle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-grab-o"></i> fa-hand-grab-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-lizard-o"></i> fa-hand-lizard-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-paper-o"></i> fa-hand-paper-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-peace-o"></i> fa-hand-peace-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-pointer-o"></i> fa-hand-pointer-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-rock-o"></i> fa-hand-rock-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-scissors-o"></i> fa-hand-scissors-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-spock-o"></i> fa-hand-spock-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-stop-o"></i> fa-hand-stop-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass"></i> fa-hourglass</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-1"></i> fa-hourglass-1 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-2"></i> fa-hourglass-2 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-3"></i> fa-hourglass-3 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-end"></i> fa-hourglass-end</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-half"></i> fa-hourglass-half</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-o"></i> fa-hourglass-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-start"></i> fa-hourglass-start</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-houzz"></i> fa-houzz</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-i-cursor"></i> fa-i-cursor</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-industry"></i> fa-industry</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-internet-explorer"></i> fa-internet-explorer + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-map"></i> fa-map</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-map-o"></i> fa-map-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-map-pin"></i> fa-map-pin</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-map-signs"></i> fa-map-signs</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mouse-pointer"></i> fa-mouse-pointer</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-object-group"></i> fa-object-group</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-object-ungroup"></i> fa-object-ungroup</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-odnoklassniki"></i> fa-odnoklassniki</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-odnoklassniki-square"></i> + fa-odnoklassniki-square + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-opencart"></i> fa-opencart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-opera"></i> fa-opera</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-optin-monster"></i> fa-optin-monster</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-registered"></i> fa-registered</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-safari"></i> fa-safari</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sticky-note"></i> fa-sticky-note</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sticky-note-o"></i> fa-sticky-note-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-television"></i> fa-television</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-trademark"></i> fa-trademark</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tripadvisor"></i> fa-tripadvisor</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tv"></i> fa-tv + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-vimeo"></i> fa-vimeo</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-wikipedia-w"></i> fa-wikipedia-w</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-y-combinator"></i> fa-y-combinator</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-yc"></i> fa-yc + <span class="text-muted">(alias)</span></div> + </div> + </section> + + <section id="web-application"> + <h4 class="page-header">Web Application Icons</h4> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-adjust"></i> fa-adjust</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-anchor"></i> fa-anchor</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-archive"></i> fa-archive</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-area-chart"></i> fa-area-chart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrows"></i> fa-arrows</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrows-h"></i> fa-arrows-h</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrows-v"></i> fa-arrows-v</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-asterisk"></i> fa-asterisk</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-at"></i> fa-at</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-automobile"></i> fa-automobile + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-balance-scale"></i> fa-balance-scale</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ban"></i> fa-ban</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bank"></i> fa-bank <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bar-chart"></i> fa-bar-chart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bar-chart-o"></i> fa-bar-chart-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-barcode"></i> fa-barcode</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bars"></i> fa-bars</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-0"></i> fa-battery-0 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-1"></i> fa-battery-1 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-2"></i> fa-battery-2 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-3"></i> fa-battery-3 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-4"></i> fa-battery-4 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-empty"></i> fa-battery-empty</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-full"></i> fa-battery-full</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-half"></i> fa-battery-half</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-quarter"></i> fa-battery-quarter</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-battery-three-quarters"></i> + fa-battery-three-quarters + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bed"></i> fa-bed</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-beer"></i> fa-beer</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bell"></i> fa-bell</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bell-o"></i> fa-bell-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bell-slash"></i> fa-bell-slash</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bell-slash-o"></i> fa-bell-slash-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bicycle"></i> fa-bicycle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-binoculars"></i> fa-binoculars</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-birthday-cake"></i> fa-birthday-cake</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bolt"></i> fa-bolt</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bomb"></i> fa-bomb</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-book"></i> fa-book</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bookmark"></i> fa-bookmark</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bookmark-o"></i> fa-bookmark-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-briefcase"></i> fa-briefcase</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bug"></i> fa-bug</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-building"></i> fa-building</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-building-o"></i> fa-building-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bullhorn"></i> fa-bullhorn</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bullseye"></i> fa-bullseye</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bus"></i> fa-bus</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cab"></i> fa-cab <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-calculator"></i> fa-calculator</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-calendar"></i> fa-calendar</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-calendar-check-o"></i> fa-calendar-check-o + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-calendar-minus-o"></i> fa-calendar-minus-o + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-calendar-o"></i> fa-calendar-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-calendar-plus-o"></i> fa-calendar-plus-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-calendar-times-o"></i> fa-calendar-times-o + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-camera"></i> fa-camera</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-camera-retro"></i> fa-camera-retro</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-car"></i> fa-car</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-caret-square-o-down"></i> + fa-caret-square-o-down + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-caret-square-o-left"></i> + fa-caret-square-o-left + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-caret-square-o-right"></i> + fa-caret-square-o-right + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-caret-square-o-up"></i> fa-caret-square-o-up + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cart-arrow-down"></i> fa-cart-arrow-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cart-plus"></i> fa-cart-plus</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc"></i> fa-cc</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-certificate"></i> fa-certificate</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-check"></i> fa-check</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-check-circle"></i> fa-check-circle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-check-circle-o"></i> fa-check-circle-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-check-square"></i> fa-check-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-check-square-o"></i> fa-check-square-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-child"></i> fa-child</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-circle"></i> fa-circle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-circle-o"></i> fa-circle-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-circle-o-notch"></i> fa-circle-o-notch</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-circle-thin"></i> fa-circle-thin</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-clock-o"></i> fa-clock-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-clone"></i> fa-clone</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-close"></i> fa-close <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cloud"></i> fa-cloud</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cloud-download"></i> fa-cloud-download</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cloud-upload"></i> fa-cloud-upload</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-code"></i> fa-code</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-code-fork"></i> fa-code-fork</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-coffee"></i> fa-coffee</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cog"></i> fa-cog</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cogs"></i> fa-cogs</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-comment"></i> fa-comment</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-comment-o"></i> fa-comment-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-commenting"></i> fa-commenting</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-commenting-o"></i> fa-commenting-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-comments"></i> fa-comments</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-comments-o"></i> fa-comments-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-compass"></i> fa-compass</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-copyright"></i> fa-copyright</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-creative-commons"></i> fa-creative-commons + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-credit-card"></i> fa-credit-card</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-crop"></i> fa-crop</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-crosshairs"></i> fa-crosshairs</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cube"></i> fa-cube</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cubes"></i> fa-cubes</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cutlery"></i> fa-cutlery</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-dashboard"></i> fa-dashboard + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-database"></i> fa-database</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-desktop"></i> fa-desktop</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-diamond"></i> fa-diamond</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-dot-circle-o"></i> fa-dot-circle-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-download"></i> fa-download</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-edit"></i> fa-edit <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ellipsis-h"></i> fa-ellipsis-h</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ellipsis-v"></i> fa-ellipsis-v</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-envelope"></i> fa-envelope</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-envelope-o"></i> fa-envelope-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-envelope-square"></i> fa-envelope-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-eraser"></i> fa-eraser</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-exchange"></i> fa-exchange</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-exclamation"></i> fa-exclamation</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-exclamation-circle"></i> fa-exclamation-circle + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-exclamation-triangle"></i> + fa-exclamation-triangle + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-external-link"></i> fa-external-link</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-external-link-square"></i> + fa-external-link-square + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-eye"></i> fa-eye</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-eye-slash"></i> fa-eye-slash</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-eyedropper"></i> fa-eyedropper</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-fax"></i> fa-fax</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-feed"></i> fa-feed <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-female"></i> fa-female</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-fighter-jet"></i> fa-fighter-jet</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-archive-o"></i> fa-file-archive-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-audio-o"></i> fa-file-audio-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-code-o"></i> fa-file-code-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-excel-o"></i> fa-file-excel-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-image-o"></i> fa-file-image-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-movie-o"></i> fa-file-movie-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-pdf-o"></i> fa-file-pdf-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-photo-o"></i> fa-file-photo-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-picture-o"></i> fa-file-picture-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-powerpoint-o"></i> fa-file-powerpoint-o + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-sound-o"></i> fa-file-sound-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-video-o"></i> fa-file-video-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-word-o"></i> fa-file-word-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-zip-o"></i> fa-file-zip-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-film"></i> fa-film</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-filter"></i> fa-filter</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-fire"></i> fa-fire</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-fire-extinguisher"></i> fa-fire-extinguisher + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-flag"></i> fa-flag</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-flag-checkered"></i> fa-flag-checkered</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-flag-o"></i> fa-flag-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-flash"></i> fa-flash <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-flask"></i> fa-flask</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-folder"></i> fa-folder</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-folder-o"></i> fa-folder-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-folder-open"></i> fa-folder-open</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-folder-open-o"></i> fa-folder-open-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-frown-o"></i> fa-frown-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-futbol-o"></i> fa-futbol-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gamepad"></i> fa-gamepad</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gavel"></i> fa-gavel</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gear"></i> fa-gear <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gears"></i> fa-gears <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gift"></i> fa-gift</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-glass"></i> fa-glass</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-globe"></i> fa-globe</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-graduation-cap"></i> fa-graduation-cap</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-group"></i> fa-group <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-grab-o"></i> fa-hand-grab-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-lizard-o"></i> fa-hand-lizard-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-paper-o"></i> fa-hand-paper-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-peace-o"></i> fa-hand-peace-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-pointer-o"></i> fa-hand-pointer-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-rock-o"></i> fa-hand-rock-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-scissors-o"></i> fa-hand-scissors-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-spock-o"></i> fa-hand-spock-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-stop-o"></i> fa-hand-stop-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hdd-o"></i> fa-hdd-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-headphones"></i> fa-headphones</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-heart"></i> fa-heart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-heart-o"></i> fa-heart-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-heartbeat"></i> fa-heartbeat</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-history"></i> fa-history</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-home"></i> fa-home</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hotel"></i> fa-hotel <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass"></i> fa-hourglass</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-1"></i> fa-hourglass-1 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-2"></i> fa-hourglass-2 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-3"></i> fa-hourglass-3 + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-end"></i> fa-hourglass-end</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-half"></i> fa-hourglass-half</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-o"></i> fa-hourglass-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hourglass-start"></i> fa-hourglass-start</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-i-cursor"></i> fa-i-cursor</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-image"></i> fa-image <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-inbox"></i> fa-inbox</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-industry"></i> fa-industry</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-info"></i> fa-info</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-info-circle"></i> fa-info-circle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-institution"></i> fa-institution + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-key"></i> fa-key</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-keyboard-o"></i> fa-keyboard-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-language"></i> fa-language</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-laptop"></i> fa-laptop</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-leaf"></i> fa-leaf</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-legal"></i> fa-legal <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-lemon-o"></i> fa-lemon-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-level-down"></i> fa-level-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-level-up"></i> fa-level-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-life-bouy"></i> fa-life-bouy + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-life-buoy"></i> fa-life-buoy + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-life-ring"></i> fa-life-ring</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-life-saver"></i> fa-life-saver + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-lightbulb-o"></i> fa-lightbulb-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-line-chart"></i> fa-line-chart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-location-arrow"></i> fa-location-arrow</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-lock"></i> fa-lock</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-magic"></i> fa-magic</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-magnet"></i> fa-magnet</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mail-forward"></i> fa-mail-forward + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mail-reply"></i> fa-mail-reply + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mail-reply-all"></i> fa-mail-reply-all + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-male"></i> fa-male</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-map"></i> fa-map</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-map-marker"></i> fa-map-marker</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-map-o"></i> fa-map-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-map-pin"></i> fa-map-pin</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-map-signs"></i> fa-map-signs</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-meh-o"></i> fa-meh-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-microphone"></i> fa-microphone</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-microphone-slash"></i> fa-microphone-slash + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-minus"></i> fa-minus</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-minus-circle"></i> fa-minus-circle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-minus-square"></i> fa-minus-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-minus-square-o"></i> fa-minus-square-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mobile"></i> fa-mobile</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mobile-phone"></i> fa-mobile-phone + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-money"></i> fa-money</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-moon-o"></i> fa-moon-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mortar-board"></i> fa-mortar-board + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-motorcycle"></i> fa-motorcycle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mouse-pointer"></i> fa-mouse-pointer</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-music"></i> fa-music</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-navicon"></i> fa-navicon + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-newspaper-o"></i> fa-newspaper-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-object-group"></i> fa-object-group</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-object-ungroup"></i> fa-object-ungroup</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-paint-brush"></i> fa-paint-brush</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-paper-plane"></i> fa-paper-plane</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-paper-plane-o"></i> fa-paper-plane-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-paw"></i> fa-paw</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-pencil"></i> fa-pencil</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-pencil-square"></i> fa-pencil-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-pencil-square-o"></i> fa-pencil-square-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-phone"></i> fa-phone</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-phone-square"></i> fa-phone-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-photo"></i> fa-photo <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-picture-o"></i> fa-picture-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-pie-chart"></i> fa-pie-chart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-plane"></i> fa-plane</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-plug"></i> fa-plug</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-plus"></i> fa-plus</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-plus-circle"></i> fa-plus-circle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-plus-square"></i> fa-plus-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-plus-square-o"></i> fa-plus-square-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-power-off"></i> fa-power-off</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-print"></i> fa-print</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-puzzle-piece"></i> fa-puzzle-piece</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-qrcode"></i> fa-qrcode</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-question"></i> fa-question</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-question-circle"></i> fa-question-circle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-quote-left"></i> fa-quote-left</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-quote-right"></i> fa-quote-right</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-random"></i> fa-random</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-recycle"></i> fa-recycle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-refresh"></i> fa-refresh</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-registered"></i> fa-registered</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-remove"></i> fa-remove + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-reorder"></i> fa-reorder + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-reply"></i> fa-reply</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-reply-all"></i> fa-reply-all</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-retweet"></i> fa-retweet</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-road"></i> fa-road</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-rocket"></i> fa-rocket</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-rss"></i> fa-rss</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-rss-square"></i> fa-rss-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-search"></i> fa-search</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-search-minus"></i> fa-search-minus</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-search-plus"></i> fa-search-plus</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-send"></i> fa-send <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-send-o"></i> fa-send-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-server"></i> fa-server</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-share"></i> fa-share</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-share-alt"></i> fa-share-alt</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-share-alt-square"></i> fa-share-alt-square + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-share-square"></i> fa-share-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-share-square-o"></i> fa-share-square-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-shield"></i> fa-shield</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ship"></i> fa-ship</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-shopping-cart"></i> fa-shopping-cart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sign-in"></i> fa-sign-in</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sign-out"></i> fa-sign-out</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-signal"></i> fa-signal</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sitemap"></i> fa-sitemap</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sliders"></i> fa-sliders</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-smile-o"></i> fa-smile-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-soccer-ball-o"></i> fa-soccer-ball-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sort"></i> fa-sort</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sort-alpha-asc"></i> fa-sort-alpha-asc</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sort-alpha-desc"></i> fa-sort-alpha-desc</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sort-amount-asc"></i> fa-sort-amount-asc</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sort-amount-desc"></i> fa-sort-amount-desc + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sort-asc"></i> fa-sort-asc</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sort-desc"></i> fa-sort-desc</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sort-down"></i> fa-sort-down + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sort-numeric-asc"></i> fa-sort-numeric-asc + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sort-numeric-desc"></i> fa-sort-numeric-desc + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sort-up"></i> fa-sort-up + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-space-shuttle"></i> fa-space-shuttle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-spinner"></i> fa-spinner</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-spoon"></i> fa-spoon</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-square"></i> fa-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-square-o"></i> fa-square-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-star"></i> fa-star</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-star-half"></i> fa-star-half</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-star-half-empty"></i> fa-star-half-empty + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-star-half-full"></i> fa-star-half-full + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-star-half-o"></i> fa-star-half-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-star-o"></i> fa-star-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sticky-note"></i> fa-sticky-note</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sticky-note-o"></i> fa-sticky-note-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-street-view"></i> fa-street-view</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-suitcase"></i> fa-suitcase</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sun-o"></i> fa-sun-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-support"></i> fa-support + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tablet"></i> fa-tablet</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tachometer"></i> fa-tachometer</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tag"></i> fa-tag</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tags"></i> fa-tags</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tasks"></i> fa-tasks</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-taxi"></i> fa-taxi</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-television"></i> fa-television</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-terminal"></i> fa-terminal</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-thumb-tack"></i> fa-thumb-tack</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-thumbs-down"></i> fa-thumbs-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-thumbs-o-down"></i> fa-thumbs-o-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-thumbs-o-up"></i> fa-thumbs-o-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-thumbs-up"></i> fa-thumbs-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ticket"></i> fa-ticket</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-times"></i> fa-times</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-times-circle"></i> fa-times-circle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-times-circle-o"></i> fa-times-circle-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tint"></i> fa-tint</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-toggle-down"></i> fa-toggle-down + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-toggle-left"></i> fa-toggle-left + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-toggle-off"></i> fa-toggle-off</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-toggle-on"></i> fa-toggle-on</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-toggle-right"></i> fa-toggle-right + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-toggle-up"></i> fa-toggle-up + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-trademark"></i> fa-trademark</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-trash"></i> fa-trash</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-trash-o"></i> fa-trash-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tree"></i> fa-tree</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-trophy"></i> fa-trophy</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-truck"></i> fa-truck</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tty"></i> fa-tty</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tv"></i> fa-tv + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-umbrella"></i> fa-umbrella</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-university"></i> fa-university</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-unlock"></i> fa-unlock</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-unlock-alt"></i> fa-unlock-alt</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-unsorted"></i> fa-unsorted + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-upload"></i> fa-upload</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-user"></i> fa-user</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-user-plus"></i> fa-user-plus</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-user-secret"></i> fa-user-secret</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-user-times"></i> fa-user-times</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-users"></i> fa-users</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-video-camera"></i> fa-video-camera</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-volume-down"></i> fa-volume-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-volume-off"></i> fa-volume-off</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-volume-up"></i> fa-volume-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-warning"></i> fa-warning + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-wheelchair"></i> fa-wheelchair</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-wifi"></i> fa-wifi</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-wrench"></i> fa-wrench</div> + </div> + </section> + + <section id="hand"> + <h4 class="page-header">Hand Icons</h4> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-grab-o"></i> fa-hand-grab-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-lizard-o"></i> fa-hand-lizard-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-o-down"></i> fa-hand-o-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-o-left"></i> fa-hand-o-left</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-o-right"></i> fa-hand-o-right</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-o-up"></i> fa-hand-o-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-paper-o"></i> fa-hand-paper-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-peace-o"></i> fa-hand-peace-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-pointer-o"></i> fa-hand-pointer-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-rock-o"></i> fa-hand-rock-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-scissors-o"></i> fa-hand-scissors-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-spock-o"></i> fa-hand-spock-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-stop-o"></i> fa-hand-stop-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-thumbs-down"></i> fa-thumbs-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-thumbs-o-down"></i> fa-thumbs-o-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-thumbs-o-up"></i> fa-thumbs-o-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-thumbs-up"></i> fa-thumbs-up</div> + </div> + </section> + + <section id="transportation"> + <h4 class="page-header">Transportation Icons</h4> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ambulance"></i> fa-ambulance</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-automobile"></i> fa-automobile + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bicycle"></i> fa-bicycle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bus"></i> fa-bus</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cab"></i> fa-cab <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-car"></i> fa-car</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-fighter-jet"></i> fa-fighter-jet</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-motorcycle"></i> fa-motorcycle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-plane"></i> fa-plane</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-rocket"></i> fa-rocket</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ship"></i> fa-ship</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-space-shuttle"></i> fa-space-shuttle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-subway"></i> fa-subway</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-taxi"></i> fa-taxi</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-train"></i> fa-train</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-truck"></i> fa-truck</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-wheelchair"></i> fa-wheelchair</div> + </div> + </section> + + <section id="gender"> + <h4 class="page-header">Gender Icons</h4> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-genderless"></i> fa-genderless</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-intersex"></i> fa-intersex + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mars"></i> fa-mars</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mars-double"></i> fa-mars-double</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mars-stroke"></i> fa-mars-stroke</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mars-stroke-h"></i> fa-mars-stroke-h</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mars-stroke-v"></i> fa-mars-stroke-v</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-mercury"></i> fa-mercury</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-neuter"></i> fa-neuter</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-transgender"></i> fa-transgender</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-transgender-alt"></i> fa-transgender-alt</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-venus"></i> fa-venus</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-venus-double"></i> fa-venus-double</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-venus-mars"></i> fa-venus-mars</div> + </div> + </section> + + <section id="file-type"> + <h2 class="page-header">File Type Icons</h2> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file"></i> fa-file</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-archive-o"></i> fa-file-archive-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-audio-o"></i> fa-file-audio-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-code-o"></i> fa-file-code-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-excel-o"></i> fa-file-excel-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-image-o"></i> fa-file-image-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-movie-o"></i> fa-file-movie-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-o"></i> fa-file-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-pdf-o"></i> fa-file-pdf-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-photo-o"></i> fa-file-photo-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-picture-o"></i> fa-file-picture-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-powerpoint-o"></i> fa-file-powerpoint-o + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-sound-o"></i> fa-file-sound-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-text"></i> fa-file-text</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-text-o"></i> fa-file-text-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-video-o"></i> fa-file-video-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-word-o"></i> fa-file-word-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-zip-o"></i> fa-file-zip-o + <span class="text-muted">(alias)</span></div> + </div> + </section> + + <section id="spinner"> + <h2 class="page-header">Spinner Icons</h2> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-circle-o-notch"></i> fa-circle-o-notch</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cog"></i> fa-cog</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gear"></i> fa-gear <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-refresh"></i> fa-refresh</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-spinner"></i> fa-spinner</div> + </div> + </section> + + <section id="form-control"> + <h4 class="page-header">Form Control Icons</h4> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-check-square"></i> fa-check-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-check-square-o"></i> fa-check-square-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-circle"></i> fa-circle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-circle-o"></i> fa-circle-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-dot-circle-o"></i> fa-dot-circle-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-minus-square"></i> fa-minus-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-minus-square-o"></i> fa-minus-square-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-plus-square"></i> fa-plus-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-plus-square-o"></i> fa-plus-square-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-square"></i> fa-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-square-o"></i> fa-square-o</div> + </div> + </section> + + <section id="payment"> + <h4 class="page-header">Payment Icons</h4> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-amex"></i> fa-cc-amex</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-diners-club"></i> fa-cc-diners-club</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-discover"></i> fa-cc-discover</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-jcb"></i> fa-cc-jcb</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-mastercard"></i> fa-cc-mastercard</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-paypal"></i> fa-cc-paypal</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-stripe"></i> fa-cc-stripe</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-visa"></i> fa-cc-visa</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-credit-card"></i> fa-credit-card</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-google-wallet"></i> fa-google-wallet</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-paypal"></i> fa-paypal</div> + </div> + </section> + + <section id="chart"> + <h4 class="page-header">Chart Icons</h4> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-area-chart"></i> fa-area-chart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bar-chart"></i> fa-bar-chart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bar-chart-o"></i> fa-bar-chart-o + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-line-chart"></i> fa-line-chart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-pie-chart"></i> fa-pie-chart</div> + </div> + </section> + + <section id="currency"> + <h4 class="page-header">Currency Icons</h4> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bitcoin"></i> fa-bitcoin + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-btc"></i> fa-btc</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cny"></i> fa-cny <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-dollar"></i> fa-dollar + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-eur"></i> fa-eur</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-euro"></i> fa-euro <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gbp"></i> fa-gbp</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gg"></i> fa-gg</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gg-circle"></i> fa-gg-circle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ils"></i> fa-ils</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-inr"></i> fa-inr</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-jpy"></i> fa-jpy</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-krw"></i> fa-krw</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-money"></i> fa-money</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-rmb"></i> fa-rmb <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-rouble"></i> fa-rouble + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-rub"></i> fa-rub</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ruble"></i> fa-ruble <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-rupee"></i> fa-rupee <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-shekel"></i> fa-shekel + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sheqel"></i> fa-sheqel + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-try"></i> fa-try</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-turkish-lira"></i> fa-turkish-lira + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-usd"></i> fa-usd</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-won"></i> fa-won <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-yen"></i> fa-yen <span class="text-muted">(alias)</span> + </div> + </div> + </section> + + <section id="text-editor"> + <h4 class="page-header">Text Editor Icons</h4> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-align-center"></i> fa-align-center</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-align-justify"></i> fa-align-justify</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-align-left"></i> fa-align-left</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-align-right"></i> fa-align-right</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bold"></i> fa-bold</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-chain"></i> fa-chain <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-chain-broken"></i> fa-chain-broken</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-clipboard"></i> fa-clipboard</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-columns"></i> fa-columns</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-copy"></i> fa-copy <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cut"></i> fa-cut <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-dedent"></i> fa-dedent + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-eraser"></i> fa-eraser</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file"></i> fa-file</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-o"></i> fa-file-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-text"></i> fa-file-text</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-file-text-o"></i> fa-file-text-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-files-o"></i> fa-files-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-floppy-o"></i> fa-floppy-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-font"></i> fa-font</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-header"></i> fa-header</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-indent"></i> fa-indent</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-italic"></i> fa-italic</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-link"></i> fa-link</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-list"></i> fa-list</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-list-alt"></i> fa-list-alt</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-list-ol"></i> fa-list-ol</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-list-ul"></i> fa-list-ul</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-outdent"></i> fa-outdent</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-paperclip"></i> fa-paperclip</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-paragraph"></i> fa-paragraph</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-paste"></i> fa-paste <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-repeat"></i> fa-repeat</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-rotate-left"></i> fa-rotate-left + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-rotate-right"></i> fa-rotate-right + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-save"></i> fa-save <span class="text-muted">(alias)</span> + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-scissors"></i> fa-scissors</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-strikethrough"></i> fa-strikethrough</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-subscript"></i> fa-subscript</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-superscript"></i> fa-superscript</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-table"></i> fa-table</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-text-height"></i> fa-text-height</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-text-width"></i> fa-text-width</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-th"></i> fa-th</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-th-large"></i> fa-th-large</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-th-list"></i> fa-th-list</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-underline"></i> fa-underline</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-undo"></i> fa-undo</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-unlink"></i> fa-unlink + <span class="text-muted">(alias)</span></div> + </div> + </section> + + <section id="directional"> + <h4 class="page-header">Directional Icons</h4> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-angle-double-down"></i> fa-angle-double-down + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-angle-double-left"></i> fa-angle-double-left + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-angle-double-right"></i> fa-angle-double-right + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-angle-double-up"></i> fa-angle-double-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-angle-down"></i> fa-angle-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-angle-left"></i> fa-angle-left</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-angle-right"></i> fa-angle-right</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-angle-up"></i> fa-angle-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrow-circle-down"></i> fa-arrow-circle-down + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrow-circle-left"></i> fa-arrow-circle-left + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrow-circle-o-down"></i> + fa-arrow-circle-o-down + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrow-circle-o-left"></i> + fa-arrow-circle-o-left + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrow-circle-o-right"></i> + fa-arrow-circle-o-right + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrow-circle-o-up"></i> fa-arrow-circle-o-up + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrow-circle-right"></i> fa-arrow-circle-right + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrow-circle-up"></i> fa-arrow-circle-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrow-down"></i> fa-arrow-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrow-left"></i> fa-arrow-left</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrow-right"></i> fa-arrow-right</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrow-up"></i> fa-arrow-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrows"></i> fa-arrows</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrows-alt"></i> fa-arrows-alt</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrows-h"></i> fa-arrows-h</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrows-v"></i> fa-arrows-v</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-caret-down"></i> fa-caret-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-caret-left"></i> fa-caret-left</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-caret-right"></i> fa-caret-right</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-caret-square-o-down"></i> + fa-caret-square-o-down + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-caret-square-o-left"></i> + fa-caret-square-o-left + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-caret-square-o-right"></i> + fa-caret-square-o-right + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-caret-square-o-up"></i> fa-caret-square-o-up + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-caret-up"></i> fa-caret-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-chevron-circle-down"></i> + fa-chevron-circle-down + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-chevron-circle-left"></i> + fa-chevron-circle-left + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-chevron-circle-right"></i> + fa-chevron-circle-right + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-chevron-circle-up"></i> fa-chevron-circle-up + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-chevron-down"></i> fa-chevron-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-chevron-left"></i> fa-chevron-left</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-chevron-right"></i> fa-chevron-right</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-chevron-up"></i> fa-chevron-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-exchange"></i> fa-exchange</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-o-down"></i> fa-hand-o-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-o-left"></i> fa-hand-o-left</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-o-right"></i> fa-hand-o-right</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hand-o-up"></i> fa-hand-o-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-long-arrow-down"></i> fa-long-arrow-down</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-long-arrow-left"></i> fa-long-arrow-left</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-long-arrow-right"></i> fa-long-arrow-right + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-long-arrow-up"></i> fa-long-arrow-up</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-toggle-down"></i> fa-toggle-down + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-toggle-left"></i> fa-toggle-left + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-toggle-right"></i> fa-toggle-right + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-toggle-up"></i> fa-toggle-up + <span class="text-muted">(alias)</span></div> + </div> + </section> + + <section id="video-player"> + <h4 class="page-header">Video Player Icons</h4> + + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-arrows-alt"></i> fa-arrows-alt</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-backward"></i> fa-backward</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-compress"></i> fa-compress</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-eject"></i> fa-eject</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-expand"></i> fa-expand</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-fast-backward"></i> fa-fast-backward</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-fast-forward"></i> fa-fast-forward</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-forward"></i> fa-forward</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-pause"></i> fa-pause</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-play"></i> fa-play</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-play-circle"></i> fa-play-circle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-play-circle-o"></i> fa-play-circle-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-random"></i> fa-random</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-step-backward"></i> fa-step-backward</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-step-forward"></i> fa-step-forward</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-stop"></i> fa-stop</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-youtube-play"></i> fa-youtube-play</div> + </div> + </section> + + <section id="brand"> + <h4 class="page-header">Brand Icons</h4> + + <div class="alert alert-info"> + <ul class="margin-bottom-none padding-left-lg"> + <li>All brand icons are trademarks of their respective owners.</li> + <li>The use of these trademarks does not indicate endorsement of the trademark holder by Font + Awesome, nor vice versa. + </li> + </ul> + </div> + <div class="row fontawesome-icon-list"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-500px"></i> fa-500px</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-adn"></i> fa-adn</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-amazon"></i> fa-amazon</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-android"></i> fa-android</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-angellist"></i> fa-angellist</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-apple"></i> fa-apple</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-behance"></i> fa-behance</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-behance-square"></i> fa-behance-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bitbucket"></i> fa-bitbucket</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bitbucket-square"></i> fa-bitbucket-square + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-bitcoin"></i> fa-bitcoin + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-black-tie"></i> fa-black-tie</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-btc"></i> fa-btc</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-buysellads"></i> fa-buysellads</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-amex"></i> fa-cc-amex</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-diners-club"></i> fa-cc-diners-club</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-discover"></i> fa-cc-discover</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-jcb"></i> fa-cc-jcb</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-mastercard"></i> fa-cc-mastercard</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-paypal"></i> fa-cc-paypal</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-stripe"></i> fa-cc-stripe</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-cc-visa"></i> fa-cc-visa</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-chrome"></i> fa-chrome</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-codepen"></i> fa-codepen</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-connectdevelop"></i> fa-connectdevelop</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-contao"></i> fa-contao</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-css3"></i> fa-css3</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-dashcube"></i> fa-dashcube</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-delicious"></i> fa-delicious</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-deviantart"></i> fa-deviantart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-digg"></i> fa-digg</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-dribbble"></i> fa-dribbble</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-dropbox"></i> fa-dropbox</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-drupal"></i> fa-drupal</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-empire"></i> fa-empire</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-expeditedssl"></i> fa-expeditedssl</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-facebook"></i> fa-facebook</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-facebook-f"></i> fa-facebook-f + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-facebook-official"></i> fa-facebook-official + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-facebook-square"></i> fa-facebook-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-firefox"></i> fa-firefox</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-flickr"></i> fa-flickr</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-fonticons"></i> fa-fonticons</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-forumbee"></i> fa-forumbee</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-foursquare"></i> fa-foursquare</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ge"></i> fa-ge + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-get-pocket"></i> fa-get-pocket</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gg"></i> fa-gg</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gg-circle"></i> fa-gg-circle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-git"></i> fa-git</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-git-square"></i> fa-git-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-github"></i> fa-github</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-github-alt"></i> fa-github-alt</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-github-square"></i> fa-github-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gittip"></i> fa-gittip + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-google"></i> fa-google</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-google-plus"></i> fa-google-plus</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-google-plus-square"></i> fa-google-plus-square + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-google-wallet"></i> fa-google-wallet</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-gratipay"></i> fa-gratipay</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hacker-news"></i> fa-hacker-news</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-houzz"></i> fa-houzz</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-html5"></i> fa-html5</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-instagram"></i> fa-instagram</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-internet-explorer"></i> fa-internet-explorer + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ioxhost"></i> fa-ioxhost</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-joomla"></i> fa-joomla</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-jsfiddle"></i> fa-jsfiddle</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-lastfm"></i> fa-lastfm</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-lastfm-square"></i> fa-lastfm-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-leanpub"></i> fa-leanpub</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-linkedin"></i> fa-linkedin</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-linkedin-square"></i> fa-linkedin-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-linux"></i> fa-linux</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-maxcdn"></i> fa-maxcdn</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-meanpath"></i> fa-meanpath</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-medium"></i> fa-medium</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-odnoklassniki"></i> fa-odnoklassniki</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-odnoklassniki-square"></i> + fa-odnoklassniki-square + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-opencart"></i> fa-opencart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-openid"></i> fa-openid</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-opera"></i> fa-opera</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-optin-monster"></i> fa-optin-monster</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-pagelines"></i> fa-pagelines</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-paypal"></i> fa-paypal</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-pied-piper"></i> fa-pied-piper</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-pied-piper-alt"></i> fa-pied-piper-alt</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-pinterest"></i> fa-pinterest</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-pinterest-p"></i> fa-pinterest-p</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-pinterest-square"></i> fa-pinterest-square + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-qq"></i> fa-qq</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ra"></i> fa-ra + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-rebel"></i> fa-rebel</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-reddit"></i> fa-reddit</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-reddit-square"></i> fa-reddit-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-renren"></i> fa-renren</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-safari"></i> fa-safari</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-sellsy"></i> fa-sellsy</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-share-alt"></i> fa-share-alt</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-share-alt-square"></i> fa-share-alt-square + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-shirtsinbulk"></i> fa-shirtsinbulk</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-simplybuilt"></i> fa-simplybuilt</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-skyatlas"></i> fa-skyatlas</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-skype"></i> fa-skype</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-slack"></i> fa-slack</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-slideshare"></i> fa-slideshare</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-soundcloud"></i> fa-soundcloud</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-spotify"></i> fa-spotify</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-stack-exchange"></i> fa-stack-exchange</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-stack-overflow"></i> fa-stack-overflow</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-steam"></i> fa-steam</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-steam-square"></i> fa-steam-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-stumbleupon"></i> fa-stumbleupon</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-stumbleupon-circle"></i> fa-stumbleupon-circle + </div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tencent-weibo"></i> fa-tencent-weibo</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-trello"></i> fa-trello</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tripadvisor"></i> fa-tripadvisor</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tumblr"></i> fa-tumblr</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-tumblr-square"></i> fa-tumblr-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-twitch"></i> fa-twitch</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-twitter"></i> fa-twitter</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-twitter-square"></i> fa-twitter-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-viacoin"></i> fa-viacoin</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-vimeo"></i> fa-vimeo</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-vimeo-square"></i> fa-vimeo-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-vine"></i> fa-vine</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-vk"></i> fa-vk</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-wechat"></i> fa-wechat + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-weibo"></i> fa-weibo</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-weixin"></i> fa-weixin</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-whatsapp"></i> fa-whatsapp</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-wikipedia-w"></i> fa-wikipedia-w</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-windows"></i> fa-windows</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-wordpress"></i> fa-wordpress</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-xing"></i> fa-xing</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-xing-square"></i> fa-xing-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-y-combinator"></i> fa-y-combinator</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-y-combinator-square"></i> + fa-y-combinator-square <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-yahoo"></i> fa-yahoo</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-yc"></i> fa-yc + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-yc-square"></i> fa-yc-square + <span class="text-muted">(alias)</span></div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-yelp"></i> fa-yelp</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-youtube"></i> fa-youtube</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-youtube-play"></i> fa-youtube-play</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-youtube-square"></i> fa-youtube-square</div> + </div> + </section> + + <section id="medical"> + <h4 class="page-header">Medical Icons</h4> + + <div class="row"> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-ambulance"></i> fa-ambulance</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-h-square"></i> fa-h-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-heart"></i> fa-heart</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-heart-o"></i> fa-heart-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-heartbeat"></i> fa-heartbeat</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-hospital-o"></i> fa-hospital-o</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-medkit"></i> fa-medkit</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-plus-square"></i> fa-plus-square</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-stethoscope"></i> fa-stethoscope</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-user-md"></i> fa-user-md</div> + <div class="col-md-3 col-sm-4"><i class="fa fa-fw fa-wheelchair"></i> fa-wheelchair</div> + </div> + </section> + </div> + <!-- /#fa-icons --> + + <!-- glyphicons--> + <div class="tab-pane" id="glyphicons"> + + <ul class="bs-glyphicons"> + <li> + <span class="glyphicon glyphicon-asterisk"></span> + <span class="glyphicon-class">glyphicon glyphicon-asterisk</span> + </li> + <li> + <span class="glyphicon glyphicon-plus"></span> + <span class="glyphicon-class">glyphicon glyphicon-plus</span> + </li> + <li> + <span class="glyphicon glyphicon-euro"></span> + <span class="glyphicon-class">glyphicon glyphicon-euro</span> + </li> + <li> + <span class="glyphicon glyphicon-eur"></span> + <span class="glyphicon-class">glyphicon glyphicon-eur</span> + </li> + <li> + <span class="glyphicon glyphicon-minus"></span> + <span class="glyphicon-class">glyphicon glyphicon-minus</span> + </li> + <li> + <span class="glyphicon glyphicon-cloud"></span> + <span class="glyphicon-class">glyphicon glyphicon-cloud</span> + </li> + <li> + <span class="glyphicon glyphicon-envelope"></span> + <span class="glyphicon-class">glyphicon glyphicon-envelope</span> + </li> + <li> + <span class="glyphicon glyphicon-pencil"></span> + <span class="glyphicon-class">glyphicon glyphicon-pencil</span> + </li> + <li> + <span class="glyphicon glyphicon-glass"></span> + <span class="glyphicon-class">glyphicon glyphicon-glass</span> + </li> + <li> + <span class="glyphicon glyphicon-music"></span> + <span class="glyphicon-class">glyphicon glyphicon-music</span> + </li> + <li> + <span class="glyphicon glyphicon-search"></span> + <span class="glyphicon-class">glyphicon glyphicon-search</span> + </li> + <li> + <span class="glyphicon glyphicon-heart"></span> + <span class="glyphicon-class">glyphicon glyphicon-heart</span> + </li> + <li> + <span class="glyphicon glyphicon-star"></span> + <span class="glyphicon-class">glyphicon glyphicon-star</span> + </li> + <li> + <span class="glyphicon glyphicon-star-empty"></span> + <span class="glyphicon-class">glyphicon glyphicon-star-empty</span> + </li> + <li> + <span class="glyphicon glyphicon-user"></span> + <span class="glyphicon-class">glyphicon glyphicon-user</span> + </li> + <li> + <span class="glyphicon glyphicon-film"></span> + <span class="glyphicon-class">glyphicon glyphicon-film</span> + </li> + <li> + <span class="glyphicon glyphicon-th-large"></span> + <span class="glyphicon-class">glyphicon glyphicon-th-large</span> + </li> + <li> + <span class="glyphicon glyphicon-th"></span> + <span class="glyphicon-class">glyphicon glyphicon-th</span> + </li> + <li> + <span class="glyphicon glyphicon-th-list"></span> + <span class="glyphicon-class">glyphicon glyphicon-th-list</span> + </li> + <li> + <span class="glyphicon glyphicon-ok"></span> + <span class="glyphicon-class">glyphicon glyphicon-ok</span> + </li> + <li> + <span class="glyphicon glyphicon-remove"></span> + <span class="glyphicon-class">glyphicon glyphicon-remove</span> + </li> + <li> + <span class="glyphicon glyphicon-zoom-in"></span> + <span class="glyphicon-class">glyphicon glyphicon-zoom-in</span> + </li> + <li> + <span class="glyphicon glyphicon-zoom-out"></span> + <span class="glyphicon-class">glyphicon glyphicon-zoom-out</span> + </li> + <li> + <span class="glyphicon glyphicon-off"></span> + <span class="glyphicon-class">glyphicon glyphicon-off</span> + </li> + <li> + <span class="glyphicon glyphicon-signal"></span> + <span class="glyphicon-class">glyphicon glyphicon-signal</span> + </li> + <li> + <span class="glyphicon glyphicon-cog"></span> + <span class="glyphicon-class">glyphicon glyphicon-cog</span> + </li> + <li> + <span class="glyphicon glyphicon-trash"></span> + <span class="glyphicon-class">glyphicon glyphicon-trash</span> + </li> + <li> + <span class="glyphicon glyphicon-home"></span> + <span class="glyphicon-class">glyphicon glyphicon-home</span> + </li> + <li> + <span class="glyphicon glyphicon-file"></span> + <span class="glyphicon-class">glyphicon glyphicon-file</span> + </li> + <li> + <span class="glyphicon glyphicon-time"></span> + <span class="glyphicon-class">glyphicon glyphicon-time</span> + </li> + <li> + <span class="glyphicon glyphicon-road"></span> + <span class="glyphicon-class">glyphicon glyphicon-road</span> + </li> + <li> + <span class="glyphicon glyphicon-download-alt"></span> + <span class="glyphicon-class">glyphicon glyphicon-download-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-download"></span> + <span class="glyphicon-class">glyphicon glyphicon-download</span> + </li> + <li> + <span class="glyphicon glyphicon-upload"></span> + <span class="glyphicon-class">glyphicon glyphicon-upload</span> + </li> + <li> + <span class="glyphicon glyphicon-inbox"></span> + <span class="glyphicon-class">glyphicon glyphicon-inbox</span> + </li> + <li> + <span class="glyphicon glyphicon-play-circle"></span> + <span class="glyphicon-class">glyphicon glyphicon-play-circle</span> + </li> + <li> + <span class="glyphicon glyphicon-repeat"></span> + <span class="glyphicon-class">glyphicon glyphicon-repeat</span> + </li> + <li> + <span class="glyphicon glyphicon-refresh"></span> + <span class="glyphicon-class">glyphicon glyphicon-refresh</span> + </li> + <li> + <span class="glyphicon glyphicon-list-alt"></span> + <span class="glyphicon-class">glyphicon glyphicon-list-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-lock"></span> + <span class="glyphicon-class">glyphicon glyphicon-lock</span> + </li> + <li> + <span class="glyphicon glyphicon-flag"></span> + <span class="glyphicon-class">glyphicon glyphicon-flag</span> + </li> + <li> + <span class="glyphicon glyphicon-headphones"></span> + <span class="glyphicon-class">glyphicon glyphicon-headphones</span> + </li> + <li> + <span class="glyphicon glyphicon-volume-off"></span> + <span class="glyphicon-class">glyphicon glyphicon-volume-off</span> + </li> + <li> + <span class="glyphicon glyphicon-volume-down"></span> + <span class="glyphicon-class">glyphicon glyphicon-volume-down</span> + </li> + <li> + <span class="glyphicon glyphicon-volume-up"></span> + <span class="glyphicon-class">glyphicon glyphicon-volume-up</span> + </li> + <li> + <span class="glyphicon glyphicon-qrcode"></span> + <span class="glyphicon-class">glyphicon glyphicon-qrcode</span> + </li> + <li> + <span class="glyphicon glyphicon-barcode"></span> + <span class="glyphicon-class">glyphicon glyphicon-barcode</span> + </li> + <li> + <span class="glyphicon glyphicon-tag"></span> + <span class="glyphicon-class">glyphicon glyphicon-tag</span> + </li> + <li> + <span class="glyphicon glyphicon-tags"></span> + <span class="glyphicon-class">glyphicon glyphicon-tags</span> + </li> + <li> + <span class="glyphicon glyphicon-book"></span> + <span class="glyphicon-class">glyphicon glyphicon-book</span> + </li> + <li> + <span class="glyphicon glyphicon-bookmark"></span> + <span class="glyphicon-class">glyphicon glyphicon-bookmark</span> + </li> + <li> + <span class="glyphicon glyphicon-print"></span> + <span class="glyphicon-class">glyphicon glyphicon-print</span> + </li> + <li> + <span class="glyphicon glyphicon-camera"></span> + <span class="glyphicon-class">glyphicon glyphicon-camera</span> + </li> + <li> + <span class="glyphicon glyphicon-font"></span> + <span class="glyphicon-class">glyphicon glyphicon-font</span> + </li> + <li> + <span class="glyphicon glyphicon-bold"></span> + <span class="glyphicon-class">glyphicon glyphicon-bold</span> + </li> + <li> + <span class="glyphicon glyphicon-italic"></span> + <span class="glyphicon-class">glyphicon glyphicon-italic</span> + </li> + <li> + <span class="glyphicon glyphicon-text-height"></span> + <span class="glyphicon-class">glyphicon glyphicon-text-height</span> + </li> + <li> + <span class="glyphicon glyphicon-text-width"></span> + <span class="glyphicon-class">glyphicon glyphicon-text-width</span> + </li> + <li> + <span class="glyphicon glyphicon-align-left"></span> + <span class="glyphicon-class">glyphicon glyphicon-align-left</span> + </li> + <li> + <span class="glyphicon glyphicon-align-center"></span> + <span class="glyphicon-class">glyphicon glyphicon-align-center</span> + </li> + <li> + <span class="glyphicon glyphicon-align-right"></span> + <span class="glyphicon-class">glyphicon glyphicon-align-right</span> + </li> + <li> + <span class="glyphicon glyphicon-align-justify"></span> + <span class="glyphicon-class">glyphicon glyphicon-align-justify</span> + </li> + <li> + <span class="glyphicon glyphicon-list"></span> + <span class="glyphicon-class">glyphicon glyphicon-list</span> + </li> + <li> + <span class="glyphicon glyphicon-indent-left"></span> + <span class="glyphicon-class">glyphicon glyphicon-indent-left</span> + </li> + <li> + <span class="glyphicon glyphicon-indent-right"></span> + <span class="glyphicon-class">glyphicon glyphicon-indent-right</span> + </li> + <li> + <span class="glyphicon glyphicon-facetime-video"></span> + <span class="glyphicon-class">glyphicon glyphicon-facetime-video</span> + </li> + <li> + <span class="glyphicon glyphicon-picture"></span> + <span class="glyphicon-class">glyphicon glyphicon-picture</span> + </li> + <li> + <span class="glyphicon glyphicon-map-marker"></span> + <span class="glyphicon-class">glyphicon glyphicon-map-marker</span> + </li> + <li> + <span class="glyphicon glyphicon-adjust"></span> + <span class="glyphicon-class">glyphicon glyphicon-adjust</span> + </li> + <li> + <span class="glyphicon glyphicon-tint"></span> + <span class="glyphicon-class">glyphicon glyphicon-tint</span> + </li> + <li> + <span class="glyphicon glyphicon-edit"></span> + <span class="glyphicon-class">glyphicon glyphicon-edit</span> + </li> + <li> + <span class="glyphicon glyphicon-share"></span> + <span class="glyphicon-class">glyphicon glyphicon-share</span> + </li> + <li> + <span class="glyphicon glyphicon-check"></span> + <span class="glyphicon-class">glyphicon glyphicon-check</span> + </li> + <li> + <span class="glyphicon glyphicon-move"></span> + <span class="glyphicon-class">glyphicon glyphicon-move</span> + </li> + <li> + <span class="glyphicon glyphicon-step-backward"></span> + <span class="glyphicon-class">glyphicon glyphicon-step-backward</span> + </li> + <li> + <span class="glyphicon glyphicon-fast-backward"></span> + <span class="glyphicon-class">glyphicon glyphicon-fast-backward</span> + </li> + <li> + <span class="glyphicon glyphicon-backward"></span> + <span class="glyphicon-class">glyphicon glyphicon-backward</span> + </li> + <li> + <span class="glyphicon glyphicon-play"></span> + <span class="glyphicon-class">glyphicon glyphicon-play</span> + </li> + <li> + <span class="glyphicon glyphicon-pause"></span> + <span class="glyphicon-class">glyphicon glyphicon-pause</span> + </li> + <li> + <span class="glyphicon glyphicon-stop"></span> + <span class="glyphicon-class">glyphicon glyphicon-stop</span> + </li> + <li> + <span class="glyphicon glyphicon-forward"></span> + <span class="glyphicon-class">glyphicon glyphicon-forward</span> + </li> + <li> + <span class="glyphicon glyphicon-fast-forward"></span> + <span class="glyphicon-class">glyphicon glyphicon-fast-forward</span> + </li> + <li> + <span class="glyphicon glyphicon-step-forward"></span> + <span class="glyphicon-class">glyphicon glyphicon-step-forward</span> + </li> + <li> + <span class="glyphicon glyphicon-eject"></span> + <span class="glyphicon-class">glyphicon glyphicon-eject</span> + </li> + <li> + <span class="glyphicon glyphicon-chevron-left"></span> + <span class="glyphicon-class">glyphicon glyphicon-chevron-left</span> + </li> + <li> + <span class="glyphicon glyphicon-chevron-right"></span> + <span class="glyphicon-class">glyphicon glyphicon-chevron-right</span> + </li> + <li> + <span class="glyphicon glyphicon-plus-sign"></span> + <span class="glyphicon-class">glyphicon glyphicon-plus-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-minus-sign"></span> + <span class="glyphicon-class">glyphicon glyphicon-minus-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-remove-sign"></span> + <span class="glyphicon-class">glyphicon glyphicon-remove-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-ok-sign"></span> + <span class="glyphicon-class">glyphicon glyphicon-ok-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-question-sign"></span> + <span class="glyphicon-class">glyphicon glyphicon-question-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-info-sign"></span> + <span class="glyphicon-class">glyphicon glyphicon-info-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-screenshot"></span> + <span class="glyphicon-class">glyphicon glyphicon-screenshot</span> + </li> + <li> + <span class="glyphicon glyphicon-remove-circle"></span> + <span class="glyphicon-class">glyphicon glyphicon-remove-circle</span> + </li> + <li> + <span class="glyphicon glyphicon-ok-circle"></span> + <span class="glyphicon-class">glyphicon glyphicon-ok-circle</span> + </li> + <li> + <span class="glyphicon glyphicon-ban-circle"></span> + <span class="glyphicon-class">glyphicon glyphicon-ban-circle</span> + </li> + <li> + <span class="glyphicon glyphicon-arrow-left"></span> + <span class="glyphicon-class">glyphicon glyphicon-arrow-left</span> + </li> + <li> + <span class="glyphicon glyphicon-arrow-right"></span> + <span class="glyphicon-class">glyphicon glyphicon-arrow-right</span> + </li> + <li> + <span class="glyphicon glyphicon-arrow-up"></span> + <span class="glyphicon-class">glyphicon glyphicon-arrow-up</span> + </li> + <li> + <span class="glyphicon glyphicon-arrow-down"></span> + <span class="glyphicon-class">glyphicon glyphicon-arrow-down</span> + </li> + <li> + <span class="glyphicon glyphicon-share-alt"></span> + <span class="glyphicon-class">glyphicon glyphicon-share-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-resize-full"></span> + <span class="glyphicon-class">glyphicon glyphicon-resize-full</span> + </li> + <li> + <span class="glyphicon glyphicon-resize-small"></span> + <span class="glyphicon-class">glyphicon glyphicon-resize-small</span> + </li> + <li> + <span class="glyphicon glyphicon-exclamation-sign"></span> + <span class="glyphicon-class">glyphicon glyphicon-exclamation-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-gift"></span> + <span class="glyphicon-class">glyphicon glyphicon-gift</span> + </li> + <li> + <span class="glyphicon glyphicon-leaf"></span> + <span class="glyphicon-class">glyphicon glyphicon-leaf</span> + </li> + <li> + <span class="glyphicon glyphicon-fire"></span> + <span class="glyphicon-class">glyphicon glyphicon-fire</span> + </li> + <li> + <span class="glyphicon glyphicon-eye-open"></span> + <span class="glyphicon-class">glyphicon glyphicon-eye-open</span> + </li> + <li> + <span class="glyphicon glyphicon-eye-close"></span> + <span class="glyphicon-class">glyphicon glyphicon-eye-close</span> + </li> + <li> + <span class="glyphicon glyphicon-warning-sign"></span> + <span class="glyphicon-class">glyphicon glyphicon-warning-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-plane"></span> + <span class="glyphicon-class">glyphicon glyphicon-plane</span> + </li> + <li> + <span class="glyphicon glyphicon-calendar"></span> + <span class="glyphicon-class">glyphicon glyphicon-calendar</span> + </li> + <li> + <span class="glyphicon glyphicon-random"></span> + <span class="glyphicon-class">glyphicon glyphicon-random</span> + </li> + <li> + <span class="glyphicon glyphicon-comment"></span> + <span class="glyphicon-class">glyphicon glyphicon-comment</span> + </li> + <li> + <span class="glyphicon glyphicon-magnet"></span> + <span class="glyphicon-class">glyphicon glyphicon-magnet</span> + </li> + <li> + <span class="glyphicon glyphicon-chevron-up"></span> + <span class="glyphicon-class">glyphicon glyphicon-chevron-up</span> + </li> + <li> + <span class="glyphicon glyphicon-chevron-down"></span> + <span class="glyphicon-class">glyphicon glyphicon-chevron-down</span> + </li> + <li> + <span class="glyphicon glyphicon-retweet"></span> + <span class="glyphicon-class">glyphicon glyphicon-retweet</span> + </li> + <li> + <span class="glyphicon glyphicon-shopping-cart"></span> + <span class="glyphicon-class">glyphicon glyphicon-shopping-cart</span> + </li> + <li> + <span class="glyphicon glyphicon-folder-close"></span> + <span class="glyphicon-class">glyphicon glyphicon-folder-close</span> + </li> + <li> + <span class="glyphicon glyphicon-folder-open"></span> + <span class="glyphicon-class">glyphicon glyphicon-folder-open</span> + </li> + <li> + <span class="glyphicon glyphicon-resize-vertical"></span> + <span class="glyphicon-class">glyphicon glyphicon-resize-vertical</span> + </li> + <li> + <span class="glyphicon glyphicon-resize-horizontal"></span> + <span class="glyphicon-class">glyphicon glyphicon-resize-horizontal</span> + </li> + <li> + <span class="glyphicon glyphicon-hdd"></span> + <span class="glyphicon-class">glyphicon glyphicon-hdd</span> + </li> + <li> + <span class="glyphicon glyphicon-bullhorn"></span> + <span class="glyphicon-class">glyphicon glyphicon-bullhorn</span> + </li> + <li> + <span class="glyphicon glyphicon-bell"></span> + <span class="glyphicon-class">glyphicon glyphicon-bell</span> + </li> + <li> + <span class="glyphicon glyphicon-certificate"></span> + <span class="glyphicon-class">glyphicon glyphicon-certificate</span> + </li> + <li> + <span class="glyphicon glyphicon-thumbs-up"></span> + <span class="glyphicon-class">glyphicon glyphicon-thumbs-up</span> + </li> + <li> + <span class="glyphicon glyphicon-thumbs-down"></span> + <span class="glyphicon-class">glyphicon glyphicon-thumbs-down</span> + </li> + <li> + <span class="glyphicon glyphicon-hand-right"></span> + <span class="glyphicon-class">glyphicon glyphicon-hand-right</span> + </li> + <li> + <span class="glyphicon glyphicon-hand-left"></span> + <span class="glyphicon-class">glyphicon glyphicon-hand-left</span> + </li> + <li> + <span class="glyphicon glyphicon-hand-up"></span> + <span class="glyphicon-class">glyphicon glyphicon-hand-up</span> + </li> + <li> + <span class="glyphicon glyphicon-hand-down"></span> + <span class="glyphicon-class">glyphicon glyphicon-hand-down</span> + </li> + <li> + <span class="glyphicon glyphicon-circle-arrow-right"></span> + <span class="glyphicon-class">glyphicon glyphicon-circle-arrow-right</span> + </li> + <li> + <span class="glyphicon glyphicon-circle-arrow-left"></span> + <span class="glyphicon-class">glyphicon glyphicon-circle-arrow-left</span> + </li> + <li> + <span class="glyphicon glyphicon-circle-arrow-up"></span> + <span class="glyphicon-class">glyphicon glyphicon-circle-arrow-up</span> + </li> + <li> + <span class="glyphicon glyphicon-circle-arrow-down"></span> + <span class="glyphicon-class">glyphicon glyphicon-circle-arrow-down</span> + </li> + <li> + <span class="glyphicon glyphicon-globe"></span> + <span class="glyphicon-class">glyphicon glyphicon-globe</span> + </li> + <li> + <span class="glyphicon glyphicon-wrench"></span> + <span class="glyphicon-class">glyphicon glyphicon-wrench</span> + </li> + <li> + <span class="glyphicon glyphicon-tasks"></span> + <span class="glyphicon-class">glyphicon glyphicon-tasks</span> + </li> + <li> + <span class="glyphicon glyphicon-filter"></span> + <span class="glyphicon-class">glyphicon glyphicon-filter</span> + </li> + <li> + <span class="glyphicon glyphicon-briefcase"></span> + <span class="glyphicon-class">glyphicon glyphicon-briefcase</span> + </li> + <li> + <span class="glyphicon glyphicon-fullscreen"></span> + <span class="glyphicon-class">glyphicon glyphicon-fullscreen</span> + </li> + <li> + <span class="glyphicon glyphicon-dashboard"></span> + <span class="glyphicon-class">glyphicon glyphicon-dashboard</span> + </li> + <li> + <span class="glyphicon glyphicon-paperclip"></span> + <span class="glyphicon-class">glyphicon glyphicon-paperclip</span> + </li> + <li> + <span class="glyphicon glyphicon-heart-empty"></span> + <span class="glyphicon-class">glyphicon glyphicon-heart-empty</span> + </li> + <li> + <span class="glyphicon glyphicon-link"></span> + <span class="glyphicon-class">glyphicon glyphicon-link</span> + </li> + <li> + <span class="glyphicon glyphicon-phone"></span> + <span class="glyphicon-class">glyphicon glyphicon-phone</span> + </li> + <li> + <span class="glyphicon glyphicon-pushpin"></span> + <span class="glyphicon-class">glyphicon glyphicon-pushpin</span> + </li> + <li> + <span class="glyphicon glyphicon-usd"></span> + <span class="glyphicon-class">glyphicon glyphicon-usd</span> + </li> + <li> + <span class="glyphicon glyphicon-gbp"></span> + <span class="glyphicon-class">glyphicon glyphicon-gbp</span> + </li> + <li> + <span class="glyphicon glyphicon-sort"></span> + <span class="glyphicon-class">glyphicon glyphicon-sort</span> + </li> + <li> + <span class="glyphicon glyphicon-sort-by-alphabet"></span> + <span class="glyphicon-class">glyphicon glyphicon-sort-by-alphabet</span> + </li> + <li> + <span class="glyphicon glyphicon-sort-by-alphabet-alt"></span> + <span class="glyphicon-class">glyphicon glyphicon-sort-by-alphabet-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-sort-by-order"></span> + <span class="glyphicon-class">glyphicon glyphicon-sort-by-order</span> + </li> + <li> + <span class="glyphicon glyphicon-sort-by-order-alt"></span> + <span class="glyphicon-class">glyphicon glyphicon-sort-by-order-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-sort-by-attributes"></span> + <span class="glyphicon-class">glyphicon glyphicon-sort-by-attributes</span> + </li> + <li> + <span class="glyphicon glyphicon-sort-by-attributes-alt"></span> + <span class="glyphicon-class">glyphicon glyphicon-sort-by-attributes-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-unchecked"></span> + <span class="glyphicon-class">glyphicon glyphicon-unchecked</span> + </li> + <li> + <span class="glyphicon glyphicon-expand"></span> + <span class="glyphicon-class">glyphicon glyphicon-expand</span> + </li> + <li> + <span class="glyphicon glyphicon-collapse-down"></span> + <span class="glyphicon-class">glyphicon glyphicon-collapse-down</span> + </li> + <li> + <span class="glyphicon glyphicon-collapse-up"></span> + <span class="glyphicon-class">glyphicon glyphicon-collapse-up</span> + </li> + <li> + <span class="glyphicon glyphicon-log-in"></span> + <span class="glyphicon-class">glyphicon glyphicon-log-in</span> + </li> + <li> + <span class="glyphicon glyphicon-flash"></span> + <span class="glyphicon-class">glyphicon glyphicon-flash</span> + </li> + <li> + <span class="glyphicon glyphicon-log-out"></span> + <span class="glyphicon-class">glyphicon glyphicon-log-out</span> + </li> + <li> + <span class="glyphicon glyphicon-new-window"></span> + <span class="glyphicon-class">glyphicon glyphicon-new-window</span> + </li> + <li> + <span class="glyphicon glyphicon-record"></span> + <span class="glyphicon-class">glyphicon glyphicon-record</span> + </li> + <li> + <span class="glyphicon glyphicon-save"></span> + <span class="glyphicon-class">glyphicon glyphicon-save</span> + </li> + <li> + <span class="glyphicon glyphicon-open"></span> + <span class="glyphicon-class">glyphicon glyphicon-open</span> + </li> + <li> + <span class="glyphicon glyphicon-saved"></span> + <span class="glyphicon-class">glyphicon glyphicon-saved</span> + </li> + <li> + <span class="glyphicon glyphicon-import"></span> + <span class="glyphicon-class">glyphicon glyphicon-import</span> + </li> + <li> + <span class="glyphicon glyphicon-export"></span> + <span class="glyphicon-class">glyphicon glyphicon-export</span> + </li> + <li> + <span class="glyphicon glyphicon-send"></span> + <span class="glyphicon-class">glyphicon glyphicon-send</span> + </li> + <li> + <span class="glyphicon glyphicon-floppy-disk"></span> + <span class="glyphicon-class">glyphicon glyphicon-floppy-disk</span> + </li> + <li> + <span class="glyphicon glyphicon-floppy-saved"></span> + <span class="glyphicon-class">glyphicon glyphicon-floppy-saved</span> + </li> + <li> + <span class="glyphicon glyphicon-floppy-remove"></span> + <span class="glyphicon-class">glyphicon glyphicon-floppy-remove</span> + </li> + <li> + <span class="glyphicon glyphicon-floppy-save"></span> + <span class="glyphicon-class">glyphicon glyphicon-floppy-save</span> + </li> + <li> + <span class="glyphicon glyphicon-floppy-open"></span> + <span class="glyphicon-class">glyphicon glyphicon-floppy-open</span> + </li> + <li> + <span class="glyphicon glyphicon-credit-card"></span> + <span class="glyphicon-class">glyphicon glyphicon-credit-card</span> + </li> + <li> + <span class="glyphicon glyphicon-transfer"></span> + <span class="glyphicon-class">glyphicon glyphicon-transfer</span> + </li> + <li> + <span class="glyphicon glyphicon-cutlery"></span> + <span class="glyphicon-class">glyphicon glyphicon-cutlery</span> + </li> + <li> + <span class="glyphicon glyphicon-header"></span> + <span class="glyphicon-class">glyphicon glyphicon-header</span> + </li> + <li> + <span class="glyphicon glyphicon-compressed"></span> + <span class="glyphicon-class">glyphicon glyphicon-compressed</span> + </li> + <li> + <span class="glyphicon glyphicon-earphone"></span> + <span class="glyphicon-class">glyphicon glyphicon-earphone</span> + </li> + <li> + <span class="glyphicon glyphicon-phone-alt"></span> + <span class="glyphicon-class">glyphicon glyphicon-phone-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-tower"></span> + <span class="glyphicon-class">glyphicon glyphicon-tower</span> + </li> + <li> + <span class="glyphicon glyphicon-stats"></span> + <span class="glyphicon-class">glyphicon glyphicon-stats</span> + </li> + <li> + <span class="glyphicon glyphicon-sd-video"></span> + <span class="glyphicon-class">glyphicon glyphicon-sd-video</span> + </li> + <li> + <span class="glyphicon glyphicon-hd-video"></span> + <span class="glyphicon-class">glyphicon glyphicon-hd-video</span> + </li> + <li> + <span class="glyphicon glyphicon-subtitles"></span> + <span class="glyphicon-class">glyphicon glyphicon-subtitles</span> + </li> + <li> + <span class="glyphicon glyphicon-sound-stereo"></span> + <span class="glyphicon-class">glyphicon glyphicon-sound-stereo</span> + </li> + <li> + <span class="glyphicon glyphicon-sound-dolby"></span> + <span class="glyphicon-class">glyphicon glyphicon-sound-dolby</span> + </li> + <li> + <span class="glyphicon glyphicon-sound-5-1"></span> + <span class="glyphicon-class">glyphicon glyphicon-sound-5-1</span> + </li> + <li> + <span class="glyphicon glyphicon-sound-6-1"></span> + <span class="glyphicon-class">glyphicon glyphicon-sound-6-1</span> + </li> + <li> + <span class="glyphicon glyphicon-sound-7-1"></span> + <span class="glyphicon-class">glyphicon glyphicon-sound-7-1</span> + </li> + <li> + <span class="glyphicon glyphicon-copyright-mark"></span> + <span class="glyphicon-class">glyphicon glyphicon-copyright-mark</span> + </li> + <li> + <span class="glyphicon glyphicon-registration-mark"></span> + <span class="glyphicon-class">glyphicon glyphicon-registration-mark</span> + </li> + <li> + <span class="glyphicon glyphicon-cloud-download"></span> + <span class="glyphicon-class">glyphicon glyphicon-cloud-download</span> + </li> + <li> + <span class="glyphicon glyphicon-cloud-upload"></span> + <span class="glyphicon-class">glyphicon glyphicon-cloud-upload</span> + </li> + <li> + <span class="glyphicon glyphicon-tree-conifer"></span> + <span class="glyphicon-class">glyphicon glyphicon-tree-conifer</span> + </li> + <li> + <span class="glyphicon glyphicon-tree-deciduous"></span> + <span class="glyphicon-class">glyphicon glyphicon-tree-deciduous</span> + </li> + <li> + <span class="glyphicon glyphicon-cd"></span> + <span class="glyphicon-class">glyphicon glyphicon-cd</span> + </li> + <li> + <span class="glyphicon glyphicon-save-file"></span> + <span class="glyphicon-class">glyphicon glyphicon-save-file</span> + </li> + <li> + <span class="glyphicon glyphicon-open-file"></span> + <span class="glyphicon-class">glyphicon glyphicon-open-file</span> + </li> + <li> + <span class="glyphicon glyphicon-level-up"></span> + <span class="glyphicon-class">glyphicon glyphicon-level-up</span> + </li> + <li> + <span class="glyphicon glyphicon-copy"></span> + <span class="glyphicon-class">glyphicon glyphicon-copy</span> + </li> + <li> + <span class="glyphicon glyphicon-paste"></span> + <span class="glyphicon-class">glyphicon glyphicon-paste</span> + </li> + <li> + <span class="glyphicon glyphicon-alert"></span> + <span class="glyphicon-class">glyphicon glyphicon-alert</span> + </li> + <li> + <span class="glyphicon glyphicon-equalizer"></span> + <span class="glyphicon-class">glyphicon glyphicon-equalizer</span> + </li> + <li> + <span class="glyphicon glyphicon-king"></span> + <span class="glyphicon-class">glyphicon glyphicon-king</span> + </li> + <li> + <span class="glyphicon glyphicon-queen"></span> + <span class="glyphicon-class">glyphicon glyphicon-queen</span> + </li> + <li> + <span class="glyphicon glyphicon-pawn"></span> + <span class="glyphicon-class">glyphicon glyphicon-pawn</span> + </li> + <li> + <span class="glyphicon glyphicon-bishop"></span> + <span class="glyphicon-class">glyphicon glyphicon-bishop</span> + </li> + <li> + <span class="glyphicon glyphicon-knight"></span> + <span class="glyphicon-class">glyphicon glyphicon-knight</span> + </li> + <li> + <span class="glyphicon glyphicon-baby-formula"></span> + <span class="glyphicon-class">glyphicon glyphicon-baby-formula</span> + </li> + <li> + <span class="glyphicon glyphicon-tent"></span> + <span class="glyphicon-class">glyphicon glyphicon-tent</span> + </li> + <li> + <span class="glyphicon glyphicon-blackboard"></span> + <span class="glyphicon-class">glyphicon glyphicon-blackboard</span> + </li> + <li> + <span class="glyphicon glyphicon-bed"></span> + <span class="glyphicon-class">glyphicon glyphicon-bed</span> + </li> + <li> + <span class="glyphicon glyphicon-apple"></span> + <span class="glyphicon-class">glyphicon glyphicon-apple</span> + </li> + <li> + <span class="glyphicon glyphicon-erase"></span> + <span class="glyphicon-class">glyphicon glyphicon-erase</span> + </li> + <li> + <span class="glyphicon glyphicon-hourglass"></span> + <span class="glyphicon-class">glyphicon glyphicon-hourglass</span> + </li> + <li> + <span class="glyphicon glyphicon-lamp"></span> + <span class="glyphicon-class">glyphicon glyphicon-lamp</span> + </li> + <li> + <span class="glyphicon glyphicon-duplicate"></span> + <span class="glyphicon-class">glyphicon glyphicon-duplicate</span> + </li> + <li> + <span class="glyphicon glyphicon-piggy-bank"></span> + <span class="glyphicon-class">glyphicon glyphicon-piggy-bank</span> + </li> + <li> + <span class="glyphicon glyphicon-scissors"></span> + <span class="glyphicon-class">glyphicon glyphicon-scissors</span> + </li> + <li> + <span class="glyphicon glyphicon-bitcoin"></span> + <span class="glyphicon-class">glyphicon glyphicon-bitcoin</span> + </li> + <li> + <span class="glyphicon glyphicon-btc"></span> + <span class="glyphicon-class">glyphicon glyphicon-btc</span> + </li> + <li> + <span class="glyphicon glyphicon-xbt"></span> + <span class="glyphicon-class">glyphicon glyphicon-xbt</span> + </li> + <li> + <span class="glyphicon glyphicon-yen"></span> + <span class="glyphicon-class">glyphicon glyphicon-yen</span> + </li> + <li> + <span class="glyphicon glyphicon-jpy"></span> + <span class="glyphicon-class">glyphicon glyphicon-jpy</span> + </li> + <li> + <span class="glyphicon glyphicon-ruble"></span> + <span class="glyphicon-class">glyphicon glyphicon-ruble</span> + </li> + <li> + <span class="glyphicon glyphicon-rub"></span> + <span class="glyphicon-class">glyphicon glyphicon-rub</span> + </li> + <li> + <span class="glyphicon glyphicon-scale"></span> + <span class="glyphicon-class">glyphicon glyphicon-scale</span> + </li> + <li> + <span class="glyphicon glyphicon-ice-lolly"></span> + <span class="glyphicon-class">glyphicon glyphicon-ice-lolly</span> + </li> + <li> + <span class="glyphicon glyphicon-ice-lolly-tasted"></span> + <span class="glyphicon-class">glyphicon glyphicon-ice-lolly-tasted</span> + </li> + <li> + <span class="glyphicon glyphicon-education"></span> + <span class="glyphicon-class">glyphicon glyphicon-education</span> + </li> + <li> + <span class="glyphicon glyphicon-option-horizontal"></span> + <span class="glyphicon-class">glyphicon glyphicon-option-horizontal</span> + </li> + <li> + <span class="glyphicon glyphicon-option-vertical"></span> + <span class="glyphicon-class">glyphicon glyphicon-option-vertical</span> + </li> + <li> + <span class="glyphicon glyphicon-menu-hamburger"></span> + <span class="glyphicon-class">glyphicon glyphicon-menu-hamburger</span> + </li> + <li> + <span class="glyphicon glyphicon-modal-window"></span> + <span class="glyphicon-class">glyphicon glyphicon-modal-window</span> + </li> + <li> + <span class="glyphicon glyphicon-oil"></span> + <span class="glyphicon-class">glyphicon glyphicon-oil</span> + </li> + <li> + <span class="glyphicon glyphicon-grain"></span> + <span class="glyphicon-class">glyphicon glyphicon-grain</span> + </li> + <li> + <span class="glyphicon glyphicon-sunglasses"></span> + <span class="glyphicon-class">glyphicon glyphicon-sunglasses</span> + </li> + <li> + <span class="glyphicon glyphicon-text-size"></span> + <span class="glyphicon-class">glyphicon glyphicon-text-size</span> + </li> + <li> + <span class="glyphicon glyphicon-text-color"></span> + <span class="glyphicon-class">glyphicon glyphicon-text-color</span> + </li> + <li> + <span class="glyphicon glyphicon-text-background"></span> + <span class="glyphicon-class">glyphicon glyphicon-text-background</span> + </li> + <li> + <span class="glyphicon glyphicon-object-align-top"></span> + <span class="glyphicon-class">glyphicon glyphicon-object-align-top</span> + </li> + <li> + <span class="glyphicon glyphicon-object-align-bottom"></span> + <span class="glyphicon-class">glyphicon glyphicon-object-align-bottom</span> + </li> + <li> + <span class="glyphicon glyphicon-object-align-horizontal"></span> + <span class="glyphicon-class">glyphicon glyphicon-object-align-horizontal</span> + </li> + <li> + <span class="glyphicon glyphicon-object-align-left"></span> + <span class="glyphicon-class">glyphicon glyphicon-object-align-left</span> + </li> + <li> + <span class="glyphicon glyphicon-object-align-vertical"></span> + <span class="glyphicon-class">glyphicon glyphicon-object-align-vertical</span> + </li> + <li> + <span class="glyphicon glyphicon-object-align-right"></span> + <span class="glyphicon-class">glyphicon glyphicon-object-align-right</span> + </li> + <li> + <span class="glyphicon glyphicon-triangle-right"></span> + <span class="glyphicon-class">glyphicon glyphicon-triangle-right</span> + </li> + <li> + <span class="glyphicon glyphicon-triangle-left"></span> + <span class="glyphicon-class">glyphicon glyphicon-triangle-left</span> + </li> + <li> + <span class="glyphicon glyphicon-triangle-bottom"></span> + <span class="glyphicon-class">glyphicon glyphicon-triangle-bottom</span> + </li> + <li> + <span class="glyphicon glyphicon-triangle-top"></span> + <span class="glyphicon-class">glyphicon glyphicon-triangle-top</span> + </li> + <li> + <span class="glyphicon glyphicon-console"></span> + <span class="glyphicon-class">glyphicon glyphicon-console</span> + </li> + <li> + <span class="glyphicon glyphicon-superscript"></span> + <span class="glyphicon-class">glyphicon glyphicon-superscript</span> + </li> + <li> + <span class="glyphicon glyphicon-subscript"></span> + <span class="glyphicon-class">glyphicon glyphicon-subscript</span> + </li> + <li> + <span class="glyphicon glyphicon-menu-left"></span> + <span class="glyphicon-class">glyphicon glyphicon-menu-left</span> + </li> + <li> + <span class="glyphicon glyphicon-menu-right"></span> + <span class="glyphicon-class">glyphicon glyphicon-menu-right</span> + </li> + <li> + <span class="glyphicon glyphicon-menu-down"></span> + <span class="glyphicon-class">glyphicon glyphicon-menu-down</span> + </li> + <li> + <span class="glyphicon glyphicon-menu-up"></span> + <span class="glyphicon-class">glyphicon glyphicon-menu-up</span> + </li> + </ul> + </div> + <!-- /#ion-icons --> + + </div> + <!-- /.tab-content --> + </div> + <!-- /.nav-tabs-custom --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + </section> + <!-- /.content --> + </div> + <!-- /.content-wrapper --> + <footer class="main-footer"> + <div class="pull-right hidden-xs"> + <b>Version</b> 2.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/UI/modals.html b/public/bower_components/admin-lte/pages/UI/modals.html new file mode 100644 index 0000000..faa87ec --- /dev/null +++ b/public/bower_components/admin-lte/pages/UI/modals.html @@ -0,0 +1,911 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Modals</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> + <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="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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="callout callout-info"> + <h4>Reminder!</h4> + Instructions for how to use modals are available on the + <a href="http://getbootstrap.com/javascript/#modals">Bootstrap documentation</a> + </div> + + <div class="row"> + <div class="col-xs-12"> + <div class="box box-default"> + <div class="box-header with-border"> + <h3 class="box-title">Modal Examples</h3> + </div> + <div class="box-body"> + <button type="button" class="btn btn-default" data-toggle="modal" data-target="#modal-default"> + Launch Default Modal + </button> + <button type="button" class="btn btn-info" data-toggle="modal" data-target="#modal-info"> + Launch Info Modal + </button> + <button type="button" class="btn btn-danger" data-toggle="modal" data-target="#modal-danger"> + Launch Danger Modal + </button> + <button type="button" class="btn btn-warning" data-toggle="modal" data-target="#modal-warning"> + Launch Warning Modal + </button> + <button type="button" class="btn btn-success" data-toggle="modal" data-target="#modal-success"> + Launch Success Modal + </button> + </div> + </div> + </div> + </div> + + <div class="modal fade" id="modal-default"> + <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">Default Modal</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 class="modal modal-primary fade" id="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">Primary Modal</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 class="modal modal-info fade" id="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">Info Modal</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 class="modal modal-warning fade" id="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">Warning Modal</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 class="modal modal-success fade" id="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">Success Modal</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 class="modal modal-danger fade" id="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">Danger Modal</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 --> + </section> + <!-- /.content --> + </div> + <!-- /.content-wrapper --> + + <footer class="main-footer"> + <div class="pull-right hidden-xs"> + <b>Version</b> 2.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/UI/sliders.html b/public/bower_components/admin-lte/pages/UI/sliders.html new file mode 100644 index 0000000..a7265b8 --- /dev/null +++ b/public/bower_components/admin-lte/pages/UI/sliders.html @@ -0,0 +1,821 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | UI Sliders</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- bootstrap slider --> + <link rel="stylesheet" href="../../plugins/bootstrap-slider/slider.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" + href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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">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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +<!-- Bootstrap slider --> +<script src="../../plugins/bootstrap-slider/bootstrap-slider.js"></script> +<script> + $(function () { + /* BOOTSTRAP SLIDER */ + $('.slider').slider() + }) +</script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/UI/timeline.html b/public/bower_components/admin-lte/pages/UI/timeline.html new file mode 100644 index 0000000..a669da6 --- /dev/null +++ b/public/bower_components/admin-lte/pages/UI/timeline.html @@ -0,0 +1,913 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Timeline</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/calendar.html b/public/bower_components/admin-lte/pages/calendar.html new file mode 100644 index 0000000..fe09416 --- /dev/null +++ b/public/bower_components/admin-lte/pages/calendar.html @@ -0,0 +1,983 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Calendar</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../bower_components/Ionicons/css/ionicons.min.css"> + <!-- fullCalendar --> + <link rel="stylesheet" href="../bower_components/fullcalendar/dist/fullcalendar.min.css"> + <link rel="stylesheet" href="../bower_components/fullcalendar/dist/fullcalendar.print.min.css" media="print"> + <!-- Theme style --> + <link rel="stylesheet" href="../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" + href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- jQuery UI 1.11.4 --> +<script src="../bower_components/jquery-ui/jquery-ui.min.js"></script> +<!-- Slimscroll --> +<script src="../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../dist/js/demo.js"></script> +<!-- fullCalendar --> +<script src="../bower_components/moment/moment.js"></script> +<script src="../bower_components/fullcalendar/dist/fullcalendar.min.js"></script> +<!-- Page specific script --> +<script> + $(function () { + + /* initialize the external events + -----------------------------------------------------------------*/ + function init_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 + }) + + }) + } + + init_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 + init_events(event) + + //Remove event from text input + $('#new-event').val('') + }) + }) +</script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/charts/chartjs.html b/public/bower_components/admin-lte/pages/charts/chartjs.html new file mode 100644 index 0000000..ade25b8 --- /dev/null +++ b/public/bower_components/admin-lte/pages/charts/chartjs.html @@ -0,0 +1,922 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | ChartJS</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" + href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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 type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="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" style="height:250px"></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 type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="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" style="height:250px"></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 type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="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" style="height:250px"></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 type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="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" style="height:230px"></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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- ChartJS --> +<script src="../../bower_components/chart.js/Chart.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></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 : true, + //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 : true, + //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 : true + } + + barChartOptions.datasetFill = false + barChart.Bar(barChartData, barChartOptions) + }) +</script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/charts/flot.html b/public/bower_components/admin-lte/pages/charts/flot.html new file mode 100644 index 0000000..68398c6 --- /dev/null +++ b/public/bower_components/admin-lte/pages/charts/flot.html @@ -0,0 +1,1132 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Flot Charts</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" + href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><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 class="active"><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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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> + Flot 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">Flot</li> + </ol> + </section> + + <!-- Main content --> + <section class="content"> + <div class="row"> + <div class="col-xs-12"> + <!-- interactive chart --> + <div class="box box-primary"> + <div class="box-header with-border"> + <i class="fa fa-bar-chart-o"></i> + + <h3 class="box-title">Interactive Area Chart</h3> + + <div class="box-tools pull-right"> + Real time + <div class="btn-group" id="realtime" data-toggle="btn-toggle"> + <button type="button" class="btn btn-default btn-xs active" data-toggle="on">On</button> + <button type="button" class="btn btn-default btn-xs" data-toggle="off">Off</button> + </div> + </div> + </div> + <div class="box-body"> + <div id="interactive" style="height: 300px;"></div> + </div> + <!-- /.box-body--> + </div> + <!-- /.box --> + + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + <div class="row"> + <div class="col-md-6"> + <!-- Line chart --> + <div class="box box-primary"> + <div class="box-header with-border"> + <i class="fa fa-bar-chart-o"></i> + + <h3 class="box-title">Line Chart</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button> + </div> + </div> + <div class="box-body"> + <div id="line-chart" style="height: 300px;"></div> + </div> + <!-- /.box-body--> + </div> + <!-- /.box --> + + <!-- Area chart --> + <div class="box box-primary"> + <div class="box-header with-border"> + <i class="fa fa-bar-chart-o"></i> + + <h3 class="box-title">Full Width Area Chart</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button> + </div> + </div> + <div class="box-body"> + <div id="area-chart" style="height: 338px;" class="full-width-chart"></div> + </div> + <!-- /.box-body--> + </div> + <!-- /.box --> + + </div> + <!-- /.col --> + + <div class="col-md-6"> + <!-- Bar chart --> + <div class="box box-primary"> + <div class="box-header with-border"> + <i class="fa fa-bar-chart-o"></i> + + <h3 class="box-title">Bar Chart</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button> + </div> + </div> + <div class="box-body"> + <div id="bar-chart" style="height: 300px;"></div> + </div> + <!-- /.box-body--> + </div> + <!-- /.box --> + + <!-- Donut chart --> + <div class="box box-primary"> + <div class="box-header with-border"> + <i class="fa fa-bar-chart-o"></i> + + <h3 class="box-title">Donut Chart</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button> + </div> + </div> + <div class="box-body"> + <div id="donut-chart" style="height: 300px;"></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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +<!-- FLOT CHARTS --> +<script src="../../bower_components/Flot/jquery.flot.js"></script> +<!-- FLOT RESIZE PLUGIN - allows the chart to redraw when the window is resized --> +<script src="../../bower_components/Flot/jquery.flot.resize.js"></script> +<!-- FLOT PIE PLUGIN - also used to draw donut charts --> +<script src="../../bower_components/Flot/jquery.flot.pie.js"></script> +<!-- FLOT CATEGORIES PLUGIN - Used to draw bar charts --> +<script src="../../bower_components/Flot/jquery.flot.categories.js"></script> +<!-- Page script --> +<script> + $(function () { + /* + * Flot Interactive Chart + * ----------------------- + */ + // We use an inline data source in the example, usually data would + // be fetched from a server + var data = [], totalPoints = 100 + + function getRandomData() { + + if (data.length > 0) + data = data.slice(1) + + // Do a random walk + while (data.length < totalPoints) { + + var prev = data.length > 0 ? data[data.length - 1] : 50, + y = prev + Math.random() * 10 - 5 + + if (y < 0) { + y = 0 + } else if (y > 100) { + y = 100 + } + + data.push(y) + } + + // Zip the generated y values with the x values + var res = [] + for (var i = 0; i < data.length; ++i) { + res.push([i, data[i]]) + } + + return res + } + + var interactive_plot = $.plot('#interactive', [getRandomData()], { + grid : { + borderColor: '#f3f3f3', + borderWidth: 1, + tickColor : '#f3f3f3' + }, + series: { + shadowSize: 0, // Drawing is faster without shadows + color : '#3c8dbc' + }, + lines : { + fill : true, //Converts the line chart to area chart + color: '#3c8dbc' + }, + yaxis : { + min : 0, + max : 100, + show: true + }, + xaxis : { + show: true + } + }) + + var updateInterval = 500 //Fetch data ever x milliseconds + var realtime = 'on' //If == to on then fetch data every x seconds. else stop fetching + function update() { + + interactive_plot.setData([getRandomData()]) + + // Since the axes don't change, we don't need to call plot.setupGrid() + interactive_plot.draw() + if (realtime === 'on') + setTimeout(update, updateInterval) + } + + //INITIALIZE REALTIME DATA FETCHING + if (realtime === 'on') { + update() + } + //REALTIME TOGGLE + $('#realtime .btn').click(function () { + if ($(this).data('toggle') === 'on') { + realtime = 'on' + } + else { + realtime = 'off' + } + update() + }) + /* + * END INTERACTIVE CHART + */ + + /* + * LINE CHART + * ---------- + */ + //LINE randomly generated data + + var sin = [], cos = [] + for (var i = 0; i < 14; i += 0.5) { + sin.push([i, Math.sin(i)]) + cos.push([i, Math.cos(i)]) + } + var line_data1 = { + data : sin, + color: '#3c8dbc' + } + var line_data2 = { + data : cos, + color: '#00c0ef' + } + $.plot('#line-chart', [line_data1, line_data2], { + grid : { + hoverable : true, + borderColor: '#f3f3f3', + borderWidth: 1, + tickColor : '#f3f3f3' + }, + series: { + shadowSize: 0, + lines : { + show: true + }, + points : { + show: true + } + }, + lines : { + fill : false, + color: ['#3c8dbc', '#f56954'] + }, + yaxis : { + show: true + }, + xaxis : { + show: true + } + }) + //Initialize tooltip on hover + $('<div class="tooltip-inner" id="line-chart-tooltip"></div>').css({ + position: 'absolute', + display : 'none', + opacity : 0.8 + }).appendTo('body') + $('#line-chart').bind('plothover', function (event, pos, item) { + + if (item) { + var x = item.datapoint[0].toFixed(2), + y = item.datapoint[1].toFixed(2) + + $('#line-chart-tooltip').html(item.series.label + ' of ' + x + ' = ' + y) + .css({ top: item.pageY + 5, left: item.pageX + 5 }) + .fadeIn(200) + } else { + $('#line-chart-tooltip').hide() + } + + }) + /* END LINE CHART */ + + /* + * FULL WIDTH STATIC AREA CHART + * ----------------- + */ + var areaData = [[2, 88.0], [3, 93.3], [4, 102.0], [5, 108.5], [6, 115.7], [7, 115.6], + [8, 124.6], [9, 130.3], [10, 134.3], [11, 141.4], [12, 146.5], [13, 151.7], [14, 159.9], + [15, 165.4], [16, 167.8], [17, 168.7], [18, 169.5], [19, 168.0]] + $.plot('#area-chart', [areaData], { + grid : { + borderWidth: 0 + }, + series: { + shadowSize: 0, // Drawing is faster without shadows + color : '#00c0ef' + }, + lines : { + fill: true //Converts the line chart to area chart + }, + yaxis : { + show: false + }, + xaxis : { + show: false + } + }) + + /* END AREA CHART */ + + /* + * BAR CHART + * --------- + */ + + var bar_data = { + data : [['January', 10], ['February', 8], ['March', 4], ['April', 13], ['May', 17], ['June', 9]], + color: '#3c8dbc' + } + $.plot('#bar-chart', [bar_data], { + grid : { + borderWidth: 1, + borderColor: '#f3f3f3', + tickColor : '#f3f3f3' + }, + series: { + bars: { + show : true, + barWidth: 0.5, + align : 'center' + } + }, + xaxis : { + mode : 'categories', + tickLength: 0 + } + }) + /* END BAR CHART */ + + /* + * DONUT CHART + * ----------- + */ + + var donutData = [ + { label: 'Series2', data: 30, color: '#3c8dbc' }, + { label: 'Series3', data: 20, color: '#0073b7' }, + { label: 'Series4', data: 50, color: '#00c0ef' } + ] + $.plot('#donut-chart', donutData, { + series: { + pie: { + show : true, + radius : 1, + innerRadius: 0.5, + label : { + show : true, + radius : 2 / 3, + formatter: labelFormatter, + threshold: 0.1 + } + + } + }, + legend: { + show: false + } + }) + /* + * END DONUT CHART + */ + + }) + + /* + * Custom Label formatter + * ---------------------- + */ + function labelFormatter(label, series) { + return '<div style="font-size:13px; text-align:center; padding:2px; color: #fff; font-weight: 600;">' + + label + + '<br>' + + Math.round(series.percent) + '%</div>' + } +</script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/charts/inline.html b/public/bower_components/admin-lte/pages/charts/inline.html new file mode 100644 index 0000000..f3dfd8d --- /dev/null +++ b/public/bower_components/admin-lte/pages/charts/inline.html @@ -0,0 +1,1306 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Inline Charts</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><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 class="active"><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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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> + Inline Charts + <small>multiple types of charts</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">Inline Charts</li> + </ol> + </section> + + <!-- Main content --> + <section class="content"> + + <!-- row --> + <div class="row"> + <div class="col-xs-12"> + <!-- jQuery Knob --> + <div class="box box-solid"> + <div class="box-header"> + <i class="fa fa-bar-chart-o"></i> + + <h3 class="box-title">jQuery Knob</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-default btn-sm" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-default btn-sm" data-widget="remove"><i class="fa fa-times"></i> + </button> + </div> + </div> + <!-- /.box-header --> + <div class="box-body"> + <div class="row"> + <div class="col-xs-6 col-md-3 text-center"> + <input type="text" class="knob" value="30" data-width="90" data-height="90" data-fgColor="#3c8dbc"> + + <div class="knob-label">New Visitors</div> + </div> + <!-- ./col --> + <div class="col-xs-6 col-md-3 text-center"> + <input type="text" class="knob" value="70" data-width="90" data-height="90" data-fgColor="#f56954"> + + <div class="knob-label">Bounce Rate</div> + </div> + <!-- ./col --> + <div class="col-xs-6 col-md-3 text-center"> + <input type="text" class="knob" value="-80" data-min="-150" data-max="150" data-width="90" data-height="90" data-fgColor="#00a65a"> + + <div class="knob-label">Server Load</div> + </div> + <!-- ./col --> + <div class="col-xs-6 col-md-3 text-center"> + <input type="text" class="knob" value="40" data-width="90" data-height="90" data-fgColor="#00c0ef"> + + <div class="knob-label">Disk Space</div> + </div> + <!-- ./col --> + </div> + <!-- /.row --> + + <div class="row"> + <div class="col-xs-6 text-center"> + <input type="text" class="knob" value="90" data-width="90" data-height="90" data-fgColor="#932ab6"> + + <div class="knob-label">Bandwidth</div> + </div> + <!-- ./col --> + <div class="col-xs-6 text-center"> + <input type="text" class="knob" value="50" data-width="90" data-height="90" data-fgColor="#39CCCC"> + + <div class="knob-label">CPU</div> + </div> + <!-- ./col --> + </div> + <!-- /.row --> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + <div class="row"> + <div class="col-xs-12"> + <div class="box box-solid"> + <div class="box-header"> + <i class="fa fa-bar-chart-o"></i> + + <h3 class="box-title">jQuery Knob Different Sizes</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-default btn-sm" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-default btn-sm" data-widget="remove"><i class="fa fa-times"></i> + </button> + </div> + </div> + <!-- /.box-header --> + <div class="box-body"> + <div class="row"> + <div class="col-xs-6 col-md-3 text-center"> + <input type="text" class="knob" value="30" data-width="90" data-height="90" data-fgColor="#3c8dbc" data-readonly="true"> + + <div class="knob-label">data-width="90"</div> + </div> + <!-- ./col --> + <div class="col-xs-6 col-md-3 text-center"> + <input type="text" class="knob" value="30" data-width="120" data-height="120" data-fgColor="#f56954"> + + <div class="knob-label">data-width="120"</div> + </div> + <!-- ./col --> + <div class="col-xs-6 col-md-3 text-center"> + <input type="text" class="knob" value="30" data-thickness="0.1" data-width="90" data-height="90" data-fgColor="#00a65a"> + + <div class="knob-label">data-thickness="0.1"</div> + </div> + <!-- ./col --> + <div class="col-xs-6 col-md-3 text-center"> + <input type="text" class="knob" data-thickness="0.2" data-angleArc="250" data-angleOffset="-125" value="30" data-width="120" data-height="120" data-fgColor="#00c0ef"> + + <div class="knob-label">data-angleArc="250"</div> + </div> + <!-- ./col --> + </div> + <!-- /.row --> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + <div class="row"> + <div class="col-xs-12"> + <div class="box box-solid"> + <div class="box-header"> + <i class="fa fa-bar-chart-o"></i> + + <h3 class="box-title">jQuery Knob Tron Style</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-default btn-sm" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-default btn-sm" data-widget="remove"><i class="fa fa-times"></i> + </button> + </div> + </div> + <!-- /.box-header --> + <div class="box-body"> + <div class="row"> + <div class="col-xs-6 col-md-3 text-center"> + <input type="text" class="knob" value="80" data-skin="tron" data-thickness="0.2" data-width="90" data-height="90" data-fgColor="#3c8dbc" data-readonly="true"> + + <div class="knob-label">data-width="90"</div> + </div> + <!-- ./col --> + <div class="col-xs-6 col-md-3 text-center"> + <input type="text" class="knob" value="60" data-skin="tron" data-thickness="0.2" data-width="120" data-height="120" data-fgColor="#f56954"> + + <div class="knob-label">data-width="120"</div> + </div> + <!-- ./col --> + <div class="col-xs-6 col-md-3 text-center"> + <input type="text" class="knob" value="10" data-skin="tron" data-thickness="0.1" data-width="90" data-height="90" data-fgColor="#00a65a"> + + <div class="knob-label">data-thickness="0.1"</div> + </div> + <!-- ./col --> + <div class="col-xs-6 col-md-3 text-center"> + <input type="text" class="knob" value="100" data-skin="tron" data-thickness="0.2" data-angleArc="250" data-angleOffset="-125" data-width="120" data-height="120" data-fgColor="#00c0ef"> + + <div class="knob-label">data-angleArc="250"</div> + </div> + <!-- ./col --> + </div> + <!-- /.row --> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + <!-- callout --> + <div class="callout callout-info"> + <h4>The following was created using data tags</h4> + + <p>The following three inline (sparkline) chart have been initialized to read and interpret data tags</p> + </div> + <!-- /.callout --> + + <div class="row"> + <div class="col-md-4"> + <div class="box box-solid"> + <div class="box-header"> + <h3 class="box-title text-danger">Sparkline Pie</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-default btn-sm"><i class="fa fa-refresh"></i></button> + </div> + </div> + <!-- /.box-header --> + <div class="box-body text-center"> + <div class="sparkline" data-type="pie" data-offset="90" data-width="100px" data-height="100px"> + 6,4,8 + </div> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + + <div class="col-md-4"> + <div class="box box-solid"> + <div class="box-header"> + <h3 class="box-title text-blue">Sparkline line</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-default btn-sm"><i class="fa fa-refresh"></i></button> + </div> + </div> + <!-- /.box-header --> + <div class="box-body text-center"> + <div class="sparkline" data-type="line" data-spot-Radius="3" data-highlight-Spot-Color="#f39c12" data-highlight-Line-Color="#222" data-min-Spot-Color="#f56954" data-max-Spot-Color="#00a65a" data-spot-Color="#39CCCC" data-offset="90" data-width="100%" data-height="100px" data-line-Width="2" data-line-Color="#39CCCC" data-fill-Color="rgba(57, 204, 204, 0.08)"> + 6,4,7,8,4,3,2,2,5,6,7,4,1,5,7,9,9,8,7,6 + </div> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + + <div class="col-md-4"> + <div class="box box-solid"> + <div class="box-header"> + <h3 class="box-title text-warning">Sparkline Bar</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-default btn-sm"><i class="fa fa-refresh"></i></button> + </div> + </div> + <!-- /.box-header --> + <div class="box-body text-center"> + <div class="sparkline" data-type="bar" data-width="97%" data-height="100px" data-bar-Width="14" data-bar-Spacing="7" data-bar-Color="#f39c12"> + 6,4,8, 9, 10, 5, 13, 18, 21, 7, 9 + </div> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + <div class="row"> + <div class="col-xs-12"> + <div class="box box-solid"> + <div class="box-header"> + <h3 class="box-title">Sparkline examples</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-default btn-sm" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-default btn-sm" data-widget="remove"><i class="fa fa-times"></i> + </button> + </div> + </div> + <!-- /.box-header --> + <div id="myBody" class="box-body"> + <div class="row"> + <div class="col-sm-6"> + <p> + Mouse speed <span id="mousespeed">Loading..</span> + </p> + + <p> + Inline <span class="sparkline-1">10,8,9,3,5,8,5</span> + line graphs + <span class="sparkline-1">8,4,0,0,0,0,1,4,4,10,10,10,10,0,0,0,4,6,5,9,10</span> + </p> + + <p> + Bar charts <span class="sparkbar">10,8,9,3,5,8,5</span> + negative values: <span class="sparkbar">-3,1,2,0,3,-1</span> + stacked: <span class="sparkbar">0:2,2:4,4:2,4:1</span> + </p> + + <p> + Composite inline + <span id="compositeline">8,4,0,0,0,0,1,4,4,10,10,10,10,0,0,0,4,6,5,9,10</span> + </p> + + <p> + Inline with normal range + <span id="normalline">8,4,0,0,0,0,1,4,4,10,10,10,10,0,0,0,4,6,5,9,10</span> + </p> + + <p> + Composite bar + <span id="compositebar">4,6,7,7,4,3,2,1,4</span> + </p> + + <p> + Discrete + <span class="discrete1">4,6,7,7,4,3,2,1,4,4,5,6,7,6,6,2,4,5</span><br> + + Discrete with threshold + <span id="discrete2">4,6,7,7,4,3,2,1,4</span> + </p> + + <p> + Bullet charts<br> + <span class="sparkbullet">10,12,12,9,7</span><br> + <span class="sparkbullet">14,12,12,9,7</span><br> + <span class="sparkbullet">10,12,14,9,7</span><br> + </p> + </div> + <!-- /.col --> + <div class="col-sm-6"> + <p> + Customize size and colours + <span id="linecustom">10,8,9,3,5,8,5,7</span> + </p> + + <p> + Tristate charts + <span class="sparktristate">1,1,0,1,-1,-1,1,-1,0,0,1,1</span><br> + (think games won, lost or drawn) + </p> + + <p> + Tristate chart using a colour map: + <span class="sparktristatecols">1,2,0,2,-1,-2,1,-2,0,0,1,1</span> + </p> + + <p> + Box Plot: <span class="sparkboxplot">4,27,34,52,54,59,61,68,78,82,85,87,91,93,100</span><br> + Pre-computed box plot <span class="sparkboxplotraw">Loading..</span> + </p> + + <p> + Pie charts + <span class="sparkpie">1,1,2</span> + <span class="sparkpie">1,5</span> + <span class="sparkpie">20,50,80</span> + </p> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + </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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- SlimScroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +<!-- jQuery Knob --> +<script src="../../bower_components/jquery-knob/js/jquery.knob.js"></script> +<!-- Sparkline --> +<script src="../../bower_components/jquery-sparkline/dist/jquery.sparkline.min.js"></script> +<!-- page script --> +<script> + $(function () { + /* jQueryKnob */ + + $(".knob").knob({ + /*change : function (value) { + //console.log("change : " + value); + }, + release : function (value) { + console.log("release : " + value); + }, + cancel : function () { + console.log("cancel : " + this.value); + },*/ + draw: function () { + + // "tron" case + if (this.$.data('skin') == 'tron') { + + var a = this.angle(this.cv) // Angle + , sa = this.startAngle // Previous start angle + , sat = this.startAngle // Start angle + , ea // Previous end angle + , eat = sat + a // End angle + , r = true; + + this.g.lineWidth = this.lineWidth; + + this.o.cursor + && (sat = eat - 0.3) + && (eat = eat + 0.3); + + if (this.o.displayPrevious) { + ea = this.startAngle + this.angle(this.value); + this.o.cursor + && (sa = ea - 0.3) + && (ea = ea + 0.3); + this.g.beginPath(); + this.g.strokeStyle = this.previousColor; + this.g.arc(this.xy, this.xy, this.radius - this.lineWidth, sa, ea, false); + this.g.stroke(); + } + + this.g.beginPath(); + this.g.strokeStyle = r ? this.o.fgColor : this.fgColor; + this.g.arc(this.xy, this.xy, this.radius - this.lineWidth, sat, eat, false); + this.g.stroke(); + + this.g.lineWidth = 2; + this.g.beginPath(); + this.g.strokeStyle = this.o.fgColor; + this.g.arc(this.xy, this.xy, this.radius - this.lineWidth + 1 + this.lineWidth * 2 / 3, 0, 2 * Math.PI, false); + this.g.stroke(); + + return false; + } + } + }); + /* END JQUERY KNOB */ + + //INITIALIZE SPARKLINE CHARTS + $(".sparkline").each(function () { + var $this = $(this); + $this.sparkline('html', $this.data()); + }); + + /* SPARKLINE DOCUMENTATION EXAMPLES http://omnipotent.net/jquery.sparkline/#s-about */ + drawDocSparklines(); + drawMouseSpeedDemo(); + + }); + function drawDocSparklines() { + + // Bar + line composite charts + $('#compositebar').sparkline('html', {type: 'bar', barColor: '#aaf'}); + $('#compositebar').sparkline([4, 1, 5, 7, 9, 9, 8, 7, 6, 6, 4, 7, 8, 4, 3, 2, 2, 5, 6, 7], + {composite: true, fillColor: false, lineColor: 'red'}); + + + // Line charts taking their values from the tag + $('.sparkline-1').sparkline(); + + // Larger line charts for the docs + $('.largeline').sparkline('html', + {type: 'line', height: '2.5em', width: '4em'}); + + // Customized line chart + $('#linecustom').sparkline('html', + { + height: '1.5em', width: '8em', lineColor: '#f00', fillColor: '#ffa', + minSpotColor: false, maxSpotColor: false, spotColor: '#77f', spotRadius: 3 + }); + + // Bar charts using inline values + $('.sparkbar').sparkline('html', {type: 'bar'}); + + $('.barformat').sparkline([1, 3, 5, 3, 8], { + type: 'bar', + tooltipFormat: '{{value:levels}} - {{value}}', + tooltipValueLookups: { + levels: $.range_map({':2': 'Low', '3:6': 'Medium', '7:': 'High'}) + } + }); + + // Tri-state charts using inline values + $('.sparktristate').sparkline('html', {type: 'tristate'}); + $('.sparktristatecols').sparkline('html', + {type: 'tristate', colorMap: {'-2': '#fa7', '2': '#44f'}}); + + // Composite line charts, the second using values supplied via javascript + $('#compositeline').sparkline('html', {fillColor: false, changeRangeMin: 0, chartRangeMax: 10}); + $('#compositeline').sparkline([4, 1, 5, 7, 9, 9, 8, 7, 6, 6, 4, 7, 8, 4, 3, 2, 2, 5, 6, 7], + {composite: true, fillColor: false, lineColor: 'red', changeRangeMin: 0, chartRangeMax: 10}); + + // Line charts with normal range marker + $('#normalline').sparkline('html', + {fillColor: false, normalRangeMin: -1, normalRangeMax: 8}); + $('#normalExample').sparkline('html', + {fillColor: false, normalRangeMin: 80, normalRangeMax: 95, normalRangeColor: '#4f4'}); + + // Discrete charts + $('.discrete1').sparkline('html', + {type: 'discrete', lineColor: 'blue', xwidth: 18}); + $('#discrete2').sparkline('html', + {type: 'discrete', lineColor: 'blue', thresholdColor: 'red', thresholdValue: 4}); + + // Bullet charts + $('.sparkbullet').sparkline('html', {type: 'bullet'}); + + // Pie charts + $('.sparkpie').sparkline('html', {type: 'pie', height: '1.0em'}); + + // Box plots + $('.sparkboxplot').sparkline('html', {type: 'box'}); + $('.sparkboxplotraw').sparkline([1, 3, 5, 8, 10, 15, 18], + {type: 'box', raw: true, showOutliers: true, target: 6}); + + // Box plot with specific field order + $('.boxfieldorder').sparkline('html', { + type: 'box', + tooltipFormatFieldlist: ['med', 'lq', 'uq'], + tooltipFormatFieldlistKey: 'field' + }); + + // click event demo sparkline + $('.clickdemo').sparkline(); + $('.clickdemo').bind('sparklineClick', function (ev) { + var sparkline = ev.sparklines[0], + region = sparkline.getCurrentRegionFields(); + value = region.y; + alert("Clicked on x=" + region.x + " y=" + region.y); + }); + + // mouseover event demo sparkline + $('.mouseoverdemo').sparkline(); + $('.mouseoverdemo').bind('sparklineRegionChange', function (ev) { + var sparkline = ev.sparklines[0], + region = sparkline.getCurrentRegionFields(); + value = region.y; + $('.mouseoverregion').text("x=" + region.x + " y=" + region.y); + }).bind('mouseleave', function () { + $('.mouseoverregion').text(''); + }); + } + + /** + ** Draw the little mouse speed animated graph + ** This just attaches a handler to the mousemove event to see + ** (roughly) how far the mouse has moved + ** and then updates the display a couple of times a second via + ** setTimeout() + **/ + function drawMouseSpeedDemo() { + var mrefreshinterval = 500; // update display every 500ms + var lastmousex = -1; + var lastmousey = -1; + var lastmousetime; + var mousetravel = 0; + var mpoints = []; + var mpoints_max = 30; + $('html').mousemove(function (e) { + var mousex = e.pageX; + var mousey = e.pageY; + if (lastmousex > -1) { + mousetravel += Math.max(Math.abs(mousex - lastmousex), Math.abs(mousey - lastmousey)); + } + lastmousex = mousex; + lastmousey = mousey; + }); + var mdraw = function () { + var md = new Date(); + var timenow = md.getTime(); + if (lastmousetime && lastmousetime != timenow) { + var pps = Math.round(mousetravel / (timenow - lastmousetime) * 1000); + mpoints.push(pps); + if (mpoints.length > mpoints_max) + mpoints.splice(0, 1); + mousetravel = 0; + $('#mousespeed').sparkline(mpoints, {width: mpoints.length * 2, tooltipSuffix: ' pixels per second'}); + } + lastmousetime = timenow; + setTimeout(mdraw, mrefreshinterval); + }; + // We could use setInterval instead, but I prefer to do it this way + setTimeout(mdraw, mrefreshinterval); + } +</script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/charts/morris.html b/public/bower_components/admin-lte/pages/charts/morris.html new file mode 100644 index 0000000..0bcae19 --- /dev/null +++ b/public/bower_components/admin-lte/pages/charts/morris.html @@ -0,0 +1,911 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Morris.js Charts</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Morris charts --> + <link rel="stylesheet" href="../../bower_components/morris.js/morris.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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 type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="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 type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="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 type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="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 type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- Morris.js charts --> +<script src="../../bower_components/raphael/raphael.min.js"></script> +<script src="../../bower_components/morris.js/morris.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +<!-- page script --> +<script> + $(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> diff --git a/public/bower_components/admin-lte/pages/examples/404.html b/public/bower_components/admin-lte/pages/examples/404.html new file mode 100644 index 0000000..7ea2c12 --- /dev/null +++ b/public/bower_components/admin-lte/pages/examples/404.html @@ -0,0 +1,759 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | 404 Page not found</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li> + <li><a href="profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/examples/500.html b/public/bower_components/admin-lte/pages/examples/500.html new file mode 100644 index 0000000..620f95d --- /dev/null +++ b/public/bower_components/admin-lte/pages/examples/500.html @@ -0,0 +1,760 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | 500 Error</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li> + <li><a href="profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/examples/blank.html b/public/bower_components/admin-lte/pages/examples/blank.html new file mode 100644 index 0000000..700b53e --- /dev/null +++ b/public/bower_components/admin-lte/pages/examples/blank.html @@ -0,0 +1,664 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Blank Page</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">Hot</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li> + <li><a href="profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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 type="button" class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" + title="Collapse"> + <i class="fa fa-minus"></i></button> + <button type="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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- SlimScroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +<script> + $(document).ready(function () { + $('.sidebar-menu').tree() + }) +</script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/examples/invoice-print.html b/public/bower_components/admin-lte/pages/examples/invoice-print.html new file mode 100644 index 0000000..ee095c8 --- /dev/null +++ b/public/bower_components/admin-lte/pages/examples/invoice-print.html @@ -0,0 +1,173 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Invoice</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</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 --> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/examples/invoice.html b/public/bower_components/admin-lte/pages/examples/invoice.html new file mode 100644 index 0000000..8b04410 --- /dev/null +++ b/public/bower_components/admin-lte/pages/examples/invoice.html @@ -0,0 +1,889 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Invoice</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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 type="button" class="btn btn-success pull-right"><i class="fa fa-credit-card"></i> Submit Payment + </button> + <button type="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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/examples/lockscreen.html b/public/bower_components/admin-lte/pages/examples/lockscreen.html new file mode 100644 index 0000000..a7f7424 --- /dev/null +++ b/public/bower_components/admin-lte/pages/examples/lockscreen.html @@ -0,0 +1,77 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Lockscreen</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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 type="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-2016 <b><a href="https://adminlte.io" class="text-black">Almsaeed Studio</a></b><br> + All rights reserved + </div> +</div> +<!-- /.center --> + +<!-- jQuery 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/examples/login.html b/public/bower_components/admin-lte/pages/examples/login.html new file mode 100644 index 0000000..1e47e84 --- /dev/null +++ b/public/bower_components/admin-lte/pages/examples/login.html @@ -0,0 +1,97 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Log in</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- iCheck --> + <link rel="stylesheet" href="../../plugins/iCheck/square/blue.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- iCheck --> +<script src="../../plugins/iCheck/icheck.min.js"></script> +<script> + $(function () { + $('input').iCheck({ + checkboxClass: 'icheckbox_square-blue', + radioClass: 'iradio_square-blue', + increaseArea: '20%' /* optional */ + }); + }); +</script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/examples/pace.html b/public/bower_components/admin-lte/pages/examples/pace.html new file mode 100644 index 0000000..0f2eaf8 --- /dev/null +++ b/public/bower_components/admin-lte/pages/examples/pace.html @@ -0,0 +1,689 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Pace Page</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.css"> + <!-- Pace style --> + <link rel="stylesheet" href="../../plugins/pace/pace.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" + href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">Hot</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li> + <li><a href="profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li class="active"><a href="pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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> + Pace page + <small>Loading example</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">Pace 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 type="button" class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" + title="Collapse"> + <i class="fa fa-minus"></i></button> + <button type="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"> + Pace loading works automatically on page. You can still implement it with ajax requests by adding this js: + <br/><code>$(document).ajaxStart(function() { Pace.restart(); });</code> + <br/> + <div class="row"> + <div class="col-xs-12 text-center"> + <button type="button" class="btn btn-default btn-lrg ajax" title="Ajax Request"> + <i class="fa fa-spin fa-refresh"></i> Get External Content + </button> + </div> + </div> + <div class="ajax-content"> + </div> + </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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- PACE --> +<script src="../../bower_components/PACE/pace.min.js"></script> +<!-- SlimScroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +<!-- page script --> +<script type="text/javascript"> + // To make Pace works on Ajax calls + $(document).ajaxStart(function () { + Pace.restart() + }) + $('.ajax').click(function () { + $.ajax({ + url: '#', success: function (result) { + $('.ajax-content').html('<hr>Ajax Request Completed !') + } + }) + }) +</script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/examples/profile.html b/public/bower_components/admin-lte/pages/examples/profile.html new file mode 100644 index 0000000..af61d0a --- /dev/null +++ b/public/bower_components/admin-lte/pages/examples/profile.html @@ -0,0 +1,1088 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | User Profile</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li> + <li class="active"><a href="profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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> + User Profile + </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">User profile</li> + </ol> + </section> + + <!-- Main content --> + <section class="content"> + + <div class="row"> + <div class="col-md-3"> + + <!-- Profile Image --> + <div class="box box-primary"> + <div class="box-body box-profile"> + <img class="profile-user-img img-responsive img-circle" src="../../dist/img/user4-128x128.jpg" alt="User profile picture"> + + <h3 class="profile-username text-center">Nina Mcintire</h3> + + <p class="text-muted text-center">Software Engineer</p> + + <ul class="list-group list-group-unbordered"> + <li class="list-group-item"> + <b>Followers</b> <a class="pull-right">1,322</a> + </li> + <li class="list-group-item"> + <b>Following</b> <a class="pull-right">543</a> + </li> + <li class="list-group-item"> + <b>Friends</b> <a class="pull-right">13,287</a> + </li> + </ul> + + <a href="#" class="btn btn-primary btn-block"><b>Follow</b></a> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + + <!-- About Me Box --> + <div class="box box-primary"> + <div class="box-header with-border"> + <h3 class="box-title">About Me</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <strong><i class="fa fa-book margin-r-5"></i> Education</strong> + + <p class="text-muted"> + B.S. in Computer Science from the University of Tennessee at Knoxville + </p> + + <hr> + + <strong><i class="fa fa-map-marker margin-r-5"></i> Location</strong> + + <p class="text-muted">Malibu, California</p> + + <hr> + + <strong><i class="fa fa-pencil margin-r-5"></i> Skills</strong> + + <p> + <span class="label label-danger">UI Design</span> + <span class="label label-success">Coding</span> + <span class="label label-info">Javascript</span> + <span class="label label-warning">PHP</span> + <span class="label label-primary">Node.js</span> + </p> + + <hr> + + <strong><i class="fa fa-file-text-o margin-r-5"></i> Notes</strong> + + <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam fermentum enim neque.</p> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + <div class="col-md-9"> + <div class="nav-tabs-custom"> + <ul class="nav nav-tabs"> + <li class="active"><a href="#activity" data-toggle="tab">Activity</a></li> + <li><a href="#timeline" data-toggle="tab">Timeline</a></li> + <li><a href="#settings" data-toggle="tab">Settings</a></li> + </ul> + <div class="tab-content"> + <div class="active tab-pane" id="activity"> + <!-- Post --> + <div class="post"> + <div class="user-block"> + <img class="img-circle img-bordered-sm" src="../../dist/img/user1-128x128.jpg" alt="user image"> + <span class="username"> + <a href="#">Jonathan Burke Jr.</a> + <a href="#" class="pull-right btn-box-tool"><i class="fa fa-times"></i></a> + </span> + <span class="description">Shared publicly - 7:30 PM today</span> + </div> + <!-- /.user-block --> + <p> + Lorem ipsum represents a long-held tradition for designers, + typographers and the like. Some people hate it and argue for + its demise, but others ignore the hate as they create awesome + tools to help create filler text for everyone from bacon lovers + to Charlie Sheen fans. + </p> + <ul class="list-inline"> + <li><a href="#" class="link-black text-sm"><i class="fa fa-share margin-r-5"></i> Share</a></li> + <li><a href="#" class="link-black text-sm"><i class="fa fa-thumbs-o-up margin-r-5"></i> Like</a> + </li> + <li class="pull-right"> + <a href="#" class="link-black text-sm"><i class="fa fa-comments-o margin-r-5"></i> Comments + (5)</a></li> + </ul> + + <input class="form-control input-sm" type="text" placeholder="Type a comment"> + </div> + <!-- /.post --> + + <!-- Post --> + <div class="post clearfix"> + <div class="user-block"> + <img class="img-circle img-bordered-sm" src="../../dist/img/user7-128x128.jpg" alt="User Image"> + <span class="username"> + <a href="#">Sarah Ross</a> + <a href="#" class="pull-right btn-box-tool"><i class="fa fa-times"></i></a> + </span> + <span class="description">Sent you a message - 3 days ago</span> + </div> + <!-- /.user-block --> + <p> + Lorem ipsum represents a long-held tradition for designers, + typographers and the like. Some people hate it and argue for + its demise, but others ignore the hate as they create awesome + tools to help create filler text for everyone from bacon lovers + to Charlie Sheen fans. + </p> + + <form class="form-horizontal"> + <div class="form-group margin-bottom-none"> + <div class="col-sm-9"> + <input class="form-control input-sm" placeholder="Response"> + </div> + <div class="col-sm-3"> + <button type="submit" class="btn btn-danger pull-right btn-block btn-sm">Send</button> + </div> + </div> + </form> + </div> + <!-- /.post --> + + <!-- Post --> + <div class="post"> + <div class="user-block"> + <img class="img-circle img-bordered-sm" src="../../dist/img/user6-128x128.jpg" alt="User Image"> + <span class="username"> + <a href="#">Adam Jones</a> + <a href="#" class="pull-right btn-box-tool"><i class="fa fa-times"></i></a> + </span> + <span class="description">Posted 5 photos - 5 days ago</span> + </div> + <!-- /.user-block --> + <div class="row margin-bottom"> + <div class="col-sm-6"> + <img class="img-responsive" src="../../dist/img/photo1.png" alt="Photo"> + </div> + <!-- /.col --> + <div class="col-sm-6"> + <div class="row"> + <div class="col-sm-6"> + <img class="img-responsive" src="../../dist/img/photo2.png" alt="Photo"> + <br> + <img class="img-responsive" src="../../dist/img/photo3.jpg" alt="Photo"> + </div> + <!-- /.col --> + <div class="col-sm-6"> + <img class="img-responsive" src="../../dist/img/photo4.jpg" alt="Photo"> + <br> + <img class="img-responsive" src="../../dist/img/photo1.png" alt="Photo"> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + <ul class="list-inline"> + <li><a href="#" class="link-black text-sm"><i class="fa fa-share margin-r-5"></i> Share</a></li> + <li><a href="#" class="link-black text-sm"><i class="fa fa-thumbs-o-up margin-r-5"></i> Like</a> + </li> + <li class="pull-right"> + <a href="#" class="link-black text-sm"><i class="fa fa-comments-o margin-r-5"></i> Comments + (5)</a></li> + </ul> + + <input class="form-control input-sm" type="text" placeholder="Type a comment"> + </div> + <!-- /.post --> + </div> + <!-- /.tab-pane --> + <div class="tab-pane" id="timeline"> + <!-- The timeline --> + <ul class="timeline timeline-inverse"> + <!-- 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 --> + <li> + <i class="fa fa-clock-o bg-gray"></i> + </li> + </ul> + </div> + <!-- /.tab-pane --> + + <div class="tab-pane" id="settings"> + <form class="form-horizontal"> + <div class="form-group"> + <label for="inputName" class="col-sm-2 control-label">Name</label> + + <div class="col-sm-10"> + <input type="email" class="form-control" id="inputName" placeholder="Name"> + </div> + </div> + <div class="form-group"> + <label for="inputEmail" class="col-sm-2 control-label">Email</label> + + <div class="col-sm-10"> + <input type="email" class="form-control" id="inputEmail" placeholder="Email"> + </div> + </div> + <div class="form-group"> + <label for="inputName" class="col-sm-2 control-label">Name</label> + + <div class="col-sm-10"> + <input type="text" class="form-control" id="inputName" placeholder="Name"> + </div> + </div> + <div class="form-group"> + <label for="inputExperience" class="col-sm-2 control-label">Experience</label> + + <div class="col-sm-10"> + <textarea class="form-control" id="inputExperience" placeholder="Experience"></textarea> + </div> + </div> + <div class="form-group"> + <label for="inputSkills" class="col-sm-2 control-label">Skills</label> + + <div class="col-sm-10"> + <input type="text" class="form-control" id="inputSkills" placeholder="Skills"> + </div> + </div> + <div class="form-group"> + <div class="col-sm-offset-2 col-sm-10"> + <div class="checkbox"> + <label> + <input type="checkbox"> I agree to the <a href="#">terms and conditions</a> + </label> + </div> + </div> + </div> + <div class="form-group"> + <div class="col-sm-offset-2 col-sm-10"> + <button type="submit" class="btn btn-danger">Submit</button> + </div> + </div> + </form> + </div> + <!-- /.tab-pane --> + </div> + <!-- /.tab-content --> + </div> + <!-- /.nav-tabs-custom --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + </section> + <!-- /.content --> + </div> + <!-- /.content-wrapper --> + <footer class="main-footer"> + <div class="pull-right hidden-xs"> + <b>Version</b> 2.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/examples/register.html b/public/bower_components/admin-lte/pages/examples/register.html new file mode 100644 index 0000000..29d8ccf --- /dev/null +++ b/public/bower_components/admin-lte/pages/examples/register.html @@ -0,0 +1,102 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Registration Page</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- iCheck --> + <link rel="stylesheet" href="../../plugins/iCheck/square/blue.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- iCheck --> +<script src="../../plugins/iCheck/icheck.min.js"></script> +<script> + $(function () { + $('input').iCheck({ + checkboxClass: 'icheckbox_square-blue', + radioClass: 'iradio_square-blue', + increaseArea: '20%' /* optional */ + }); + }); +</script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/forms/advanced.html b/public/bower_components/admin-lte/pages/forms/advanced.html new file mode 100644 index 0000000..dc7f8d5 --- /dev/null +++ b/public/bower_components/admin-lte/pages/forms/advanced.html @@ -0,0 +1,1230 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Advanced form elements</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- daterange picker --> + <link rel="stylesheet" href="../../bower_components/bootstrap-daterangepicker/daterangepicker.css"> + <!-- bootstrap datepicker --> + <link rel="stylesheet" href="../../bower_components/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css"> + <!-- iCheck for checkboxes and radio inputs --> + <link rel="stylesheet" href="../../plugins/iCheck/all.css"> + <!-- Bootstrap Color Picker --> + <link rel="stylesheet" href="../../bower_components/bootstrap-colorpicker/dist/css/bootstrap-colorpicker.min.css"> + <!-- Bootstrap time Picker --> + <link rel="stylesheet" href="../../plugins/timepicker/bootstrap-timepicker.min.css"> + <!-- Select2 --> + <link rel="stylesheet" href="../../bower_components/select2/dist/css/select2.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" + href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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"> + + <!-- SELECT2 EXAMPLE --> + <div class="box box-default"> + <div class="box-header with-border"> + <h3 class="box-title">Select2</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-remove"></i></button> + </div> + </div> + <!-- /.box-header --> + <div class="box-body"> + <div class="row"> + <div class="col-md-6"> + <div class="form-group"> + <label>Minimal</label> + <select class="form-control select2" style="width: 100%;"> + <option selected="selected">Alabama</option> + <option>Alaska</option> + <option>California</option> + <option>Delaware</option> + <option>Tennessee</option> + <option>Texas</option> + <option>Washington</option> + </select> + </div> + <!-- /.form-group --> + <div class="form-group"> + <label>Disabled</label> + <select class="form-control select2" disabled="disabled" style="width: 100%;"> + <option selected="selected">Alabama</option> + <option>Alaska</option> + <option>California</option> + <option>Delaware</option> + <option>Tennessee</option> + <option>Texas</option> + <option>Washington</option> + </select> + </div> + <!-- /.form-group --> + </div> + <!-- /.col --> + <div class="col-md-6"> + <div class="form-group"> + <label>Multiple</label> + <select class="form-control select2" multiple="multiple" data-placeholder="Select a State" + style="width: 100%;"> + <option>Alabama</option> + <option>Alaska</option> + <option>California</option> + <option>Delaware</option> + <option>Tennessee</option> + <option>Texas</option> + <option>Washington</option> + </select> + </div> + <!-- /.form-group --> + <div class="form-group"> + <label>Disabled Result</label> + <select class="form-control select2" style="width: 100%;"> + <option selected="selected">Alabama</option> + <option>Alaska</option> + <option disabled="disabled">California (disabled)</option> + <option>Delaware</option> + <option>Tennessee</option> + <option>Texas</option> + <option>Washington</option> + </select> + </div> + <!-- /.form-group --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + </div> + <!-- /.box-body --> + <div class="box-footer"> + Visit <a href="https://select2.github.io/">Select2 documentation</a> for more examples and information about + the plugin. + </div> + </div> + <!-- /.box --> + + <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 --> + <div class="form-group"> + <label>Date:</label> + + <div class="input-group date"> + <div class="input-group-addon"> + <i class="fa fa-calendar"></i> + </div> + <input type="text" class="form-control pull-right" id="datepicker"> + </div> + <!-- /.input group --> + </div> + <!-- /.form group --> + + <!-- 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 type="button" class="btn btn-default pull-right" id="daterange-btn"> + <span> + <i class="fa fa-calendar"></i> Date range picker + </span> + <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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- Select2 --> +<script src="../../bower_components/select2/dist/js/select2.full.min.js"></script> +<!-- InputMask --> +<script src="../../plugins/input-mask/jquery.inputmask.js"></script> +<script src="../../plugins/input-mask/jquery.inputmask.date.extensions.js"></script> +<script src="../../plugins/input-mask/jquery.inputmask.extensions.js"></script> +<!-- date-range-picker --> +<script src="../../bower_components/moment/min/moment.min.js"></script> +<script src="../../bower_components/bootstrap-daterangepicker/daterangepicker.js"></script> +<!-- bootstrap datepicker --> +<script src="../../bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script> +<!-- bootstrap color picker --> +<script src="../../bower_components/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.min.js"></script> +<!-- bootstrap time picker --> +<script src="../../plugins/timepicker/bootstrap-timepicker.min.js"></script> +<!-- SlimScroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- iCheck 1.0.1 --> +<script src="../../plugins/iCheck/icheck.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +<!-- Page script --> +<script> + $(function () { + //Initialize Select2 Elements + $('.select2').select2() + + //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(1, 'days'), moment().subtract(1, 'days')], + 'Last 7 Days' : [moment().subtract(6, 'days'), moment()], + 'Last 30 Days': [moment().subtract(29, 'days'), moment()], + 'This Month' : [moment().startOf('month'), moment().endOf('month')], + 'Last Month' : [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')] + }, + startDate: moment().subtract(29, 'days'), + endDate : moment() + }, + function (start, end) { + $('#daterange-btn span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY')) + } + ) + + //Date picker + $('#datepicker').datepicker({ + autoclose: true + }) + + //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> diff --git a/public/bower_components/admin-lte/pages/forms/editors.html b/public/bower_components/admin-lte/pages/forms/editors.html new file mode 100644 index 0000000..bedf07b --- /dev/null +++ b/public/bower_components/admin-lte/pages/forms/editors.html @@ -0,0 +1,811 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Editors</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.css"> + <!-- bootstrap wysihtml5 - text editor --> + <link rel="stylesheet" href="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" + href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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 type="button" class="btn btn-info btn-sm" data-widget="collapse" data-toggle="tooltip" + title="Collapse"> + <i class="fa fa-minus"></i></button> + <button type="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 type="button" class="btn btn-default btn-sm" data-widget="collapse" data-toggle="tooltip" + title="Collapse"> + <i class="fa fa-minus"></i></button> + <button type="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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +<!-- CK Editor --> +<script src="../../bower_components/ckeditor/ckeditor.js"></script> +<!-- Bootstrap WYSIHTML5 --> +<script src="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script> +<script> + $(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> diff --git a/public/bower_components/admin-lte/pages/forms/general.html b/public/bower_components/admin-lte/pages/forms/general.html new file mode 100644 index 0000000..4ff53b5 --- /dev/null +++ b/public/bower_components/admin-lte/pages/forms/general.html @@ -0,0 +1,1119 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | General Form Elements</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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 with-border"> + <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 with-border"> + <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 with-border"> + <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 with-border"> + <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 type="button" class="btn btn-info btn-flat">Go!</button> + </span> + </div> + <!-- /input-group --> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + + </div> + <!--/.col (left) --> + <!-- right column --> + <div class="col-md-6"> + <!-- Horizontal Form --> + <div class="box box-info"> + <div class="box-header with-border"> + <h3 class="box-title">Horizontal Form</h3> + </div> + <!-- /.box-header --> + <!-- form start --> + <form class="form-horizontal"> + <div class="box-body"> + <div class="form-group"> + <label for="inputEmail3" class="col-sm-2 control-label">Email</label> + + <div class="col-sm-10"> + <input type="email" class="form-control" id="inputEmail3" placeholder="Email"> + </div> + </div> + <div class="form-group"> + <label for="inputPassword3" class="col-sm-2 control-label">Password</label> + + <div class="col-sm-10"> + <input type="password" class="form-control" id="inputPassword3" placeholder="Password"> + </div> + </div> + <div class="form-group"> + <div class="col-sm-offset-2 col-sm-10"> + <div class="checkbox"> + <label> + <input type="checkbox"> Remember me + </label> + </div> + </div> + </div> + </div> + <!-- /.box-body --> + <div class="box-footer"> + <button type="submit" class="btn btn-default">Cancel</button> + <button type="submit" class="btn btn-info pull-right">Sign in</button> + </div> + <!-- /.box-footer --> + </form> + </div> + <!-- /.box --> + <!-- general form elements disabled --> + <div class="box box-warning"> + <div class="box-header with-border"> + <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 ..."> + <span class="help-block">Help block with success</span> + </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 ..."> + <span class="help-block">Help block with warning</span> + </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 ..."> + <span class="help-block">Help block with error</span> + </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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/layout/boxed.html b/public/bower_components/admin-lte/pages/layout/boxed.html new file mode 100644 index 0000000..d02e250 --- /dev/null +++ b/public/bower_components/admin-lte/pages/layout/boxed.html @@ -0,0 +1,657 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Boxed Layout</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<!-- ADD THE CLASS layout-boxed TO GET A BOXED LAYOUT --> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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="#">Layout</a></li> + <li class="active">Boxed</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 type="button" class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"> + <i class="fa fa-minus"></i></button> + <button type="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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- SlimScroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/layout/collapsed-sidebar.html b/public/bower_components/admin-lte/pages/layout/collapsed-sidebar.html new file mode 100644 index 0000000..aa68c7a --- /dev/null +++ b/public/bower_components/admin-lte/pages/layout/collapsed-sidebar.html @@ -0,0 +1,663 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Collapsed Sidebar Layout</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<!-- ADD THE CLASS sidebar-collapse TO HIDE THE SIDEBAR PRIOR TO LOADING THE SITE --> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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="#">Layout</a></li> + <li class="active">Collapsed Sidebar</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 type="button" class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"> + <i class="fa fa-minus"></i></button> + <button type="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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- SlimScroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/layout/fixed.html b/public/bower_components/admin-lte/pages/layout/fixed.html new file mode 100644 index 0000000..ad8ff0d --- /dev/null +++ b/public/bower_components/admin-lte/pages/layout/fixed.html @@ -0,0 +1,663 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Fixed Layout</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<!-- ADD THE CLASS fixed TO GET A FIXED HEADER AND SIDEBAR LAYOUT --> +<!-- the fixed layout is not compatible with sidebar-mini --> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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="#">Layout</a></li> + <li class="active">Fixed</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 type="button" class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"> + <i class="fa fa-minus"></i></button> + <button type="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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- SlimScroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/layout/top-nav.html b/public/bower_components/admin-lte/pages/layout/top-nav.html new file mode 100644 index 0000000..d933173 --- /dev/null +++ b/public/bower_components/admin-lte/pages/layout/top-nav.html @@ -0,0 +1,293 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Top Navigation</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<!-- ADD THE CLASS layout-top-nav TO REMOVE THE SIDEBAR. --> +<body class="hold-transition 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="row"> + <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> + </div> + <!-- /.row --> + </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><a href="#">Layout</a></li> + <li class="active">Top Navigation</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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">Almsaeed Studio</a>.</strong> All rights + reserved. + </div> + <!-- /.container --> + </footer> +</div> +<!-- ./wrapper --> + +<!-- jQuery 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- SlimScroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/mailbox/compose.html b/public/bower_components/admin-lte/pages/mailbox/compose.html new file mode 100644 index 0000000..f0a787d --- /dev/null +++ b/public/bower_components/admin-lte/pages/mailbox/compose.html @@ -0,0 +1,760 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Compose Message</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.css"> + <!-- iCheck --> + <link rel="stylesheet" href="../../plugins/iCheck/flat/blue.css"> + <!-- bootstrap wysihtml5 - text editor --> + <link rel="stylesheet" href="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li> + <a href="mailbox.html">Inbox + <span class="pull-right-container"> + <span class="label label-primary pull-right">13</span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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 type="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-warning 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 type="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 type="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 type="reset" 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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- Slimscroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +<!-- iCheck --> +<script src="../../plugins/iCheck/icheck.min.js"></script> +<!-- Bootstrap WYSIHTML5 --> +<script src="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script> +<!-- Page Script --> +<script> + $(function () { + //Add text editor + $("#compose-textarea").wysihtml5(); + }); +</script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/mailbox/mailbox.html b/public/bower_components/admin-lte/pages/mailbox/mailbox.html new file mode 100644 index 0000000..8f5dbbd --- /dev/null +++ b/public/bower_components/admin-lte/pages/mailbox/mailbox.html @@ -0,0 +1,940 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Mailbox</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.css"> + <!-- iCheck --> + <link rel="stylesheet" href="../../plugins/iCheck/flat/blue.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li class="active"> + <a href="mailbox.html">Inbox + <span class="pull-right-container"> + <span class="label label-primary pull-right">13</span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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 type="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-warning 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 type="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 type="button" class="btn btn-default btn-sm checkbox-toggle"><i class="fa fa-square-o"></i> + </button> + <div class="btn-group"> + <button type="button" class="btn btn-default btn-sm"><i class="fa fa-trash-o"></i></button> + <button type="button" class="btn btn-default btn-sm"><i class="fa fa-reply"></i></button> + <button type="button" class="btn btn-default btn-sm"><i class="fa fa-share"></i></button> + </div> + <!-- /.btn-group --> + <button type="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 type="button" class="btn btn-default btn-sm"><i class="fa fa-chevron-left"></i></button> + <button type="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 type="button" class="btn btn-default btn-sm checkbox-toggle"><i class="fa fa-square-o"></i> + </button> + <div class="btn-group"> + <button type="button" class="btn btn-default btn-sm"><i class="fa fa-trash-o"></i></button> + <button type="button" class="btn btn-default btn-sm"><i class="fa fa-reply"></i></button> + <button type="button" class="btn btn-default btn-sm"><i class="fa fa-share"></i></button> + </div> + <!-- /.btn-group --> + <button type="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 type="button" class="btn btn-default btn-sm"><i class="fa fa-chevron-left"></i></button> + <button type="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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- Slimscroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- iCheck --> +<script src="../../plugins/iCheck/icheck.min.js"></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"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/mailbox/read-mail.html b/public/bower_components/admin-lte/pages/mailbox/read-mail.html new file mode 100644 index 0000000..6593780 --- /dev/null +++ b/public/bower_components/admin-lte/pages/mailbox/read-mail.html @@ -0,0 +1,815 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Read Mail</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.css"> + <!-- iCheck --> + <link rel="stylesheet" href="../../plugins/iCheck/flat/blue.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li class="treeview active"> + <a href="mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li> + <a href="mailbox.html">Inbox + <span class="pull-right-container"> + <span class="label label-primary pull-right">13</span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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 type="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-warning 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 type="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: help@example.com + <span class="mailbox-read-time pull-right">15 Feb. 2016 11:03 PM</span></h5> + </div> + <!-- /.mailbox-read-info --> + <div class="mailbox-controls with-border text-center"> + <div class="btn-group"> + <button type="button" class="btn btn-default btn-sm" data-toggle="tooltip" data-container="body" title="Delete"> + <i class="fa fa-trash-o"></i></button> + <button type="button" class="btn btn-default btn-sm" data-toggle="tooltip" data-container="body" title="Reply"> + <i class="fa fa-reply"></i></button> + <button type="button" class="btn btn-default btn-sm" data-toggle="tooltip" data-container="body" title="Forward"> + <i class="fa fa-share"></i></button> + </div> + <!-- /.btn-group --> + <button type="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 type="button" class="btn btn-default"><i class="fa fa-reply"></i> Reply</button> + <button type="button" class="btn btn-default"><i class="fa fa-share"></i> Forward</button> + </div> + <button type="button" class="btn btn-default"><i class="fa fa-trash-o"></i> Delete</button> + <button type="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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- Slimscroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/tables/data.html b/public/bower_components/admin-lte/pages/tables/data.html new file mode 100644 index 0000000..6ca57c4 --- /dev/null +++ b/public/bower_components/admin-lte/pages/tables/data.html @@ -0,0 +1,1646 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Data Tables</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- DataTables --> + <link rel="stylesheet" href="../../bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" + href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li> + <li class="active"><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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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> + Data Tables + <small>advanced 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">Data tables</li> + </ol> + </section> + + <!-- Main content --> + <section class="content"> + <div class="row"> + <div class="col-xs-12"> + <div class="box"> + <div class="box-header"> + <h3 class="box-title">Hover Data Table</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <table id="example2" class="table table-bordered table-hover"> + <thead> + <tr> + <th>Rendering engine</th> + <th>Browser</th> + <th>Platform(s)</th> + <th>Engine version</th> + <th>CSS grade</th> + </tr> + </thead> + <tbody> + <tr> + <td>Trident</td> + <td>Internet + Explorer 4.0 + </td> + <td>Win 95+</td> + <td> 4</td> + <td>X</td> + </tr> + <tr> + <td>Trident</td> + <td>Internet + Explorer 5.0 + </td> + <td>Win 95+</td> + <td>5</td> + <td>C</td> + </tr> + <tr> + <td>Trident</td> + <td>Internet + Explorer 5.5 + </td> + <td>Win 95+</td> + <td>5.5</td> + <td>A</td> + </tr> + <tr> + <td>Trident</td> + <td>Internet + Explorer 6 + </td> + <td>Win 98+</td> + <td>6</td> + <td>A</td> + </tr> + <tr> + <td>Trident</td> + <td>Internet Explorer 7</td> + <td>Win XP SP2+</td> + <td>7</td> + <td>A</td> + </tr> + <tr> + <td>Trident</td> + <td>AOL browser (AOL desktop)</td> + <td>Win XP</td> + <td>6</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Firefox 1.0</td> + <td>Win 98+ / OSX.2+</td> + <td>1.7</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Firefox 1.5</td> + <td>Win 98+ / OSX.2+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Firefox 2.0</td> + <td>Win 98+ / OSX.2+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Firefox 3.0</td> + <td>Win 2k+ / OSX.3+</td> + <td>1.9</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Camino 1.0</td> + <td>OSX.2+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Camino 1.5</td> + <td>OSX.3+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Netscape 7.2</td> + <td>Win 95+ / Mac OS 8.6-9.2</td> + <td>1.7</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Netscape Browser 8</td> + <td>Win 98SE+</td> + <td>1.7</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Netscape Navigator 9</td> + <td>Win 98+ / OSX.2+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.0</td> + <td>Win 95+ / OSX.1+</td> + <td>1</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.1</td> + <td>Win 95+ / OSX.1+</td> + <td>1.1</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.2</td> + <td>Win 95+ / OSX.1+</td> + <td>1.2</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.3</td> + <td>Win 95+ / OSX.1+</td> + <td>1.3</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.4</td> + <td>Win 95+ / OSX.1+</td> + <td>1.4</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.5</td> + <td>Win 95+ / OSX.1+</td> + <td>1.5</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.6</td> + <td>Win 95+ / OSX.1+</td> + <td>1.6</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.7</td> + <td>Win 98+ / OSX.1+</td> + <td>1.7</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.8</td> + <td>Win 98+ / OSX.1+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Seamonkey 1.1</td> + <td>Win 98+ / OSX.2+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Epiphany 2.20</td> + <td>Gnome</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>Safari 1.2</td> + <td>OSX.3</td> + <td>125.5</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>Safari 1.3</td> + <td>OSX.3</td> + <td>312.8</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>Safari 2.0</td> + <td>OSX.4+</td> + <td>419.3</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>Safari 3.0</td> + <td>OSX.4+</td> + <td>522.1</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>OmniWeb 5.5</td> + <td>OSX.4+</td> + <td>420</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>iPod Touch / iPhone</td> + <td>iPod</td> + <td>420.1</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>S60</td> + <td>S60</td> + <td>413</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 7.0</td> + <td>Win 95+ / OSX.1+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 7.5</td> + <td>Win 95+ / OSX.2+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 8.0</td> + <td>Win 95+ / OSX.2+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 8.5</td> + <td>Win 95+ / OSX.2+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 9.0</td> + <td>Win 95+ / OSX.3+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 9.2</td> + <td>Win 88+ / OSX.3+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 9.5</td> + <td>Win 88+ / OSX.3+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera for Wii</td> + <td>Wii</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Nokia N800</td> + <td>N800</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Nintendo DS browser</td> + <td>Nintendo DS</td> + <td>8.5</td> + <td>C/A<sup>1</sup></td> + </tr> + <tr> + <td>KHTML</td> + <td>Konqureror 3.1</td> + <td>KDE 3.1</td> + <td>3.1</td> + <td>C</td> + </tr> + <tr> + <td>KHTML</td> + <td>Konqureror 3.3</td> + <td>KDE 3.3</td> + <td>3.3</td> + <td>A</td> + </tr> + <tr> + <td>KHTML</td> + <td>Konqureror 3.5</td> + <td>KDE 3.5</td> + <td>3.5</td> + <td>A</td> + </tr> + <tr> + <td>Tasman</td> + <td>Internet Explorer 4.5</td> + <td>Mac OS 8-9</td> + <td>-</td> + <td>X</td> + </tr> + <tr> + <td>Tasman</td> + <td>Internet Explorer 5.1</td> + <td>Mac OS 7.6-9</td> + <td>1</td> + <td>C</td> + </tr> + <tr> + <td>Tasman</td> + <td>Internet Explorer 5.2</td> + <td>Mac OS 8-X</td> + <td>1</td> + <td>C</td> + </tr> + <tr> + <td>Misc</td> + <td>NetFront 3.1</td> + <td>Embedded devices</td> + <td>-</td> + <td>C</td> + </tr> + <tr> + <td>Misc</td> + <td>NetFront 3.4</td> + <td>Embedded devices</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Misc</td> + <td>Dillo 0.8</td> + <td>Embedded devices</td> + <td>-</td> + <td>X</td> + </tr> + <tr> + <td>Misc</td> + <td>Links</td> + <td>Text only</td> + <td>-</td> + <td>X</td> + </tr> + <tr> + <td>Misc</td> + <td>Lynx</td> + <td>Text only</td> + <td>-</td> + <td>X</td> + </tr> + <tr> + <td>Misc</td> + <td>IE Mobile</td> + <td>Windows Mobile 6</td> + <td>-</td> + <td>C</td> + </tr> + <tr> + <td>Misc</td> + <td>PSP browser</td> + <td>PSP</td> + <td>-</td> + <td>C</td> + </tr> + <tr> + <td>Other browsers</td> + <td>All others</td> + <td>-</td> + <td>-</td> + <td>U</td> + </tr> + </tbody> + <tfoot> + <tr> + <th>Rendering engine</th> + <th>Browser</th> + <th>Platform(s)</th> + <th>Engine version</th> + <th>CSS grade</th> + </tr> + </tfoot> + </table> + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + + <div class="box"> + <div class="box-header"> + <h3 class="box-title">Data Table With Full Features</h3> + </div> + <!-- /.box-header --> + <div class="box-body"> + <table id="example1" class="table table-bordered table-striped"> + <thead> + <tr> + <th>Rendering engine</th> + <th>Browser</th> + <th>Platform(s)</th> + <th>Engine version</th> + <th>CSS grade</th> + </tr> + </thead> + <tbody> + <tr> + <td>Trident</td> + <td>Internet + Explorer 4.0 + </td> + <td>Win 95+</td> + <td> 4</td> + <td>X</td> + </tr> + <tr> + <td>Trident</td> + <td>Internet + Explorer 5.0 + </td> + <td>Win 95+</td> + <td>5</td> + <td>C</td> + </tr> + <tr> + <td>Trident</td> + <td>Internet + Explorer 5.5 + </td> + <td>Win 95+</td> + <td>5.5</td> + <td>A</td> + </tr> + <tr> + <td>Trident</td> + <td>Internet + Explorer 6 + </td> + <td>Win 98+</td> + <td>6</td> + <td>A</td> + </tr> + <tr> + <td>Trident</td> + <td>Internet Explorer 7</td> + <td>Win XP SP2+</td> + <td>7</td> + <td>A</td> + </tr> + <tr> + <td>Trident</td> + <td>AOL browser (AOL desktop)</td> + <td>Win XP</td> + <td>6</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Firefox 1.0</td> + <td>Win 98+ / OSX.2+</td> + <td>1.7</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Firefox 1.5</td> + <td>Win 98+ / OSX.2+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Firefox 2.0</td> + <td>Win 98+ / OSX.2+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Firefox 3.0</td> + <td>Win 2k+ / OSX.3+</td> + <td>1.9</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Camino 1.0</td> + <td>OSX.2+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Camino 1.5</td> + <td>OSX.3+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Netscape 7.2</td> + <td>Win 95+ / Mac OS 8.6-9.2</td> + <td>1.7</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Netscape Browser 8</td> + <td>Win 98SE+</td> + <td>1.7</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Netscape Navigator 9</td> + <td>Win 98+ / OSX.2+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.0</td> + <td>Win 95+ / OSX.1+</td> + <td>1</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.1</td> + <td>Win 95+ / OSX.1+</td> + <td>1.1</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.2</td> + <td>Win 95+ / OSX.1+</td> + <td>1.2</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.3</td> + <td>Win 95+ / OSX.1+</td> + <td>1.3</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.4</td> + <td>Win 95+ / OSX.1+</td> + <td>1.4</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.5</td> + <td>Win 95+ / OSX.1+</td> + <td>1.5</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.6</td> + <td>Win 95+ / OSX.1+</td> + <td>1.6</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.7</td> + <td>Win 98+ / OSX.1+</td> + <td>1.7</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Mozilla 1.8</td> + <td>Win 98+ / OSX.1+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Seamonkey 1.1</td> + <td>Win 98+ / OSX.2+</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Gecko</td> + <td>Epiphany 2.20</td> + <td>Gnome</td> + <td>1.8</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>Safari 1.2</td> + <td>OSX.3</td> + <td>125.5</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>Safari 1.3</td> + <td>OSX.3</td> + <td>312.8</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>Safari 2.0</td> + <td>OSX.4+</td> + <td>419.3</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>Safari 3.0</td> + <td>OSX.4+</td> + <td>522.1</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>OmniWeb 5.5</td> + <td>OSX.4+</td> + <td>420</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>iPod Touch / iPhone</td> + <td>iPod</td> + <td>420.1</td> + <td>A</td> + </tr> + <tr> + <td>Webkit</td> + <td>S60</td> + <td>S60</td> + <td>413</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 7.0</td> + <td>Win 95+ / OSX.1+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 7.5</td> + <td>Win 95+ / OSX.2+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 8.0</td> + <td>Win 95+ / OSX.2+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 8.5</td> + <td>Win 95+ / OSX.2+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 9.0</td> + <td>Win 95+ / OSX.3+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 9.2</td> + <td>Win 88+ / OSX.3+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera 9.5</td> + <td>Win 88+ / OSX.3+</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Opera for Wii</td> + <td>Wii</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Nokia N800</td> + <td>N800</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Presto</td> + <td>Nintendo DS browser</td> + <td>Nintendo DS</td> + <td>8.5</td> + <td>C/A<sup>1</sup></td> + </tr> + <tr> + <td>KHTML</td> + <td>Konqureror 3.1</td> + <td>KDE 3.1</td> + <td>3.1</td> + <td>C</td> + </tr> + <tr> + <td>KHTML</td> + <td>Konqureror 3.3</td> + <td>KDE 3.3</td> + <td>3.3</td> + <td>A</td> + </tr> + <tr> + <td>KHTML</td> + <td>Konqureror 3.5</td> + <td>KDE 3.5</td> + <td>3.5</td> + <td>A</td> + </tr> + <tr> + <td>Tasman</td> + <td>Internet Explorer 4.5</td> + <td>Mac OS 8-9</td> + <td>-</td> + <td>X</td> + </tr> + <tr> + <td>Tasman</td> + <td>Internet Explorer 5.1</td> + <td>Mac OS 7.6-9</td> + <td>1</td> + <td>C</td> + </tr> + <tr> + <td>Tasman</td> + <td>Internet Explorer 5.2</td> + <td>Mac OS 8-X</td> + <td>1</td> + <td>C</td> + </tr> + <tr> + <td>Misc</td> + <td>NetFront 3.1</td> + <td>Embedded devices</td> + <td>-</td> + <td>C</td> + </tr> + <tr> + <td>Misc</td> + <td>NetFront 3.4</td> + <td>Embedded devices</td> + <td>-</td> + <td>A</td> + </tr> + <tr> + <td>Misc</td> + <td>Dillo 0.8</td> + <td>Embedded devices</td> + <td>-</td> + <td>X</td> + </tr> + <tr> + <td>Misc</td> + <td>Links</td> + <td>Text only</td> + <td>-</td> + <td>X</td> + </tr> + <tr> + <td>Misc</td> + <td>Lynx</td> + <td>Text only</td> + <td>-</td> + <td>X</td> + </tr> + <tr> + <td>Misc</td> + <td>IE Mobile</td> + <td>Windows Mobile 6</td> + <td>-</td> + <td>C</td> + </tr> + <tr> + <td>Misc</td> + <td>PSP browser</td> + <td>PSP</td> + <td>-</td> + <td>C</td> + </tr> + <tr> + <td>Other browsers</td> + <td>All others</td> + <td>-</td> + <td>-</td> + <td>U</td> + </tr> + </tbody> + <tfoot> + <tr> + <th>Rendering engine</th> + <th>Browser</th> + <th>Platform(s)</th> + <th>Engine version</th> + <th>CSS grade</th> + </tr> + </tfoot> + </table> + </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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- DataTables --> +<script src="../../bower_components/datatables.net/js/jquery.dataTables.min.js"></script> +<script src="../../bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script> +<!-- SlimScroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +<!-- page script --> +<script> + $(function () { + $('#example1').DataTable() + $('#example2').DataTable({ + 'paging' : true, + 'lengthChange': false, + 'searching' : false, + 'ordering' : true, + 'info' : true, + 'autoWidth' : false + }) + }) +</script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/tables/simple.html b/public/bower_components/admin-lte/pages/tables/simple.html new file mode 100644 index 0000000..6b18550 --- /dev/null +++ b/public/bower_components/admin-lte/pages/tables/simple.html @@ -0,0 +1,1059 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Simple Tables</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="../mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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-group-sm" style="width: 150px;"> + <input type="text" name="table_search" class="form-control pull-right" placeholder="Search"> + + <div class="input-group-btn"> + <button type="submit" class="btn 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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- Slimscroll --> +<script src="../../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../../dist/js/demo.js"></script> +</body> +</html> diff --git a/public/bower_components/admin-lte/pages/widgets.html b/public/bower_components/admin-lte/pages/widgets.html new file mode 100644 index 0000000..2bfe69b --- /dev/null +++ b/public/bower_components/admin-lte/pages/widgets.html @@ -0,0 +1,1791 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>AdminLTE 2 | Widgets</title> + <!-- Tell the browser to be responsive to screen width --> + <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> + <!-- Bootstrap 3.3.7 --> + <link rel="stylesheet" href="../bower_components/bootstrap/dist/css/bootstrap.min.css"> + <!-- Font Awesome --> + <link rel="stylesheet" href="../bower_components/font-awesome/css/font-awesome.min.css"> + <!-- Ionicons --> + <link rel="stylesheet" href="../bower_components/Ionicons/css/ionicons.min.css"> + <!-- Theme style --> + <link rel="stylesheet" href="../dist/css/AdminLTE.min.css"> + <!-- AdminLTE Skins. Choose a skin from the css/skins + folder instead of downloading all of them to reduce the load. --> + <link rel="stylesheet" href="../dist/css/skins/_all-skins.min.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.3/html5shiv.min.js"></script> + <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> + <![endif]--> + + <!-- Google Font --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic"> +</head> +<body class="hold-transition 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"> + <!-- Sidebar toggle button--> + <a href="#" class="sidebar-toggle" data-toggle="push-menu" 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-light-blue"></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="row"> + <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> + </div> + <!-- /.row --> + </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" data-widget="tree"> + <li class="header">MAIN NAVIGATION</li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-dashboard"></i> <span>Dashboard</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="pull-right-container"> + <span class="label label-primary pull-right">4</span> + </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 class="active"> + <a href="widgets.html"> + <i class="fa fa-th"></i> <span>Widgets</span> + <span class="pull-right-container"> + <small class="label pull-right bg-green">new</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-pie-chart"></i> + <span>Charts</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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> + <span class="pull-right-container"> + <small class="label pull-right bg-red">3</small> + <small class="label pull-right bg-blue">17</small> + </span> + </a> + </li> + <li> + <a href="mailbox/mailbox.html"> + <i class="fa fa-envelope"></i> <span>Mailbox</span> + <span class="pull-right-container"> + <small class="label pull-right bg-yellow">12</small> + <small class="label pull-right bg-green">16</small> + <small class="label pull-right bg-red">5</small> + </span> + </a> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-folder"></i> <span>Examples</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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/profile.html"><i class="fa fa-circle-o"></i> Profile</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> + <li><a href="examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li> + </ul> + </li> + <li class="treeview"> + <a href="#"> + <i class="fa fa-share"></i> <span>Multilevel</span> + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level One + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </a> + <ul class="treeview-menu"> + <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li> + <li class="treeview"> + <a href="#"><i class="fa fa-circle-o"></i> Level Two + <span class="pull-right-container"> + <i class="fa fa-angle-left pull-right"></i> + </span> + </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="https://adminlte.io/docs"><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> + Widgets + <small>Preview page</small> + </h1> + <ol class="breadcrumb"> + <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li> + <li class="active">Widgets</li> + </ol> + </section> + + <!-- Main content --> + <section class="content"> + + <div class="row"> + <div class="col-md-3 col-sm-6 col-xs-12"> + <div class="info-box"> + <span class="info-box-icon bg-aqua"><i class="fa fa-envelope-o"></i></span> + + <div class="info-box-content"> + <span class="info-box-text">Messages</span> + <span class="info-box-number">1,410</span> + </div> + <!-- /.info-box-content --> + </div> + <!-- /.info-box --> + </div> + <!-- /.col --> + <div class="col-md-3 col-sm-6 col-xs-12"> + <div class="info-box"> + <span class="info-box-icon bg-green"><i class="fa fa-flag-o"></i></span> + + <div class="info-box-content"> + <span class="info-box-text">Bookmarks</span> + <span class="info-box-number">410</span> + </div> + <!-- /.info-box-content --> + </div> + <!-- /.info-box --> + </div> + <!-- /.col --> + <div class="col-md-3 col-sm-6 col-xs-12"> + <div class="info-box"> + <span class="info-box-icon bg-yellow"><i class="fa fa-files-o"></i></span> + + <div class="info-box-content"> + <span class="info-box-text">Uploads</span> + <span class="info-box-number">13,648</span> + </div> + <!-- /.info-box-content --> + </div> + <!-- /.info-box --> + </div> + <!-- /.col --> + <div class="col-md-3 col-sm-6 col-xs-12"> + <div class="info-box"> + <span class="info-box-icon bg-red"><i class="fa fa-star-o"></i></span> + + <div class="info-box-content"> + <span class="info-box-text">Likes</span> + <span class="info-box-number">93,139</span> + </div> + <!-- /.info-box-content --> + </div> + <!-- /.info-box --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + <!-- =========================================================== --> + + <div class="row"> + <div class="col-md-3 col-sm-6 col-xs-12"> + <div class="info-box bg-aqua"> + <span class="info-box-icon"><i class="fa fa-bookmark-o"></i></span> + + <div class="info-box-content"> + <span class="info-box-text">Bookmarks</span> + <span class="info-box-number">41,410</span> + + <div class="progress"> + <div class="progress-bar" style="width: 70%"></div> + </div> + <span class="progress-description"> + 70% Increase in 30 Days + </span> + </div> + <!-- /.info-box-content --> + </div> + <!-- /.info-box --> + </div> + <!-- /.col --> + <div class="col-md-3 col-sm-6 col-xs-12"> + <div class="info-box bg-green"> + <span class="info-box-icon"><i class="fa fa-thumbs-o-up"></i></span> + + <div class="info-box-content"> + <span class="info-box-text">Likes</span> + <span class="info-box-number">41,410</span> + + <div class="progress"> + <div class="progress-bar" style="width: 70%"></div> + </div> + <span class="progress-description"> + 70% Increase in 30 Days + </span> + </div> + <!-- /.info-box-content --> + </div> + <!-- /.info-box --> + </div> + <!-- /.col --> + <div class="col-md-3 col-sm-6 col-xs-12"> + <div class="info-box bg-yellow"> + <span class="info-box-icon"><i class="fa fa-calendar"></i></span> + + <div class="info-box-content"> + <span class="info-box-text">Events</span> + <span class="info-box-number">41,410</span> + + <div class="progress"> + <div class="progress-bar" style="width: 70%"></div> + </div> + <span class="progress-description"> + 70% Increase in 30 Days + </span> + </div> + <!-- /.info-box-content --> + </div> + <!-- /.info-box --> + </div> + <!-- /.col --> + <div class="col-md-3 col-sm-6 col-xs-12"> + <div class="info-box bg-red"> + <span class="info-box-icon"><i class="fa fa-comments-o"></i></span> + + <div class="info-box-content"> + <span class="info-box-text">Comments</span> + <span class="info-box-number">41,410</span> + + <div class="progress"> + <div class="progress-bar" style="width: 70%"></div> + </div> + <span class="progress-description"> + 70% Increase in 30 Days + </span> + </div> + <!-- /.info-box-content --> + </div> + <!-- /.info-box --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + <!-- =========================================================== --> + + <!-- Small boxes (Stat box) --> + <div class="row"> + <div class="col-lg-3 col-xs-6"> + <!-- small box --> + <div class="small-box bg-aqua"> + <div class="inner"> + <h3>150</h3> + + <p>New Orders</p> + </div> + <div class="icon"> + <i class="fa fa-shopping-cart"></i> + </div> + <a href="#" class="small-box-footer"> + More info <i class="fa fa-arrow-circle-right"></i> + </a> + </div> + </div> + <!-- ./col --> + <div class="col-lg-3 col-xs-6"> + <!-- small box --> + <div class="small-box bg-green"> + <div class="inner"> + <h3>53<sup style="font-size: 20px">%</sup></h3> + + <p>Bounce Rate</p> + </div> + <div class="icon"> + <i class="ion ion-stats-bars"></i> + </div> + <a href="#" class="small-box-footer"> + More info <i class="fa fa-arrow-circle-right"></i> + </a> + </div> + </div> + <!-- ./col --> + <div class="col-lg-3 col-xs-6"> + <!-- small box --> + <div class="small-box bg-yellow"> + <div class="inner"> + <h3>44</h3> + + <p>User Registrations</p> + </div> + <div class="icon"> + <i class="ion ion-person-add"></i> + </div> + <a href="#" class="small-box-footer"> + More info <i class="fa fa-arrow-circle-right"></i> + </a> + </div> + </div> + <!-- ./col --> + <div class="col-lg-3 col-xs-6"> + <!-- small box --> + <div class="small-box bg-red"> + <div class="inner"> + <h3>65</h3> + + <p>Unique Visitors</p> + </div> + <div class="icon"> + <i class="ion ion-pie-graph"></i> + </div> + <a href="#" class="small-box-footer"> + More info <i class="fa fa-arrow-circle-right"></i> + </a> + </div> + </div> + <!-- ./col --> + </div> + <!-- /.row --> + + <!-- =========================================================== --> + + <div class="row"> + <div class="col-md-3"> + <div class="box box-default collapsed-box"> + <div class="box-header with-border"> + <h3 class="box-title">Expandable</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-plus"></i> + </button> + </div> + <!-- /.box-tools --> + </div> + <!-- /.box-header --> + <div class="box-body"> + The body of the box + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + <div class="col-md-3"> + <div class="box box-success"> + <div class="box-header with-border"> + <h3 class="box-title">Removable</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button> + </div> + <!-- /.box-tools --> + </div> + <!-- /.box-header --> + <div class="box-body"> + The body of the box + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + <div class="col-md-3"> + <div class="box box-warning"> + <div class="box-header with-border"> + <h3 class="box-title">Collapsable</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + </div> + <!-- /.box-tools --> + </div> + <!-- /.box-header --> + <div class="box-body"> + The body of the box + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + <div class="col-md-3"> + <div class="box box-danger"> + <div class="box-header"> + <h3 class="box-title">Loading state</h3> + </div> + <div class="box-body"> + The body of the box + </div> + <!-- /.box-body --> + <!-- Loading (remove the following to stop the loading)--> + <div class="overlay"> + <i class="fa fa-refresh fa-spin"></i> + </div> + <!-- end loading --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + <!-- =========================================================== --> + + <div class="row"> + <div class="col-md-3"> + <div class="box box-default collapsed-box box-solid"> + <div class="box-header with-border"> + <h3 class="box-title">Expandable</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-plus"></i> + </button> + </div> + <!-- /.box-tools --> + </div> + <!-- /.box-header --> + <div class="box-body"> + The body of the box + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + <div class="col-md-3"> + <div class="box box-success box-solid"> + <div class="box-header with-border"> + <h3 class="box-title">Removable</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button> + </div> + <!-- /.box-tools --> + </div> + <!-- /.box-header --> + <div class="box-body"> + The body of the box + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + <div class="col-md-3"> + <div class="box box-warning box-solid"> + <div class="box-header with-border"> + <h3 class="box-title">Collapsable</h3> + + <div class="box-tools pull-right"> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + </div> + <!-- /.box-tools --> + </div> + <!-- /.box-header --> + <div class="box-body"> + The body of the box + </div> + <!-- /.box-body --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + <div class="col-md-3"> + <div class="box box-danger box-solid"> + <div class="box-header"> + <h3 class="box-title">Loading state</h3> + </div> + <div class="box-body"> + The body of the box + </div> + <!-- /.box-body --> + <!-- Loading (remove the following to stop the loading)--> + <div class="overlay"> + <i class="fa fa-refresh fa-spin"></i> + </div> + <!-- end loading --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + <!-- =========================================================== --> + + <!-- Direct Chat --> + <div class="row"> + <div class="col-md-3"> + <!-- DIRECT CHAT PRIMARY --> + <div class="box box-primary direct-chat direct-chat-primary"> + <div class="box-header with-border"> + <h3 class="box-title">Direct Chat</h3> + + <div class="box-tools pull-right"> + <span data-toggle="tooltip" title="3 New Messages" class="badge bg-light-blue">3</span> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-box-tool" data-toggle="tooltip" title="Contacts" data-widget="chat-pane-toggle"> + <i class="fa fa-comments"></i></button> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button> + </div> + </div> + <!-- /.box-header --> + <div class="box-body"> + <!-- Conversations are loaded here --> + <div class="direct-chat-messages"> + <!-- Message. Default to the left --> + <div class="direct-chat-msg"> + <div class="direct-chat-info clearfix"> + <span class="direct-chat-name pull-left">Alexander Pierce</span> + <span class="direct-chat-timestamp pull-right">23 Jan 2:00 pm</span> + </div> + <!-- /.direct-chat-info --> + <img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="Message User Image"><!-- /.direct-chat-img --> + <div class="direct-chat-text"> + Is this template really for free? That's unbelievable! + </div> + <!-- /.direct-chat-text --> + </div> + <!-- /.direct-chat-msg --> + + <!-- Message to the right --> + <div class="direct-chat-msg right"> + <div class="direct-chat-info clearfix"> + <span class="direct-chat-name pull-right">Sarah Bullock</span> + <span class="direct-chat-timestamp pull-left">23 Jan 2:05 pm</span> + </div> + <!-- /.direct-chat-info --> + <img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="Message User Image"><!-- /.direct-chat-img --> + <div class="direct-chat-text"> + You better believe it! + </div> + <!-- /.direct-chat-text --> + </div> + <!-- /.direct-chat-msg --> + </div> + <!--/.direct-chat-messages--> + + <!-- Contacts are loaded here --> + <div class="direct-chat-contacts"> + <ul class="contacts-list"> + <li> + <a href="#"> + <img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="User Image"> + + <div class="contacts-list-info"> + <span class="contacts-list-name"> + Count Dracula + <small class="contacts-list-date pull-right">2/28/2015</small> + </span> + <span class="contacts-list-msg">How have you been? I was...</span> + </div> + <!-- /.contacts-list-info --> + </a> + </li> + <!-- End Contact Item --> + </ul> + <!-- /.contatcts-list --> + </div> + <!-- /.direct-chat-pane --> + </div> + <!-- /.box-body --> + <div class="box-footer"> + <form action="#" method="post"> + <div class="input-group"> + <input type="text" name="message" placeholder="Type Message ..." class="form-control"> + <span class="input-group-btn"> + <button type="submit" class="btn btn-primary btn-flat">Send</button> + </span> + </div> + </form> + </div> + <!-- /.box-footer--> + </div> + <!--/.direct-chat --> + </div> + <!-- /.col --> + + <div class="col-md-3"> + <!-- DIRECT CHAT SUCCESS --> + <div class="box box-success direct-chat direct-chat-success"> + <div class="box-header with-border"> + <h3 class="box-title">Direct Chat</h3> + + <div class="box-tools pull-right"> + <span data-toggle="tooltip" title="3 New Messages" class="badge bg-green">3</span> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-box-tool" data-toggle="tooltip" title="Contacts" data-widget="chat-pane-toggle"> + <i class="fa fa-comments"></i></button> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button> + </div> + </div> + <!-- /.box-header --> + <div class="box-body"> + <!-- Conversations are loaded here --> + <div class="direct-chat-messages"> + <!-- Message. Default to the left --> + <div class="direct-chat-msg"> + <div class="direct-chat-info clearfix"> + <span class="direct-chat-name pull-left">Alexander Pierce</span> + <span class="direct-chat-timestamp pull-right">23 Jan 2:00 pm</span> + </div> + <!-- /.direct-chat-info --> + <img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="Message User Image"><!-- /.direct-chat-img --> + <div class="direct-chat-text"> + Is this template really for free? That's unbelievable! + </div> + <!-- /.direct-chat-text --> + </div> + <!-- /.direct-chat-msg --> + + <!-- Message to the right --> + <div class="direct-chat-msg right"> + <div class="direct-chat-info clearfix"> + <span class="direct-chat-name pull-right">Sarah Bullock</span> + <span class="direct-chat-timestamp pull-left">23 Jan 2:05 pm</span> + </div> + <!-- /.direct-chat-info --> + <img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="Message User Image"><!-- /.direct-chat-img --> + <div class="direct-chat-text"> + You better believe it! + </div> + <!-- /.direct-chat-text --> + </div> + <!-- /.direct-chat-msg --> + </div> + <!--/.direct-chat-messages--> + + <!-- Contacts are loaded here --> + <div class="direct-chat-contacts"> + <ul class="contacts-list"> + <li> + <a href="#"> + <img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="User Image"> + + <div class="contacts-list-info"> + <span class="contacts-list-name"> + Count Dracula + <small class="contacts-list-date pull-right">2/28/2015</small> + </span> + <span class="contacts-list-msg">How have you been? I was...</span> + </div> + <!-- /.contacts-list-info --> + </a> + </li> + <!-- End Contact Item --> + </ul> + <!-- /.contatcts-list --> + </div> + <!-- /.direct-chat-pane --> + </div> + <!-- /.box-body --> + <div class="box-footer"> + <form action="#" method="post"> + <div class="input-group"> + <input type="text" name="message" placeholder="Type Message ..." class="form-control"> + <span class="input-group-btn"> + <button type="submit" class="btn btn-success btn-flat">Send</button> + </span> + </div> + </form> + </div> + <!-- /.box-footer--> + </div> + <!--/.direct-chat --> + </div> + <!-- /.col --> + + <div class="col-md-3"> + <!-- DIRECT CHAT WARNING --> + <div class="box box-warning direct-chat direct-chat-warning"> + <div class="box-header with-border"> + <h3 class="box-title">Direct Chat</h3> + + <div class="box-tools pull-right"> + <span data-toggle="tooltip" title="3 New Messages" class="badge bg-yellow">3</span> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-box-tool" data-toggle="tooltip" title="Contacts" data-widget="chat-pane-toggle"> + <i class="fa fa-comments"></i></button> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button> + </div> + </div> + <!-- /.box-header --> + <div class="box-body"> + <!-- Conversations are loaded here --> + <div class="direct-chat-messages"> + <!-- Message. Default to the left --> + <div class="direct-chat-msg"> + <div class="direct-chat-info clearfix"> + <span class="direct-chat-name pull-left">Alexander Pierce</span> + <span class="direct-chat-timestamp pull-right">23 Jan 2:00 pm</span> + </div> + <!-- /.direct-chat-info --> + <img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="Message User Image"><!-- /.direct-chat-img --> + <div class="direct-chat-text"> + Is this template really for free? That's unbelievable! + </div> + <!-- /.direct-chat-text --> + </div> + <!-- /.direct-chat-msg --> + + <!-- Message to the right --> + <div class="direct-chat-msg right"> + <div class="direct-chat-info clearfix"> + <span class="direct-chat-name pull-right">Sarah Bullock</span> + <span class="direct-chat-timestamp pull-left">23 Jan 2:05 pm</span> + </div> + <!-- /.direct-chat-info --> + <img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="Message User Image"><!-- /.direct-chat-img --> + <div class="direct-chat-text"> + You better believe it! + </div> + <!-- /.direct-chat-text --> + </div> + <!-- /.direct-chat-msg --> + </div> + <!--/.direct-chat-messages--> + + <!-- Contacts are loaded here --> + <div class="direct-chat-contacts"> + <ul class="contacts-list"> + <li> + <a href="#"> + <img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="User Image"> + + <div class="contacts-list-info"> + <span class="contacts-list-name"> + Count Dracula + <small class="contacts-list-date pull-right">2/28/2015</small> + </span> + <span class="contacts-list-msg">How have you been? I was...</span> + </div> + <!-- /.contacts-list-info --> + </a> + </li> + <!-- End Contact Item --> + </ul> + <!-- /.contatcts-list --> + </div> + <!-- /.direct-chat-pane --> + </div> + <!-- /.box-body --> + <div class="box-footer"> + <form action="#" method="post"> + <div class="input-group"> + <input type="text" name="message" placeholder="Type Message ..." class="form-control"> + <span class="input-group-btn"> + <button type="submit" class="btn btn-warning btn-flat">Send</button> + </span> + </div> + </form> + </div> + <!-- /.box-footer--> + </div> + <!--/.direct-chat --> + </div> + <!-- /.col --> + + <div class="col-md-3"> + <!-- DIRECT CHAT DANGER --> + <div class="box box-danger direct-chat direct-chat-danger"> + <div class="box-header with-border"> + <h3 class="box-title">Direct Chat</h3> + + <div class="box-tools pull-right"> + <span data-toggle="tooltip" title="3 New Messages" class="badge bg-red">3</span> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-box-tool" data-toggle="tooltip" title="Contacts" data-widget="chat-pane-toggle"> + <i class="fa fa-comments"></i></button> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button> + </div> + </div> + <!-- /.box-header --> + <div class="box-body"> + <!-- Conversations are loaded here --> + <div class="direct-chat-messages"> + <!-- Message. Default to the left --> + <div class="direct-chat-msg"> + <div class="direct-chat-info clearfix"> + <span class="direct-chat-name pull-left">Alexander Pierce</span> + <span class="direct-chat-timestamp pull-right">23 Jan 2:00 pm</span> + </div> + <!-- /.direct-chat-info --> + <img class="direct-chat-img" src="../dist/img/user1-128x128.jpg" alt="Message User Image"><!-- /.direct-chat-img --> + <div class="direct-chat-text"> + Is this template really for free? That's unbelievable! + </div> + <!-- /.direct-chat-text --> + </div> + <!-- /.direct-chat-msg --> + + <!-- Message to the right --> + <div class="direct-chat-msg right"> + <div class="direct-chat-info clearfix"> + <span class="direct-chat-name pull-right">Sarah Bullock</span> + <span class="direct-chat-timestamp pull-left">23 Jan 2:05 pm</span> + </div> + <!-- /.direct-chat-info --> + <img class="direct-chat-img" src="../dist/img/user3-128x128.jpg" alt="Message User Image"><!-- /.direct-chat-img --> + <div class="direct-chat-text"> + You better believe it! + </div> + <!-- /.direct-chat-text --> + </div> + <!-- /.direct-chat-msg --> + </div> + <!--/.direct-chat-messages--> + + <!-- Contacts are loaded here --> + <div class="direct-chat-contacts"> + <ul class="contacts-list"> + <li> + <a href="#"> + <img class="contacts-list-img" src="../dist/img/user1-128x128.jpg" alt="User Image"> + + <div class="contacts-list-info"> + <span class="contacts-list-name"> + Count Dracula + <small class="contacts-list-date pull-right">2/28/2015</small> + </span> + <span class="contacts-list-msg">How have you been? I was...</span> + </div> + <!-- /.contacts-list-info --> + </a> + </li> + <!-- End Contact Item --> + </ul> + <!-- /.contatcts-list --> + </div> + <!-- /.direct-chat-pane --> + </div> + <!-- /.box-body --> + <div class="box-footer"> + <form action="#" method="post"> + <div class="input-group"> + <input type="text" name="message" placeholder="Type Message ..." class="form-control"> + <span class="input-group-btn"> + <button type="submit" class="btn btn-danger btn-flat">Send</button> + </span> + </div> + </form> + </div> + <!-- /.box-footer--> + </div> + <!--/.direct-chat --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + <h2 class="page-header">Social Widgets</h2> + + <div class="row"> + <div class="col-md-4"> + <!-- Widget: user widget style 1 --> + <div class="box box-widget widget-user-2"> + <!-- Add the bg color to the header using any of the bg-* classes --> + <div class="widget-user-header bg-yellow"> + <div class="widget-user-image"> + <img class="img-circle" src="../dist/img/user7-128x128.jpg" alt="User Avatar"> + </div> + <!-- /.widget-user-image --> + <h3 class="widget-user-username">Nadia Carmichael</h3> + <h5 class="widget-user-desc">Lead Developer</h5> + </div> + <div class="box-footer no-padding"> + <ul class="nav nav-stacked"> + <li><a href="#">Projects <span class="pull-right badge bg-blue">31</span></a></li> + <li><a href="#">Tasks <span class="pull-right badge bg-aqua">5</span></a></li> + <li><a href="#">Completed Projects <span class="pull-right badge bg-green">12</span></a></li> + <li><a href="#">Followers <span class="pull-right badge bg-red">842</span></a></li> + </ul> + </div> + </div> + <!-- /.widget-user --> + </div> + <!-- /.col --> + <div class="col-md-4"> + <!-- Widget: user widget style 1 --> + <div class="box box-widget widget-user"> + <!-- Add the bg color to the header using any of the bg-* classes --> + <div class="widget-user-header bg-aqua-active"> + <h3 class="widget-user-username">Alexander Pierce</h3> + <h5 class="widget-user-desc">Founder & CEO</h5> + </div> + <div class="widget-user-image"> + <img class="img-circle" src="../dist/img/user1-128x128.jpg" alt="User Avatar"> + </div> + <div class="box-footer"> + <div class="row"> + <div class="col-sm-4 border-right"> + <div class="description-block"> + <h5 class="description-header">3,200</h5> + <span class="description-text">SALES</span> + </div> + <!-- /.description-block --> + </div> + <!-- /.col --> + <div class="col-sm-4 border-right"> + <div class="description-block"> + <h5 class="description-header">13,000</h5> + <span class="description-text">FOLLOWERS</span> + </div> + <!-- /.description-block --> + </div> + <!-- /.col --> + <div class="col-sm-4"> + <div class="description-block"> + <h5 class="description-header">35</h5> + <span class="description-text">PRODUCTS</span> + </div> + <!-- /.description-block --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + </div> + </div> + <!-- /.widget-user --> + </div> + <!-- /.col --> + <div class="col-md-4"> + <!-- Widget: user widget style 1 --> + <div class="box box-widget widget-user"> + <!-- Add the bg color to the header using any of the bg-* classes --> + <div class="widget-user-header bg-black" style="background: url('../dist/img/photo1.png') center center;"> + <h3 class="widget-user-username">Elizabeth Pierce</h3> + <h5 class="widget-user-desc">Web Designer</h5> + </div> + <div class="widget-user-image"> + <img class="img-circle" src="../dist/img/user3-128x128.jpg" alt="User Avatar"> + </div> + <div class="box-footer"> + <div class="row"> + <div class="col-sm-4 border-right"> + <div class="description-block"> + <h5 class="description-header">3,200</h5> + <span class="description-text">SALES</span> + </div> + <!-- /.description-block --> + </div> + <!-- /.col --> + <div class="col-sm-4 border-right"> + <div class="description-block"> + <h5 class="description-header">13,000</h5> + <span class="description-text">FOLLOWERS</span> + </div> + <!-- /.description-block --> + </div> + <!-- /.col --> + <div class="col-sm-4"> + <div class="description-block"> + <h5 class="description-header">35</h5> + <span class="description-text">PRODUCTS</span> + </div> + <!-- /.description-block --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + </div> + </div> + <!-- /.widget-user --> + </div> + <!-- /.col --> + </div> + <!-- /.row --> + + <div class="row"> + <div class="col-md-6"> + <!-- Box Comment --> + <div class="box box-widget"> + <div class="box-header with-border"> + <div class="user-block"> + <img class="img-circle" src="../dist/img/user1-128x128.jpg" alt="User Image"> + <span class="username"><a href="#">Jonathan Burke Jr.</a></span> + <span class="description">Shared publicly - 7:30 PM Today</span> + </div> + <!-- /.user-block --> + <div class="box-tools"> + <button type="button" class="btn btn-box-tool" data-toggle="tooltip" title="Mark as read"> + <i class="fa fa-circle-o"></i></button> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button> + </div> + <!-- /.box-tools --> + </div> + <!-- /.box-header --> + <div class="box-body"> + <img class="img-responsive pad" src="../dist/img/photo2.png" alt="Photo"> + + <p>I took this photo this morning. What do you guys think?</p> + <button type="button" class="btn btn-default btn-xs"><i class="fa fa-share"></i> Share</button> + <button type="button" class="btn btn-default btn-xs"><i class="fa fa-thumbs-o-up"></i> Like</button> + <span class="pull-right text-muted">127 likes - 3 comments</span> + </div> + <!-- /.box-body --> + <div class="box-footer box-comments"> + <div class="box-comment"> + <!-- User image --> + <img class="img-circle img-sm" src="../dist/img/user3-128x128.jpg" alt="User Image"> + + <div class="comment-text"> + <span class="username"> + Maria Gonzales + <span class="text-muted pull-right">8:03 PM Today</span> + </span><!-- /.username --> + It is a long established fact that a reader will be distracted + by the readable content of a page when looking at its layout. + </div> + <!-- /.comment-text --> + </div> + <!-- /.box-comment --> + <div class="box-comment"> + <!-- User image --> + <img class="img-circle img-sm" src="../dist/img/user4-128x128.jpg" alt="User Image"> + + <div class="comment-text"> + <span class="username"> + Luna Stark + <span class="text-muted pull-right">8:03 PM Today</span> + </span><!-- /.username --> + It is a long established fact that a reader will be distracted + by the readable content of a page when looking at its layout. + </div> + <!-- /.comment-text --> + </div> + <!-- /.box-comment --> + </div> + <!-- /.box-footer --> + <div class="box-footer"> + <form action="#" method="post"> + <img class="img-responsive img-circle img-sm" src="../dist/img/user4-128x128.jpg" alt="Alt Text"> + <!-- .img-push is used to add margin to elements next to floating images --> + <div class="img-push"> + <input type="text" class="form-control input-sm" placeholder="Press enter to post comment"> + </div> + </form> + </div> + <!-- /.box-footer --> + </div> + <!-- /.box --> + </div> + <!-- /.col --> + <div class="col-md-6"> + <!-- Box Comment --> + <div class="box box-widget"> + <div class="box-header with-border"> + <div class="user-block"> + <img class="img-circle" src="../dist/img/user1-128x128.jpg" alt="User Image"> + <span class="username"><a href="#">Jonathan Burke Jr.</a></span> + <span class="description">Shared publicly - 7:30 PM Today</span> + </div> + <!-- /.user-block --> + <div class="box-tools"> + <button type="button" class="btn btn-box-tool" data-toggle="tooltip" title="Mark as read"> + <i class="fa fa-circle-o"></i></button> + <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i> + </button> + <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button> + </div> + <!-- /.box-tools --> + </div> + <!-- /.box-header --> + <div class="box-body"> + <!-- post text --> + <p>Far far away, behind the word mountains, far from the + countries Vokalia and Consonantia, there live the blind + texts. Separated they live in Bookmarksgrove right at</p> + + <p>the coast of the Semantics, a large language ocean. + A small river named Duden flows by their place and supplies + it with the necessary regelialia. It is a paradisematic + country, in which roasted parts of sentences fly into + your mouth.</p> + + <!-- Attachment --> + <div class="attachment-block clearfix"> + <img class="attachment-img" src="../dist/img/photo1.png" alt="Attachment Image"> + + <div class="attachment-pushed"> + <h4 class="attachment-heading"><a href="http://www.lipsum.com/">Lorem ipsum text generator</a></h4> + + <div class="attachment-text"> + Description about the attachment can be placed here. + Lorem Ipsum is simply dummy text of the printing and typesetting industry... <a href="#">more</a> + </div> + <!-- /.attachment-text --> + </div> + <!-- /.attachment-pushed --> + </div> + <!-- /.attachment-block --> + + <!-- Social sharing buttons --> + <button type="button" class="btn btn-default btn-xs"><i class="fa fa-share"></i> Share</button> + <button type="button" class="btn btn-default btn-xs"><i class="fa fa-thumbs-o-up"></i> Like</button> + <span class="pull-right text-muted">45 likes - 2 comments</span> + </div> + <!-- /.box-body --> + <div class="box-footer box-comments"> + <div class="box-comment"> + <!-- User image --> + <img class="img-circle img-sm" src="../dist/img/user3-128x128.jpg" alt="User Image"> + + <div class="comment-text"> + <span class="username"> + Maria Gonzales + <span class="text-muted pull-right">8:03 PM Today</span> + </span><!-- /.username --> + It is a long established fact that a reader will be distracted + by the readable content of a page when looking at its layout. + </div> + <!-- /.comment-text --> + </div> + <!-- /.box-comment --> + <div class="box-comment"> + <!-- User image --> + <img class="img-circle img-sm" src="../dist/img/user5-128x128.jpg" alt="User Image"> + + <div class="comment-text"> + <span class="username"> + Nora Havisham + <span class="text-muted pull-right">8:03 PM Today</span> + </span><!-- /.username --> + The point of using Lorem Ipsum is that it has a more-or-less + normal distribution of letters, as opposed to using + 'Content here, content here', making it look like readable English. + </div> + <!-- /.comment-text --> + </div> + <!-- /.box-comment --> + </div> + <!-- /.box-footer --> + <div class="box-footer"> + <form action="#" method="post"> + <img class="img-responsive img-circle img-sm" src="../dist/img/user4-128x128.jpg" alt="Alt Text"> + <!-- .img-push is used to add margin to elements next to floating images --> + <div class="img-push"> + <input type="text" class="form-control input-sm" placeholder="Press enter to post comment"> + </div> + </form> + </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.4.0 + </div> + <strong>Copyright © 2014-2016 <a href="https://adminlte.io">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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <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:void(0)"> + <h4 class="control-sidebar-subheading"> + Laravel Integration + <span class="label label-warning 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:void(0)"> + <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:void(0)" 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 3 --> +<script src="../bower_components/jquery/dist/jquery.min.js"></script> +<!-- Bootstrap 3.3.7 --> +<script src="../bower_components/bootstrap/dist/js/bootstrap.min.js"></script> +<!-- Slimscroll --> +<script src="../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> +<!-- FastClick --> +<script src="../bower_components/fastclick/lib/fastclick.js"></script> +<!-- AdminLTE App --> +<script src="../dist/js/adminlte.min.js"></script> +<!-- AdminLTE for demo purposes --> +<script src="../dist/js/demo.js"></script> +</body> +</html> |