src/ceph/src/pybind/mgr/dashboard/static/AdminLTE-2.3.7/pages/tables/simple.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4   <meta charset="utf-8">
   5   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   6   <title>AdminLTE 2 | Simple Tables</title>
   7   <!-- Tell the browser to be responsive to screen width -->
   8   <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
   9   <!-- Bootstrap 3.3.6 -->
  10   <link rel="stylesheet" href="../../bootstrap/css/bootstrap.min.css">
  11   <!-- Font Awesome -->
  12   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
  13   <!-- Ionicons -->
  14   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
  15   <!-- Theme style -->
  16   <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css">
  17   <!-- AdminLTE Skins. Choose a skin from the css/skins
  18        folder instead of downloading all of them to reduce the load. -->
  19   <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.css">
  20
  21   <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  22   <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  23   <!--[if lt IE 9]>
  24   <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  25   <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  26   <![endif]-->
  27 </head>
  28 <body class="hold-transition skin-blue sidebar-mini">
  29 <div class="wrapper">
  30
  31   <header class="main-header">
  32     <!-- Logo -->
  33     <a href="../../index2.html" class="logo">
  34       <!-- mini logo for sidebar mini 50x50 pixels -->
  35       <span class="logo-mini"><b>A</b>LT</span>
  36       <!-- logo for regular state and mobile devices -->
  37       <span class="logo-lg"><b>Admin</b>LTE</span>
  38     </a>
  39     <!-- Header Navbar: style can be found in header.less -->
  40     <nav class="navbar navbar-static-top">
  41       <!-- Sidebar toggle button-->
  42       <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
  43         <span class="sr-only">Toggle navigation</span>
  44         <span class="icon-bar"></span>
  45         <span class="icon-bar"></span>
  46         <span class="icon-bar"></span>
  47       </a>
  48
  49       <div class="navbar-custom-menu">
  50         <ul class="nav navbar-nav">
  51           <!-- Messages: style can be found in dropdown.less-->
  52           <li class="dropdown messages-menu">
  53             <a href="#" class="dropdown-toggle" data-toggle="dropdown">
  54               <i class="fa fa-envelope-o"></i>
  55               <span class="label label-success">4</span>
  56             </a>
  57             <ul class="dropdown-menu">
  58               <li class="header">You have 4 messages</li>
  59               <li>
  60                 <!-- inner menu: contains the actual data -->
  61                 <ul class="menu">
  62                   <li><!-- start message -->
  63                     <a href="#">
  64                       <div class="pull-left">
  65                         <img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
  66                       </div>
  67                       <h4>
  68                         Support Team
  69                         <small><i class="fa fa-clock-o"></i> 5 mins</small>
  70                       </h4>
  71                       <p>Why not buy a new awesome theme?</p>
  72                     </a>
  73                   </li>
  74                   <!-- end message -->
  75                   <li>
  76                     <a href="#">
  77                       <div class="pull-left">
  78                         <img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="User Image">
  79                       </div>
  80                       <h4>
  81                         AdminLTE Design Team
  82                         <small><i class="fa fa-clock-o"></i> 2 hours</small>
  83                       </h4>
  84                       <p>Why not buy a new awesome theme?</p>
  85                     </a>
  86                   </li>
  87                   <li>
  88                     <a href="#">
  89                       <div class="pull-left">
  90                         <img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="User Image">
  91                       </div>
  92                       <h4>
  93                         Developers
  94                         <small><i class="fa fa-clock-o"></i> Today</small>
  95                       </h4>
  96                       <p>Why not buy a new awesome theme?</p>
  97                     </a>
  98                   </li>
  99                   <li>
 100                     <a href="#">
 101                       <div class="pull-left">
 102                         <img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="User Image">
 103                       </div>
 104                       <h4>
 105                         Sales Department
 106                         <small><i class="fa fa-clock-o"></i> Yesterday</small>
 107                       </h4>
 108                       <p>Why not buy a new awesome theme?</p>
 109                     </a>
 110                   </li>
 111                   <li>
 112                     <a href="#">
 113                       <div class="pull-left">
 114                         <img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="User Image">
 115                       </div>
 116                       <h4>
 117                         Reviewers
 118                         <small><i class="fa fa-clock-o"></i> 2 days</small>
 119                       </h4>
 120                       <p>Why not buy a new awesome theme?</p>
 121                     </a>
 122                   </li>
 123                 </ul>
 124               </li>
 125               <li class="footer"><a href="#">See All Messages</a></li>
 126             </ul>
 127           </li>
 128           <!-- Notifications: style can be found in dropdown.less -->
 129           <li class="dropdown notifications-menu">
 130             <a href="#" class="dropdown-toggle" data-toggle="dropdown">
 131               <i class="fa fa-bell-o"></i>
 132               <span class="label label-warning">10</span>
 133             </a>
 134             <ul class="dropdown-menu">
 135               <li class="header">You have 10 notifications</li>
 136               <li>
 137                 <!-- inner menu: contains the actual data -->
 138                 <ul class="menu">
 139                   <li>
 140                     <a href="#">
 141                       <i class="fa fa-users text-aqua"></i> 5 new members joined today
 142                     </a>
 143                   </li>
 144                   <li>
 145                     <a href="#">
 146                       <i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the
 147                       page and may cause design problems
 148                     </a>
 149                   </li>
 150                   <li>
 151                     <a href="#">
 152                       <i class="fa fa-users text-red"></i> 5 new members joined
 153                     </a>
 154                   </li>
 155                   <li>
 156                     <a href="#">
 157                       <i class="fa fa-shopping-cart text-green"></i> 25 sales made
 158                     </a>
 159                   </li>
 160                   <li>
 161                     <a href="#">
 162                       <i class="fa fa-user text-red"></i> You changed your username
 163                     </a>
 164                   </li>
 165                 </ul>
 166               </li>
 167               <li class="footer"><a href="#">View all</a></li>
 168             </ul>
 169           </li>
 170           <!-- Tasks: style can be found in dropdown.less -->
 171           <li class="dropdown tasks-menu">
 172             <a href="#" class="dropdown-toggle" data-toggle="dropdown">
 173               <i class="fa fa-flag-o"></i>
 174               <span class="label label-danger">9</span>
 175             </a>
 176             <ul class="dropdown-menu">
 177               <li class="header">You have 9 tasks</li>
 178               <li>
 179                 <!-- inner menu: contains the actual data -->
 180                 <ul class="menu">
 181                   <li><!-- Task item -->
 182                     <a href="#">
 183                       <h3>
 184                         Design some buttons
 185                         <small class="pull-right">20%</small>
 186                       </h3>
 187                       <div class="progress progress-xs">
 188                         <div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
 189                           <span class="sr-only">20% Complete</span>
 190                         </div>
 191                       </div>
 192                     </a>
 193                   </li>
 194                   <!-- end task item -->
 195                   <li><!-- Task item -->
 196                     <a href="#">
 197                       <h3>
 198                         Create a nice theme
 199                         <small class="pull-right">40%</small>
 200                       </h3>
 201                       <div class="progress progress-xs">
 202                         <div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
 203                           <span class="sr-only">40% Complete</span>
 204                         </div>
 205                       </div>
 206                     </a>
 207                   </li>
 208                   <!-- end task item -->
 209                   <li><!-- Task item -->
 210                     <a href="#">
 211                       <h3>
 212                         Some task I need to do
 213                         <small class="pull-right">60%</small>
 214                       </h3>
 215                       <div class="progress progress-xs">
 216                         <div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
 217                           <span class="sr-only">60% Complete</span>
 218                         </div>
 219                       </div>
 220                     </a>
 221                   </li>
 222                   <!-- end task item -->
 223                   <li><!-- Task item -->
 224                     <a href="#">
 225                       <h3>
 226                         Make beautiful transitions
 227                         <small class="pull-right">80%</small>
 228                       </h3>
 229                       <div class="progress progress-xs">
 230                         <div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
 231                           <span class="sr-only">80% Complete</span>
 232                         </div>
 233                       </div>
 234                     </a>
 235                   </li>
 236                   <!-- end task item -->
 237                 </ul>
 238               </li>
 239               <li class="footer">
 240                 <a href="#">View all tasks</a>
 241               </li>
 242             </ul>
 243           </li>
 244           <!-- User Account: style can be found in dropdown.less -->
 245           <li class="dropdown user user-menu">
 246             <a href="#" class="dropdown-toggle" data-toggle="dropdown">
 247               <img src="../../dist/img/user2-160x160.jpg" class="user-image" alt="User Image">
 248               <span class="hidden-xs">Alexander Pierce</span>
 249             </a>
 250             <ul class="dropdown-menu">
 251               <!-- User image -->
 252               <li class="user-header">
 253                 <img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
 254
 255                 <p>
 256                   Alexander Pierce - Web Developer
 257                   <small>Member since Nov. 2012</small>
 258                 </p>
 259               </li>
 260               <!-- Menu Body -->
 261               <li class="user-body">
 262                 <div class="row">
 263                   <div class="col-xs-4 text-center">
 264                     <a href="#">Followers</a>
 265                   </div>
 266                   <div class="col-xs-4 text-center">
 267                     <a href="#">Sales</a>
 268                   </div>
 269                   <div class="col-xs-4 text-center">
 270                     <a href="#">Friends</a>
 271                   </div>
 272                 </div>
 273                 <!-- /.row -->
 274               </li>
 275               <!-- Menu Footer-->
 276               <li class="user-footer">
 277                 <div class="pull-left">
 278                   <a href="#" class="btn btn-default btn-flat">Profile</a>
 279                 </div>
 280                 <div class="pull-right">
 281                   <a href="#" class="btn btn-default btn-flat">Sign out</a>
 282                 </div>
 283               </li>
 284             </ul>
 285           </li>
 286           <!-- Control Sidebar Toggle Button -->
 287           <li>
 288             <a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
 289           </li>
 290         </ul>
 291       </div>
 292     </nav>
 293   </header>
 294   <!-- Left side column. contains the logo and sidebar -->
 295   <aside class="main-sidebar">
 296     <!-- sidebar: style can be found in sidebar.less -->
 297     <section class="sidebar">
 298       <!-- Sidebar user panel -->
 299       <div class="user-panel">
 300         <div class="pull-left image">
 301           <img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
 302         </div>
 303         <div class="pull-left info">
 304           <p>Alexander Pierce</p>
 305           <a href="#"><i class="fa fa-circle text-success"></i> Online</a>
 306         </div>
 307       </div>
 308       <!-- search form -->
 309       <form action="#" method="get" class="sidebar-form">
 310         <div class="input-group">
 311           <input type="text" name="q" class="form-control" placeholder="Search...">
 312               <span class="input-group-btn">
 313                 <button type="submit" name="search" id="search-btn" class="btn btn-flat"><i class="fa fa-search"></i>
 314                 </button>
 315               </span>
 316         </div>
 317       </form>
 318       <!-- /.search form -->
 319       <!-- sidebar menu: : style can be found in sidebar.less -->
 320       <ul class="sidebar-menu">
 321         <li class="header">MAIN NAVIGATION</li>
 322         <li class="treeview">
 323           <a href="#">
 324             <i class="fa fa-dashboard"></i> <span>Dashboard</span>
 325             <span class="pull-right-container">
 326               <i class="fa fa-angle-left pull-right"></i>
 327             </span>
 328           </a>
 329           <ul class="treeview-menu">
 330             <li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
 331             <li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
 332           </ul>
 333         </li>
 334         <li class="treeview">
 335           <a href="#">
 336             <i class="fa fa-files-o"></i>
 337             <span>Layout Options</span>
 338             <span class="pull-right-container">
 339               <span class="label label-primary pull-right">4</span>
 340             </span>
 341           </a>
 342           <ul class="treeview-menu">
 343             <li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
 344             <li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
 345             <li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
 346             <li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
 347           </ul>
 348         </li>
 349         <li>
 350           <a href="../widgets.html">
 351             <i class="fa fa-th"></i> <span>Widgets</span>
 352             <span class="pull-right-container">
 353               <small class="label pull-right bg-green">new</small>
 354             </span>
 355           </a>
 356         </li>
 357         <li class="treeview">
 358           <a href="#">
 359             <i class="fa fa-pie-chart"></i>
 360             <span>Charts</span>
 361             <span class="pull-right-container">
 362               <i class="fa fa-angle-left pull-right"></i>
 363             </span>
 364           </a>
 365           <ul class="treeview-menu">
 366             <li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
 367             <li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
 368             <li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
 369             <li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
 370           </ul>
 371         </li>
 372         <li class="treeview">
 373           <a href="#">
 374             <i class="fa fa-laptop"></i>
 375             <span>UI Elements</span>
 376             <span class="pull-right-container">
 377               <i class="fa fa-angle-left pull-right"></i>
 378             </span>
 379           </a>
 380           <ul class="treeview-menu">
 381             <li><a href="../UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
 382             <li><a href="../UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
 383             <li><a href="../UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
 384             <li><a href="../UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
 385             <li><a href="../UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
 386             <li><a href="../UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
 387           </ul>
 388         </li>
 389         <li class="treeview">
 390           <a href="#">
 391             <i class="fa fa-edit"></i> <span>Forms</span>
 392             <span class="pull-right-container">
 393               <i class="fa fa-angle-left pull-right"></i>
 394             </span>
 395           </a>
 396           <ul class="treeview-menu">
 397             <li><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
 398             <li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
 399             <li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
 400           </ul>
 401         </li>
 402         <li class="treeview active">
 403           <a href="#">
 404             <i class="fa fa-table"></i> <span>Tables</span>
 405             <span class="pull-right-container">
 406               <i class="fa fa-angle-left pull-right"></i>
 407             </span>
 408           </a>
 409           <ul class="treeview-menu">
 410             <li class="active"><a href="simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
 411             <li><a href="data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
 412           </ul>
 413         </li>
 414         <li>
 415           <a href="../calendar.html">
 416             <i class="fa fa-calendar"></i> <span>Calendar</span>
 417             <span class="pull-right-container">
 418               <small class="label pull-right bg-red">3</small>
 419               <small class="label pull-right bg-blue">17</small>
 420             </span>
 421           </a>
 422         </li>
 423         <li>
 424           <a href="../mailbox/mailbox.html">
 425             <i class="fa fa-envelope"></i> <span>Mailbox</span>
 426             <span class="pull-right-container">
 427               <small class="label pull-right bg-yellow">12</small>
 428               <small class="label pull-right bg-green">16</small>
 429               <small class="label pull-right bg-red">5</small>
 430             </span>
 431           </a>
 432         </li>
 433         <li class="treeview">
 434           <a href="#">
 435             <i class="fa fa-folder"></i> <span>Examples</span>
 436             <span class="pull-right-container">
 437               <i class="fa fa-angle-left pull-right"></i>
 438             </span>
 439           </a>
 440           <ul class="treeview-menu">
 441             <li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
 442             <li><a href="../examples/profile.html"><i class="fa fa-circle-o"></i> Profile</a></li>
 443             <li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
 444             <li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
 445             <li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
 446             <li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
 447             <li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
 448             <li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
 449             <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li>
 450           </ul>
 451         </li>
 452         <li class="treeview">
 453           <a href="#">
 454             <i class="fa fa-share"></i> <span>Multilevel</span>
 455             <span class="pull-right-container">
 456               <i class="fa fa-angle-left pull-right"></i>
 457             </span>
 458           </a>
 459           <ul class="treeview-menu">
 460             <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
 461             <li>
 462               <a href="#"><i class="fa fa-circle-o"></i> Level One
 463                 <span class="pull-right-container">
 464                   <i class="fa fa-angle-left pull-right"></i>
 465                 </span>
 466               </a>
 467               <ul class="treeview-menu">
 468                 <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
 469                 <li>
 470                   <a href="#"><i class="fa fa-circle-o"></i> Level Two
 471                     <span class="pull-right-container">
 472                       <i class="fa fa-angle-left pull-right"></i>
 473                     </span>
 474                   </a>
 475                   <ul class="treeview-menu">
 476                     <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
 477                     <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
 478                   </ul>
 479                 </li>
 480               </ul>
 481             </li>
 482             <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
 483           </ul>
 484         </li>
 485         <li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
 486         <li class="header">LABELS</li>
 487         <li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
 488         <li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
 489         <li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
 490       </ul>
 491     </section>
 492     <!-- /.sidebar -->
 493   </aside>
 494
 495   <!-- Content Wrapper. Contains page content -->
 496   <div class="content-wrapper">
 497     <!-- Content Header (Page header) -->
 498     <section class="content-header">
 499       <h1>
 500         Simple Tables
 501         <small>preview of simple tables</small>
 502       </h1>
 503       <ol class="breadcrumb">
 504         <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
 505         <li><a href="#">Tables</a></li>
 506         <li class="active">Simple</li>
 507       </ol>
 508     </section>
 509
 510     <!-- Main content -->
 511     <section class="content">
 512       <div class="row">
 513         <div class="col-md-6">
 514           <div class="box">
 515             <div class="box-header with-border">
 516               <h3 class="box-title">Bordered Table</h3>
 517             </div>
 518             <!-- /.box-header -->
 519             <div class="box-body">
 520               <table class="table table-bordered">
 521                 <tr>
 522                   <th style="width: 10px">#</th>
 523                   <th>Task</th>
 524                   <th>Progress</th>
 525                   <th style="width: 40px">Label</th>
 526                 </tr>
 527                 <tr>
 528                   <td>1.</td>
 529                   <td>Update software</td>
 530                   <td>
 531                     <div class="progress progress-xs">
 532                       <div class="progress-bar progress-bar-danger" style="width: 55%"></div>
 533                     </div>
 534                   </td>
 535                   <td><span class="badge bg-red">55%</span></td>
 536                 </tr>
 537                 <tr>
 538                   <td>2.</td>
 539                   <td>Clean database</td>
 540                   <td>
 541                     <div class="progress progress-xs">
 542                       <div class="progress-bar progress-bar-yellow" style="width: 70%"></div>
 543                     </div>
 544                   </td>
 545                   <td><span class="badge bg-yellow">70%</span></td>
 546                 </tr>
 547                 <tr>
 548                   <td>3.</td>
 549                   <td>Cron job running</td>
 550                   <td>
 551                     <div class="progress progress-xs progress-striped active">
 552                       <div class="progress-bar progress-bar-primary" style="width: 30%"></div>
 553                     </div>
 554                   </td>
 555                   <td><span class="badge bg-light-blue">30%</span></td>
 556                 </tr>
 557                 <tr>
 558                   <td>4.</td>
 559                   <td>Fix and squish bugs</td>
 560                   <td>
 561                     <div class="progress progress-xs progress-striped active">
 562                       <div class="progress-bar progress-bar-success" style="width: 90%"></div>
 563                     </div>
 564                   </td>
 565                   <td><span class="badge bg-green">90%</span></td>
 566                 </tr>
 567               </table>
 568             </div>
 569             <!-- /.box-body -->
 570             <div class="box-footer clearfix">
 571               <ul class="pagination pagination-sm no-margin pull-right">
 572                 <li><a href="#">&laquo;</a></li>
 573                 <li><a href="#">1</a></li>
 574                 <li><a href="#">2</a></li>
 575                 <li><a href="#">3</a></li>
 576                 <li><a href="#">&raquo;</a></li>
 577               </ul>
 578             </div>
 579           </div>
 580           <!-- /.box -->
 581
 582           <div class="box">
 583             <div class="box-header">
 584               <h3 class="box-title">Condensed Full Width Table</h3>
 585             </div>
 586             <!-- /.box-header -->
 587             <div class="box-body no-padding">
 588               <table class="table table-condensed">
 589                 <tr>
 590                   <th style="width: 10px">#</th>
 591                   <th>Task</th>
 592                   <th>Progress</th>
 593                   <th style="width: 40px">Label</th>
 594                 </tr>
 595                 <tr>
 596                   <td>1.</td>
 597                   <td>Update software</td>
 598                   <td>
 599                     <div class="progress progress-xs">
 600                       <div class="progress-bar progress-bar-danger" style="width: 55%"></div>
 601                     </div>
 602                   </td>
 603                   <td><span class="badge bg-red">55%</span></td>
 604                 </tr>
 605                 <tr>
 606                   <td>2.</td>
 607                   <td>Clean database</td>
 608                   <td>
 609                     <div class="progress progress-xs">
 610                       <div class="progress-bar progress-bar-yellow" style="width: 70%"></div>
 611                     </div>
 612                   </td>
 613                   <td><span class="badge bg-yellow">70%</span></td>
 614                 </tr>
 615                 <tr>
 616                   <td>3.</td>
 617                   <td>Cron job running</td>
 618                   <td>
 619                     <div class="progress progress-xs progress-striped active">
 620                       <div class="progress-bar progress-bar-primary" style="width: 30%"></div>
 621                     </div>
 622                   </td>
 623                   <td><span class="badge bg-light-blue">30%</span></td>
 624                 </tr>
 625                 <tr>
 626                   <td>4.</td>
 627                   <td>Fix and squish bugs</td>
 628                   <td>
 629                     <div class="progress progress-xs progress-striped active">
 630                       <div class="progress-bar progress-bar-success" style="width: 90%"></div>
 631                     </div>
 632                   </td>
 633                   <td><span class="badge bg-green">90%</span></td>
 634                 </tr>
 635               </table>
 636             </div>
 637             <!-- /.box-body -->
 638           </div>
 639           <!-- /.box -->
 640         </div>
 641         <!-- /.col -->
 642         <div class="col-md-6">
 643           <div class="box">
 644             <div class="box-header">
 645               <h3 class="box-title">Simple Full Width Table</h3>
 646
 647               <div class="box-tools">
 648                 <ul class="pagination pagination-sm no-margin pull-right">
 649                   <li><a href="#">&laquo;</a></li>
 650                   <li><a href="#">1</a></li>
 651                   <li><a href="#">2</a></li>
 652                   <li><a href="#">3</a></li>
 653                   <li><a href="#">&raquo;</a></li>
 654                 </ul>
 655               </div>
 656             </div>
 657             <!-- /.box-header -->
 658             <div class="box-body no-padding">
 659               <table class="table">
 660                 <tr>
 661                   <th style="width: 10px">#</th>
 662                   <th>Task</th>
 663                   <th>Progress</th>
 664                   <th style="width: 40px">Label</th>
 665                 </tr>
 666                 <tr>
 667                   <td>1.</td>
 668                   <td>Update software</td>
 669                   <td>
 670                     <div class="progress progress-xs">
 671                       <div class="progress-bar progress-bar-danger" style="width: 55%"></div>
 672                     </div>
 673                   </td>
 674                   <td><span class="badge bg-red">55%</span></td>
 675                 </tr>
 676                 <tr>
 677                   <td>2.</td>
 678                   <td>Clean database</td>
 679                   <td>
 680                     <div class="progress progress-xs">
 681                       <div class="progress-bar progress-bar-yellow" style="width: 70%"></div>
 682                     </div>
 683                   </td>
 684                   <td><span class="badge bg-yellow">70%</span></td>
 685                 </tr>
 686                 <tr>
 687                   <td>3.</td>
 688                   <td>Cron job running</td>
 689                   <td>
 690                     <div class="progress progress-xs progress-striped active">
 691                       <div class="progress-bar progress-bar-primary" style="width: 30%"></div>
 692                     </div>
 693                   </td>
 694                   <td><span class="badge bg-light-blue">30%</span></td>
 695                 </tr>
 696                 <tr>
 697                   <td>4.</td>
 698                   <td>Fix and squish bugs</td>
 699                   <td>
 700                     <div class="progress progress-xs progress-striped active">
 701                       <div class="progress-bar progress-bar-success" style="width: 90%"></div>
 702                     </div>
 703                   </td>
 704                   <td><span class="badge bg-green">90%</span></td>
 705                 </tr>
 706               </table>
 707             </div>
 708             <!-- /.box-body -->
 709           </div>
 710           <!-- /.box -->
 711
 712           <div class="box">
 713             <div class="box-header">
 714               <h3 class="box-title">Striped Full Width Table</h3>
 715             </div>
 716             <!-- /.box-header -->
 717             <div class="box-body no-padding">
 718               <table class="table table-striped">
 719                 <tr>
 720                   <th style="width: 10px">#</th>
 721                   <th>Task</th>
 722                   <th>Progress</th>
 723                   <th style="width: 40px">Label</th>
 724                 </tr>
 725                 <tr>
 726                   <td>1.</td>
 727                   <td>Update software</td>
 728                   <td>
 729                     <div class="progress progress-xs">
 730                       <div class="progress-bar progress-bar-danger" style="width: 55%"></div>
 731                     </div>
 732                   </td>
 733                   <td><span class="badge bg-red">55%</span></td>
 734                 </tr>
 735                 <tr>
 736                   <td>2.</td>
 737                   <td>Clean database</td>
 738                   <td>
 739                     <div class="progress progress-xs">
 740                       <div class="progress-bar progress-bar-yellow" style="width: 70%"></div>
 741                     </div>
 742                   </td>
 743                   <td><span class="badge bg-yellow">70%</span></td>
 744                 </tr>
 745                 <tr>
 746                   <td>3.</td>
 747                   <td>Cron job running</td>
 748                   <td>
 749                     <div class="progress progress-xs progress-striped active">
 750                       <div class="progress-bar progress-bar-primary" style="width: 30%"></div>
 751                     </div>
 752                   </td>
 753                   <td><span class="badge bg-light-blue">30%</span></td>
 754                 </tr>
 755                 <tr>
 756                   <td>4.</td>
 757                   <td>Fix and squish bugs</td>
 758                   <td>
 759                     <div class="progress progress-xs progress-striped active">
 760                       <div class="progress-bar progress-bar-success" style="width: 90%"></div>
 761                     </div>
 762                   </td>
 763                   <td><span class="badge bg-green">90%</span></td>
 764                 </tr>
 765               </table>
 766             </div>
 767             <!-- /.box-body -->
 768           </div>
 769           <!-- /.box -->
 770         </div>
 771         <!-- /.col -->
 772       </div>
 773       <!-- /.row -->
 774       <div class="row">
 775         <div class="col-xs-12">
 776           <div class="box">
 777             <div class="box-header">
 778               <h3 class="box-title">Responsive Hover Table</h3>
 779
 780               <div class="box-tools">
 781                 <div class="input-group input-group-sm" style="width: 150px;">
 782                   <input type="text" name="table_search" class="form-control pull-right" placeholder="Search">
 783
 784                   <div class="input-group-btn">
 785                     <button type="submit" class="btn btn-default"><i class="fa fa-search"></i></button>
 786                   </div>
 787                 </div>
 788               </div>
 789             </div>
 790             <!-- /.box-header -->
 791             <div class="box-body table-responsive no-padding">
 792               <table class="table table-hover">
 793                 <tr>
 794                   <th>ID</th>
 795                   <th>User</th>
 796                   <th>Date</th>
 797                   <th>Status</th>
 798                   <th>Reason</th>
 799                 </tr>
 800                 <tr>
 801                   <td>183</td>
 802                   <td>John Doe</td>
 803                   <td>11-7-2014</td>
 804                   <td><span class="label label-success">Approved</span></td>
 805                   <td>Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.</td>
 806                 </tr>
 807                 <tr>
 808                   <td>219</td>
 809                   <td>Alexander Pierce</td>
 810                   <td>11-7-2014</td>
 811                   <td><span class="label label-warning">Pending</span></td>
 812                   <td>Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.</td>
 813                 </tr>
 814                 <tr>
 815                   <td>657</td>
 816                   <td>Bob Doe</td>
 817                   <td>11-7-2014</td>
 818                   <td><span class="label label-primary">Approved</span></td>
 819                   <td>Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.</td>
 820                 </tr>
 821                 <tr>
 822                   <td>175</td>
 823                   <td>Mike Doe</td>
 824                   <td>11-7-2014</td>
 825                   <td><span class="label label-danger">Denied</span></td>
 826                   <td>Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.</td>
 827                 </tr>
 828               </table>
 829             </div>
 830             <!-- /.box-body -->
 831           </div>
 832           <!-- /.box -->
 833         </div>
 834       </div>
 835     </section>
 836     <!-- /.content -->
 837   </div>
 838   <!-- /.content-wrapper -->
 839   <footer class="main-footer">
 840     <div class="pull-right hidden-xs">
 841       <b>Version</b> 2.3.7
 842     </div>
 843     <strong>Copyright &copy; 2014-2016 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights
 844     reserved.
 845   </footer>
 846
 847   <!-- Control Sidebar -->
 848   <aside class="control-sidebar control-sidebar-dark">
 849     <!-- Create the tabs -->
 850     <ul class="nav nav-tabs nav-justified control-sidebar-tabs">
 851       <li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
 852       <li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
 853     </ul>
 854     <!-- Tab panes -->
 855     <div class="tab-content">
 856       <!-- Home tab content -->
 857       <div class="tab-pane" id="control-sidebar-home-tab">
 858         <h3 class="control-sidebar-heading">Recent Activity</h3>
 859         <ul class="control-sidebar-menu">
 860           <li>
 861             <a href="javascript:void(0)">
 862               <i class="menu-icon fa fa-birthday-cake bg-red"></i>
 863
 864               <div class="menu-info">
 865                 <h4 class="control-sidebar-subheading">Langdon's Birthday</h4>
 866
 867                 <p>Will be 23 on April 24th</p>
 868               </div>
 869             </a>
 870           </li>
 871           <li>
 872             <a href="javascript:void(0)">
 873               <i class="menu-icon fa fa-user bg-yellow"></i>
 874
 875               <div class="menu-info">
 876                 <h4 class="control-sidebar-subheading">Frodo Updated His Profile</h4>
 877
 878                 <p>New phone +1(800)555-1234</p>
 879               </div>
 880             </a>
 881           </li>
 882           <li>
 883             <a href="javascript:void(0)">
 884               <i class="menu-icon fa fa-envelope-o bg-light-blue"></i>
 885
 886               <div class="menu-info">
 887                 <h4 class="control-sidebar-subheading">Nora Joined Mailing List</h4>
 888
 889                 <p>nora@example.com</p>
 890               </div>
 891             </a>
 892           </li>
 893           <li>
 894             <a href="javascript:void(0)">
 895               <i class="menu-icon fa fa-file-code-o bg-green"></i>
 896
 897               <div class="menu-info">
 898                 <h4 class="control-sidebar-subheading">Cron Job 254 Executed</h4>
 899
 900                 <p>Execution time 5 seconds</p>
 901               </div>
 902             </a>
 903           </li>
 904         </ul>
 905         <!-- /.control-sidebar-menu -->
 906
 907         <h3 class="control-sidebar-heading">Tasks Progress</h3>
 908         <ul class="control-sidebar-menu">
 909           <li>
 910             <a href="javascript:void(0)">
 911               <h4 class="control-sidebar-subheading">
 912                 Custom Template Design
 913                 <span class="label label-danger pull-right">70%</span>
 914               </h4>
 915
 916               <div class="progress progress-xxs">
 917                 <div class="progress-bar progress-bar-danger" style="width: 70%"></div>
 918               </div>
 919             </a>
 920           </li>
 921           <li>
 922             <a href="javascript:void(0)">
 923               <h4 class="control-sidebar-subheading">
 924                 Update Resume
 925                 <span class="label label-success pull-right">95%</span>
 926               </h4>
 927
 928               <div class="progress progress-xxs">
 929                 <div class="progress-bar progress-bar-success" style="width: 95%"></div>
 930               </div>
 931             </a>
 932           </li>
 933           <li>
 934             <a href="javascript:void(0)">
 935               <h4 class="control-sidebar-subheading">
 936                 Laravel Integration
 937                 <span class="label label-warning pull-right">50%</span>
 938               </h4>
 939
 940               <div class="progress progress-xxs">
 941                 <div class="progress-bar progress-bar-warning" style="width: 50%"></div>
 942               </div>
 943             </a>
 944           </li>
 945           <li>
 946             <a href="javascript:void(0)">
 947               <h4 class="control-sidebar-subheading">
 948                 Back End Framework
 949                 <span class="label label-primary pull-right">68%</span>
 950               </h4>
 951
 952               <div class="progress progress-xxs">
 953                 <div class="progress-bar progress-bar-primary" style="width: 68%"></div>
 954               </div>
 955             </a>
 956           </li>
 957         </ul>
 958         <!-- /.control-sidebar-menu -->
 959
 960       </div>
 961       <!-- /.tab-pane -->
 962       <!-- Stats tab content -->
 963       <div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div>
 964       <!-- /.tab-pane -->
 965       <!-- Settings tab content -->
 966       <div class="tab-pane" id="control-sidebar-settings-tab">
 967         <form method="post">
 968           <h3 class="control-sidebar-heading">General Settings</h3>
 969
 970           <div class="form-group">
 971             <label class="control-sidebar-subheading">
 972               Report panel usage
 973               <input type="checkbox" class="pull-right" checked>
 974             </label>
 975
 976             <p>
 977               Some information about this general settings option
 978             </p>
 979           </div>
 980           <!-- /.form-group -->
 981
 982           <div class="form-group">
 983             <label class="control-sidebar-subheading">
 984               Allow mail redirect
 985               <input type="checkbox" class="pull-right" checked>
 986             </label>
 987
 988             <p>
 989               Other sets of options are available
 990             </p>
 991           </div>
 992           <!-- /.form-group -->
 993
 994           <div class="form-group">
 995             <label class="control-sidebar-subheading">
 996               Expose author name in posts
 997               <input type="checkbox" class="pull-right" checked>
 998             </label>
 999
1000             <p>
1001               Allow the user to show his name in blog posts
1002             </p>
1003           </div>
1004           <!-- /.form-group -->
1005
1006           <h3 class="control-sidebar-heading">Chat Settings</h3>
1007
1008           <div class="form-group">
1009             <label class="control-sidebar-subheading">
1010               Show me as online
1011               <input type="checkbox" class="pull-right" checked>
1012             </label>
1013           </div>
1014           <!-- /.form-group -->
1015
1016           <div class="form-group">
1017             <label class="control-sidebar-subheading">
1018               Turn off notifications
1019               <input type="checkbox" class="pull-right">
1020             </label>
1021           </div>
1022           <!-- /.form-group -->
1023
1024           <div class="form-group">
1025             <label class="control-sidebar-subheading">
1026               Delete chat history
1027               <a href="javascript:void(0)" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
1028             </label>
1029           </div>
1030           <!-- /.form-group -->
1031         </form>
1032       </div>
1033       <!-- /.tab-pane -->
1034     </div>
1035   </aside>
1036   <!-- /.control-sidebar -->
1037   <!-- Add the sidebar's background. This div must be placed
1038        immediately after the control sidebar -->
1039   <div class="control-sidebar-bg"></div>
1040 </div>
1041 <!-- ./wrapper -->
1042
1043 <!-- jQuery 2.2.3 -->
1044 <script src="../../plugins/jQuery/jquery-2.2.3.min.js"></script>
1045 <!-- Bootstrap 3.3.6 -->
1046 <script src="../../bootstrap/js/bootstrap.min.js"></script>
1047 <!-- Slimscroll -->
1048 <script src="../../plugins/slimScroll/jquery.slimscroll.min.js"></script>
1049 <!-- FastClick -->
1050 <script src="../../plugins/fastclick/fastclick.js"></script>
1051 <!-- AdminLTE App -->
1052 <script src="../../dist/js/app.min.js"></script>
1053 <!-- AdminLTE for demo purposes -->
1054 <script src="../../dist/js/demo.js"></script>
1055 </body>
1056 </html>