Fix some bugs when testing opensds ansible
[stor4nfv.git] / src / ceph / src / pybind / mgr / dashboard / static / AdminLTE-2.3.7 / index.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 | Dashboard</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   <!-- iCheck -->
21   <link rel="stylesheet" href="plugins/iCheck/flat/blue.css">
22   <!-- Morris chart -->
23   <link rel="stylesheet" href="plugins/morris/morris.css">
24   <!-- jvectormap -->
25   <link rel="stylesheet" href="plugins/jvectormap/jquery-jvectormap-1.2.2.css">
26   <!-- Date Picker -->
27   <link rel="stylesheet" href="plugins/datepicker/datepicker3.css">
28   <!-- Daterange picker -->
29   <link rel="stylesheet" href="plugins/daterangepicker/daterangepicker.css">
30   <!-- bootstrap wysihtml5 - text editor -->
31   <link rel="stylesheet" href="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css">
32
33   <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
34   <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
35   <!--[if lt IE 9]>
36   <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
37   <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
38   <![endif]-->
39 </head>
40 <body class="hold-transition skin-blue sidebar-mini">
41 <div class="wrapper">
42
43   <header class="main-header">
44     <!-- Logo -->
45     <a href="index2.html" class="logo">
46       <!-- mini logo for sidebar mini 50x50 pixels -->
47       <span class="logo-mini"><b>A</b>LT</span>
48       <!-- logo for regular state and mobile devices -->
49       <span class="logo-lg"><b>Admin</b>LTE</span>
50     </a>
51     <!-- Header Navbar: style can be found in header.less -->
52     <nav class="navbar navbar-static-top">
53       <!-- Sidebar toggle button-->
54       <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
55         <span class="sr-only">Toggle navigation</span>
56       </a>
57
58       <div class="navbar-custom-menu">
59         <ul class="nav navbar-nav">
60           <!-- Messages: style can be found in dropdown.less-->
61           <li class="dropdown messages-menu">
62             <a href="#" class="dropdown-toggle" data-toggle="dropdown">
63               <i class="fa fa-envelope-o"></i>
64               <span class="label label-success">4</span>
65             </a>
66             <ul class="dropdown-menu">
67               <li class="header">You have 4 messages</li>
68               <li>
69                 <!-- inner menu: contains the actual data -->
70                 <ul class="menu">
71                   <li><!-- start message -->
72                     <a href="#">
73                       <div class="pull-left">
74                         <img src="dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
75                       </div>
76                       <h4>
77                         Support Team
78                         <small><i class="fa fa-clock-o"></i> 5 mins</small>
79                       </h4>
80                       <p>Why not buy a new awesome theme?</p>
81                     </a>
82                   </li>
83                   <!-- end message -->
84                   <li>
85                     <a href="#">
86                       <div class="pull-left">
87                         <img src="dist/img/user3-128x128.jpg" class="img-circle" alt="User Image">
88                       </div>
89                       <h4>
90                         AdminLTE Design Team
91                         <small><i class="fa fa-clock-o"></i> 2 hours</small>
92                       </h4>
93                       <p>Why not buy a new awesome theme?</p>
94                     </a>
95                   </li>
96                   <li>
97                     <a href="#">
98                       <div class="pull-left">
99                         <img src="dist/img/user4-128x128.jpg" class="img-circle" alt="User Image">
100                       </div>
101                       <h4>
102                         Developers
103                         <small><i class="fa fa-clock-o"></i> Today</small>
104                       </h4>
105                       <p>Why not buy a new awesome theme?</p>
106                     </a>
107                   </li>
108                   <li>
109                     <a href="#">
110                       <div class="pull-left">
111                         <img src="dist/img/user3-128x128.jpg" class="img-circle" alt="User Image">
112                       </div>
113                       <h4>
114                         Sales Department
115                         <small><i class="fa fa-clock-o"></i> Yesterday</small>
116                       </h4>
117                       <p>Why not buy a new awesome theme?</p>
118                     </a>
119                   </li>
120                   <li>
121                     <a href="#">
122                       <div class="pull-left">
123                         <img src="dist/img/user4-128x128.jpg" class="img-circle" alt="User Image">
124                       </div>
125                       <h4>
126                         Reviewers
127                         <small><i class="fa fa-clock-o"></i> 2 days</small>
128                       </h4>
129                       <p>Why not buy a new awesome theme?</p>
130                     </a>
131                   </li>
132                 </ul>
133               </li>
134               <li class="footer"><a href="#">See All Messages</a></li>
135             </ul>
136           </li>
137           <!-- Notifications: style can be found in dropdown.less -->
138           <li class="dropdown notifications-menu">
139             <a href="#" class="dropdown-toggle" data-toggle="dropdown">
140               <i class="fa fa-bell-o"></i>
141               <span class="label label-warning">10</span>
142             </a>
143             <ul class="dropdown-menu">
144               <li class="header">You have 10 notifications</li>
145               <li>
146                 <!-- inner menu: contains the actual data -->
147                 <ul class="menu">
148                   <li>
149                     <a href="#">
150                       <i class="fa fa-users text-aqua"></i> 5 new members joined today
151                     </a>
152                   </li>
153                   <li>
154                     <a href="#">
155                       <i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the
156                       page and may cause design problems
157                     </a>
158                   </li>
159                   <li>
160                     <a href="#">
161                       <i class="fa fa-users text-red"></i> 5 new members joined
162                     </a>
163                   </li>
164                   <li>
165                     <a href="#">
166                       <i class="fa fa-shopping-cart text-green"></i> 25 sales made
167                     </a>
168                   </li>
169                   <li>
170                     <a href="#">
171                       <i class="fa fa-user text-red"></i> You changed your username
172                     </a>
173                   </li>
174                 </ul>
175               </li>
176               <li class="footer"><a href="#">View all</a></li>
177             </ul>
178           </li>
179           <!-- Tasks: style can be found in dropdown.less -->
180           <li class="dropdown tasks-menu">
181             <a href="#" class="dropdown-toggle" data-toggle="dropdown">
182               <i class="fa fa-flag-o"></i>
183               <span class="label label-danger">9</span>
184             </a>
185             <ul class="dropdown-menu">
186               <li class="header">You have 9 tasks</li>
187               <li>
188                 <!-- inner menu: contains the actual data -->
189                 <ul class="menu">
190                   <li><!-- Task item -->
191                     <a href="#">
192                       <h3>
193                         Design some buttons
194                         <small class="pull-right">20%</small>
195                       </h3>
196                       <div class="progress xs">
197                         <div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
198                           <span class="sr-only">20% Complete</span>
199                         </div>
200                       </div>
201                     </a>
202                   </li>
203                   <!-- end task item -->
204                   <li><!-- Task item -->
205                     <a href="#">
206                       <h3>
207                         Create a nice theme
208                         <small class="pull-right">40%</small>
209                       </h3>
210                       <div class="progress xs">
211                         <div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
212                           <span class="sr-only">40% Complete</span>
213                         </div>
214                       </div>
215                     </a>
216                   </li>
217                   <!-- end task item -->
218                   <li><!-- Task item -->
219                     <a href="#">
220                       <h3>
221                         Some task I need to do
222                         <small class="pull-right">60%</small>
223                       </h3>
224                       <div class="progress xs">
225                         <div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
226                           <span class="sr-only">60% Complete</span>
227                         </div>
228                       </div>
229                     </a>
230                   </li>
231                   <!-- end task item -->
232                   <li><!-- Task item -->
233                     <a href="#">
234                       <h3>
235                         Make beautiful transitions
236                         <small class="pull-right">80%</small>
237                       </h3>
238                       <div class="progress xs">
239                         <div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
240                           <span class="sr-only">80% Complete</span>
241                         </div>
242                       </div>
243                     </a>
244                   </li>
245                   <!-- end task item -->
246                 </ul>
247               </li>
248               <li class="footer">
249                 <a href="#">View all tasks</a>
250               </li>
251             </ul>
252           </li>
253           <!-- User Account: style can be found in dropdown.less -->
254           <li class="dropdown user user-menu">
255             <a href="#" class="dropdown-toggle" data-toggle="dropdown">
256               <img src="dist/img/user2-160x160.jpg" class="user-image" alt="User Image">
257               <span class="hidden-xs">Alexander Pierce</span>
258             </a>
259             <ul class="dropdown-menu">
260               <!-- User image -->
261               <li class="user-header">
262                 <img src="dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
263
264                 <p>
265                   Alexander Pierce - Web Developer
266                   <small>Member since Nov. 2012</small>
267                 </p>
268               </li>
269               <!-- Menu Body -->
270               <li class="user-body">
271                 <div class="row">
272                   <div class="col-xs-4 text-center">
273                     <a href="#">Followers</a>
274                   </div>
275                   <div class="col-xs-4 text-center">
276                     <a href="#">Sales</a>
277                   </div>
278                   <div class="col-xs-4 text-center">
279                     <a href="#">Friends</a>
280                   </div>
281                 </div>
282                 <!-- /.row -->
283               </li>
284               <!-- Menu Footer-->
285               <li class="user-footer">
286                 <div class="pull-left">
287                   <a href="#" class="btn btn-default btn-flat">Profile</a>
288                 </div>
289                 <div class="pull-right">
290                   <a href="#" class="btn btn-default btn-flat">Sign out</a>
291                 </div>
292               </li>
293             </ul>
294           </li>
295           <!-- Control Sidebar Toggle Button -->
296           <li>
297             <a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
298           </li>
299         </ul>
300       </div>
301     </nav>
302   </header>
303   <!-- Left side column. contains the logo and sidebar -->
304   <aside class="main-sidebar">
305     <!-- sidebar: style can be found in sidebar.less -->
306     <section class="sidebar">
307       <!-- Sidebar user panel -->
308       <div class="user-panel">
309         <div class="pull-left image">
310           <img src="dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
311         </div>
312         <div class="pull-left info">
313           <p>Alexander Pierce</p>
314           <a href="#"><i class="fa fa-circle text-success"></i> Online</a>
315         </div>
316       </div>
317       <!-- search form -->
318       <form action="#" method="get" class="sidebar-form">
319         <div class="input-group">
320           <input type="text" name="q" class="form-control" placeholder="Search...">
321               <span class="input-group-btn">
322                 <button type="submit" name="search" id="search-btn" class="btn btn-flat"><i class="fa fa-search"></i>
323                 </button>
324               </span>
325         </div>
326       </form>
327       <!-- /.search form -->
328       <!-- sidebar menu: : style can be found in sidebar.less -->
329       <ul class="sidebar-menu">
330         <li class="header">MAIN NAVIGATION</li>
331         <li class="active treeview">
332           <a href="#">
333             <i class="fa fa-dashboard"></i> <span>Dashboard</span>
334             <span class="pull-right-container">
335               <i class="fa fa-angle-left pull-right"></i>
336             </span>
337           </a>
338           <ul class="treeview-menu">
339             <li class="active"><a href="index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
340             <li><a href="index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
341           </ul>
342         </li>
343         <li class="treeview">
344           <a href="#">
345             <i class="fa fa-files-o"></i>
346             <span>Layout Options</span>
347             <span class="pull-right-container">
348               <span class="label label-primary pull-right">4</span>
349             </span>
350           </a>
351           <ul class="treeview-menu">
352             <li><a href="pages/layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
353             <li><a href="pages/layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
354             <li><a href="pages/layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
355             <li><a href="pages/layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
356           </ul>
357         </li>
358         <li>
359           <a href="pages/widgets.html">
360             <i class="fa fa-th"></i> <span>Widgets</span>
361             <span class="pull-right-container">
362               <small class="label pull-right bg-green">new</small>
363             </span>
364           </a>
365         </li>
366         <li class="treeview">
367           <a href="#">
368             <i class="fa fa-pie-chart"></i>
369             <span>Charts</span>
370             <span class="pull-right-container">
371               <i class="fa fa-angle-left pull-right"></i>
372             </span>
373           </a>
374           <ul class="treeview-menu">
375             <li><a href="pages/charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
376             <li><a href="pages/charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
377             <li><a href="pages/charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
378             <li><a href="pages/charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
379           </ul>
380         </li>
381         <li class="treeview">
382           <a href="#">
383             <i class="fa fa-laptop"></i>
384             <span>UI Elements</span>
385             <span class="pull-right-container">
386               <i class="fa fa-angle-left pull-right"></i>
387             </span>
388           </a>
389           <ul class="treeview-menu">
390             <li><a href="pages/UI/general.html"><i class="fa fa-circle-o"></i> General</a></li>
391             <li><a href="pages/UI/icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
392             <li><a href="pages/UI/buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
393             <li><a href="pages/UI/sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
394             <li><a href="pages/UI/timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
395             <li><a href="pages/UI/modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
396           </ul>
397         </li>
398         <li class="treeview">
399           <a href="#">
400             <i class="fa fa-edit"></i> <span>Forms</span>
401             <span class="pull-right-container">
402               <i class="fa fa-angle-left pull-right"></i>
403             </span>
404           </a>
405           <ul class="treeview-menu">
406             <li><a href="pages/forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
407             <li><a href="pages/forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
408             <li><a href="pages/forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
409           </ul>
410         </li>
411         <li class="treeview">
412           <a href="#">
413             <i class="fa fa-table"></i> <span>Tables</span>
414             <span class="pull-right-container">
415               <i class="fa fa-angle-left pull-right"></i>
416             </span>
417           </a>
418           <ul class="treeview-menu">
419             <li><a href="pages/tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
420             <li><a href="pages/tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
421           </ul>
422         </li>
423         <li>
424           <a href="pages/calendar.html">
425             <i class="fa fa-calendar"></i> <span>Calendar</span>
426             <span class="pull-right-container">
427               <small class="label pull-right bg-red">3</small>
428               <small class="label pull-right bg-blue">17</small>
429             </span>
430           </a>
431         </li>
432         <li>
433           <a href="pages/mailbox/mailbox.html">
434             <i class="fa fa-envelope"></i> <span>Mailbox</span>
435             <span class="pull-right-container">
436               <small class="label pull-right bg-yellow">12</small>
437               <small class="label pull-right bg-green">16</small>
438               <small class="label pull-right bg-red">5</small>
439             </span>
440           </a>
441         </li>
442         <li class="treeview">
443           <a href="#">
444             <i class="fa fa-folder"></i> <span>Examples</span>
445             <span class="pull-right-container">
446               <i class="fa fa-angle-left pull-right"></i>
447             </span>
448           </a>
449           <ul class="treeview-menu">
450             <li><a href="pages/examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
451             <li><a href="pages/examples/profile.html"><i class="fa fa-circle-o"></i> Profile</a></li>
452             <li><a href="pages/examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
453             <li><a href="pages/examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
454             <li><a href="pages/examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
455             <li><a href="pages/examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
456             <li><a href="pages/examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
457             <li><a href="pages/examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
458             <li><a href="pages/examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li>
459           </ul>
460         </li>
461         <li class="treeview">
462           <a href="#">
463             <i class="fa fa-share"></i> <span>Multilevel</span>
464             <span class="pull-right-container">
465               <i class="fa fa-angle-left pull-right"></i>
466             </span>
467           </a>
468           <ul class="treeview-menu">
469             <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
470             <li>
471               <a href="#"><i class="fa fa-circle-o"></i> Level One
472                 <span class="pull-right-container">
473                   <i class="fa fa-angle-left pull-right"></i>
474                 </span>
475               </a>
476               <ul class="treeview-menu">
477                 <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
478                 <li>
479                   <a href="#"><i class="fa fa-circle-o"></i> Level Two
480                     <span class="pull-right-container">
481                       <i class="fa fa-angle-left pull-right"></i>
482                     </span>
483                   </a>
484                   <ul class="treeview-menu">
485                     <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
486                     <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
487                   </ul>
488                 </li>
489               </ul>
490             </li>
491             <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
492           </ul>
493         </li>
494         <li><a href="documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
495         <li class="header">LABELS</li>
496         <li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
497         <li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
498         <li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
499       </ul>
500     </section>
501     <!-- /.sidebar -->
502   </aside>
503
504   <!-- Content Wrapper. Contains page content -->
505   <div class="content-wrapper">
506     <!-- Content Header (Page header) -->
507     <section class="content-header">
508       <h1>
509         Dashboard
510         <small>Control panel</small>
511       </h1>
512       <ol class="breadcrumb">
513         <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
514         <li class="active">Dashboard</li>
515       </ol>
516     </section>
517
518     <!-- Main content -->
519     <section class="content">
520       <!-- Small boxes (Stat box) -->
521       <div class="row">
522         <div class="col-lg-3 col-xs-6">
523           <!-- small box -->
524           <div class="small-box bg-aqua">
525             <div class="inner">
526               <h3>150</h3>
527
528               <p>New Orders</p>
529             </div>
530             <div class="icon">
531               <i class="ion ion-bag"></i>
532             </div>
533             <a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
534           </div>
535         </div>
536         <!-- ./col -->
537         <div class="col-lg-3 col-xs-6">
538           <!-- small box -->
539           <div class="small-box bg-green">
540             <div class="inner">
541               <h3>53<sup style="font-size: 20px">%</sup></h3>
542
543               <p>Bounce Rate</p>
544             </div>
545             <div class="icon">
546               <i class="ion ion-stats-bars"></i>
547             </div>
548             <a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
549           </div>
550         </div>
551         <!-- ./col -->
552         <div class="col-lg-3 col-xs-6">
553           <!-- small box -->
554           <div class="small-box bg-yellow">
555             <div class="inner">
556               <h3>44</h3>
557
558               <p>User Registrations</p>
559             </div>
560             <div class="icon">
561               <i class="ion ion-person-add"></i>
562             </div>
563             <a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
564           </div>
565         </div>
566         <!-- ./col -->
567         <div class="col-lg-3 col-xs-6">
568           <!-- small box -->
569           <div class="small-box bg-red">
570             <div class="inner">
571               <h3>65</h3>
572
573               <p>Unique Visitors</p>
574             </div>
575             <div class="icon">
576               <i class="ion ion-pie-graph"></i>
577             </div>
578             <a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
579           </div>
580         </div>
581         <!-- ./col -->
582       </div>
583       <!-- /.row -->
584       <!-- Main row -->
585       <div class="row">
586         <!-- Left col -->
587         <section class="col-lg-7 connectedSortable">
588           <!-- Custom tabs (Charts with tabs)-->
589           <div class="nav-tabs-custom">
590             <!-- Tabs within a box -->
591             <ul class="nav nav-tabs pull-right">
592               <li class="active"><a href="#revenue-chart" data-toggle="tab">Area</a></li>
593               <li><a href="#sales-chart" data-toggle="tab">Donut</a></li>
594               <li class="pull-left header"><i class="fa fa-inbox"></i> Sales</li>
595             </ul>
596             <div class="tab-content no-padding">
597               <!-- Morris chart - Sales -->
598               <div class="chart tab-pane active" id="revenue-chart" style="position: relative; height: 300px;"></div>
599               <div class="chart tab-pane" id="sales-chart" style="position: relative; height: 300px;"></div>
600             </div>
601           </div>
602           <!-- /.nav-tabs-custom -->
603
604           <!-- Chat box -->
605           <div class="box box-success">
606             <div class="box-header">
607               <i class="fa fa-comments-o"></i>
608
609               <h3 class="box-title">Chat</h3>
610
611               <div class="box-tools pull-right" data-toggle="tooltip" title="Status">
612                 <div class="btn-group" data-toggle="btn-toggle">
613                   <button type="button" class="btn btn-default btn-sm active"><i class="fa fa-square text-green"></i>
614                   </button>
615                   <button type="button" class="btn btn-default btn-sm"><i class="fa fa-square text-red"></i></button>
616                 </div>
617               </div>
618             </div>
619             <div class="box-body chat" id="chat-box">
620               <!-- chat item -->
621               <div class="item">
622                 <img src="dist/img/user4-128x128.jpg" alt="user image" class="online">
623
624                 <p class="message">
625                   <a href="#" class="name">
626                     <small class="text-muted pull-right"><i class="fa fa-clock-o"></i> 2:15</small>
627                     Mike Doe
628                   </a>
629                   I would like to meet you to discuss the latest news about
630                   the arrival of the new theme. They say it is going to be one the
631                   best themes on the market
632                 </p>
633                 <div class="attachment">
634                   <h4>Attachments:</h4>
635
636                   <p class="filename">
637                     Theme-thumbnail-image.jpg
638                   </p>
639
640                   <div class="pull-right">
641                     <button type="button" class="btn btn-primary btn-sm btn-flat">Open</button>
642                   </div>
643                 </div>
644                 <!-- /.attachment -->
645               </div>
646               <!-- /.item -->
647               <!-- chat item -->
648               <div class="item">
649                 <img src="dist/img/user3-128x128.jpg" alt="user image" class="offline">
650
651                 <p class="message">
652                   <a href="#" class="name">
653                     <small class="text-muted pull-right"><i class="fa fa-clock-o"></i> 5:15</small>
654                     Alexander Pierce
655                   </a>
656                   I would like to meet you to discuss the latest news about
657                   the arrival of the new theme. They say it is going to be one the
658                   best themes on the market
659                 </p>
660               </div>
661               <!-- /.item -->
662               <!-- chat item -->
663               <div class="item">
664                 <img src="dist/img/user2-160x160.jpg" alt="user image" class="offline">
665
666                 <p class="message">
667                   <a href="#" class="name">
668                     <small class="text-muted pull-right"><i class="fa fa-clock-o"></i> 5:30</small>
669                     Susan Doe
670                   </a>
671                   I would like to meet you to discuss the latest news about
672                   the arrival of the new theme. They say it is going to be one the
673                   best themes on the market
674                 </p>
675               </div>
676               <!-- /.item -->
677             </div>
678             <!-- /.chat -->
679             <div class="box-footer">
680               <div class="input-group">
681                 <input class="form-control" placeholder="Type message...">
682
683                 <div class="input-group-btn">
684                   <button type="button" class="btn btn-success"><i class="fa fa-plus"></i></button>
685                 </div>
686               </div>
687             </div>
688           </div>
689           <!-- /.box (chat box) -->
690
691           <!-- TO DO List -->
692           <div class="box box-primary">
693             <div class="box-header">
694               <i class="ion ion-clipboard"></i>
695
696               <h3 class="box-title">To Do List</h3>
697
698               <div class="box-tools pull-right">
699                 <ul class="pagination pagination-sm inline">
700                   <li><a href="#">&laquo;</a></li>
701                   <li><a href="#">1</a></li>
702                   <li><a href="#">2</a></li>
703                   <li><a href="#">3</a></li>
704                   <li><a href="#">&raquo;</a></li>
705                 </ul>
706               </div>
707             </div>
708             <!-- /.box-header -->
709             <div class="box-body">
710               <ul class="todo-list">
711                 <li>
712                   <!-- drag handle -->
713                       <span class="handle">
714                         <i class="fa fa-ellipsis-v"></i>
715                         <i class="fa fa-ellipsis-v"></i>
716                       </span>
717                   <!-- checkbox -->
718                   <input type="checkbox" value="">
719                   <!-- todo text -->
720                   <span class="text">Design a nice theme</span>
721                   <!-- Emphasis label -->
722                   <small class="label label-danger"><i class="fa fa-clock-o"></i> 2 mins</small>
723                   <!-- General tools such as edit or delete-->
724                   <div class="tools">
725                     <i class="fa fa-edit"></i>
726                     <i class="fa fa-trash-o"></i>
727                   </div>
728                 </li>
729                 <li>
730                       <span class="handle">
731                         <i class="fa fa-ellipsis-v"></i>
732                         <i class="fa fa-ellipsis-v"></i>
733                       </span>
734                   <input type="checkbox" value="">
735                   <span class="text">Make the theme responsive</span>
736                   <small class="label label-info"><i class="fa fa-clock-o"></i> 4 hours</small>
737                   <div class="tools">
738                     <i class="fa fa-edit"></i>
739                     <i class="fa fa-trash-o"></i>
740                   </div>
741                 </li>
742                 <li>
743                       <span class="handle">
744                         <i class="fa fa-ellipsis-v"></i>
745                         <i class="fa fa-ellipsis-v"></i>
746                       </span>
747                   <input type="checkbox" value="">
748                   <span class="text">Let theme shine like a star</span>
749                   <small class="label label-warning"><i class="fa fa-clock-o"></i> 1 day</small>
750                   <div class="tools">
751                     <i class="fa fa-edit"></i>
752                     <i class="fa fa-trash-o"></i>
753                   </div>
754                 </li>
755                 <li>
756                       <span class="handle">
757                         <i class="fa fa-ellipsis-v"></i>
758                         <i class="fa fa-ellipsis-v"></i>
759                       </span>
760                   <input type="checkbox" value="">
761                   <span class="text">Let theme shine like a star</span>
762                   <small class="label label-success"><i class="fa fa-clock-o"></i> 3 days</small>
763                   <div class="tools">
764                     <i class="fa fa-edit"></i>
765                     <i class="fa fa-trash-o"></i>
766                   </div>
767                 </li>
768                 <li>
769                       <span class="handle">
770                         <i class="fa fa-ellipsis-v"></i>
771                         <i class="fa fa-ellipsis-v"></i>
772                       </span>
773                   <input type="checkbox" value="">
774                   <span class="text">Check your messages and notifications</span>
775                   <small class="label label-primary"><i class="fa fa-clock-o"></i> 1 week</small>
776                   <div class="tools">
777                     <i class="fa fa-edit"></i>
778                     <i class="fa fa-trash-o"></i>
779                   </div>
780                 </li>
781                 <li>
782                       <span class="handle">
783                         <i class="fa fa-ellipsis-v"></i>
784                         <i class="fa fa-ellipsis-v"></i>
785                       </span>
786                   <input type="checkbox" value="">
787                   <span class="text">Let theme shine like a star</span>
788                   <small class="label label-default"><i class="fa fa-clock-o"></i> 1 month</small>
789                   <div class="tools">
790                     <i class="fa fa-edit"></i>
791                     <i class="fa fa-trash-o"></i>
792                   </div>
793                 </li>
794               </ul>
795             </div>
796             <!-- /.box-body -->
797             <div class="box-footer clearfix no-border">
798               <button type="button" class="btn btn-default pull-right"><i class="fa fa-plus"></i> Add item</button>
799             </div>
800           </div>
801           <!-- /.box -->
802
803           <!-- quick email widget -->
804           <div class="box box-info">
805             <div class="box-header">
806               <i class="fa fa-envelope"></i>
807
808               <h3 class="box-title">Quick Email</h3>
809               <!-- tools box -->
810               <div class="pull-right box-tools">
811                 <button type="button" class="btn btn-info btn-sm" data-widget="remove" data-toggle="tooltip" title="Remove">
812                   <i class="fa fa-times"></i></button>
813               </div>
814               <!-- /. tools -->
815             </div>
816             <div class="box-body">
817               <form action="#" method="post">
818                 <div class="form-group">
819                   <input type="email" class="form-control" name="emailto" placeholder="Email to:">
820                 </div>
821                 <div class="form-group">
822                   <input type="text" class="form-control" name="subject" placeholder="Subject">
823                 </div>
824                 <div>
825                   <textarea class="textarea" placeholder="Message" style="width: 100%; height: 125px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;"></textarea>
826                 </div>
827               </form>
828             </div>
829             <div class="box-footer clearfix">
830               <button type="button" class="pull-right btn btn-default" id="sendEmail">Send
831                 <i class="fa fa-arrow-circle-right"></i></button>
832             </div>
833           </div>
834
835         </section>
836         <!-- /.Left col -->
837         <!-- right col (We are only adding the ID to make the widgets sortable)-->
838         <section class="col-lg-5 connectedSortable">
839
840           <!-- Map box -->
841           <div class="box box-solid bg-light-blue-gradient">
842             <div class="box-header">
843               <!-- tools box -->
844               <div class="pull-right box-tools">
845                 <button type="button" class="btn btn-primary btn-sm daterange pull-right" data-toggle="tooltip" title="Date range">
846                   <i class="fa fa-calendar"></i></button>
847                 <button type="button" class="btn btn-primary btn-sm pull-right" data-widget="collapse" data-toggle="tooltip" title="Collapse" style="margin-right: 5px;">
848                   <i class="fa fa-minus"></i></button>
849               </div>
850               <!-- /. tools -->
851
852               <i class="fa fa-map-marker"></i>
853
854               <h3 class="box-title">
855                 Visitors
856               </h3>
857             </div>
858             <div class="box-body">
859               <div id="world-map" style="height: 250px; width: 100%;"></div>
860             </div>
861             <!-- /.box-body-->
862             <div class="box-footer no-border">
863               <div class="row">
864                 <div class="col-xs-4 text-center" style="border-right: 1px solid #f4f4f4">
865                   <div id="sparkline-1"></div>
866                   <div class="knob-label">Visitors</div>
867                 </div>
868                 <!-- ./col -->
869                 <div class="col-xs-4 text-center" style="border-right: 1px solid #f4f4f4">
870                   <div id="sparkline-2"></div>
871                   <div class="knob-label">Online</div>
872                 </div>
873                 <!-- ./col -->
874                 <div class="col-xs-4 text-center">
875                   <div id="sparkline-3"></div>
876                   <div class="knob-label">Exists</div>
877                 </div>
878                 <!-- ./col -->
879               </div>
880               <!-- /.row -->
881             </div>
882           </div>
883           <!-- /.box -->
884
885           <!-- solid sales graph -->
886           <div class="box box-solid bg-teal-gradient">
887             <div class="box-header">
888               <i class="fa fa-th"></i>
889
890               <h3 class="box-title">Sales Graph</h3>
891
892               <div class="box-tools pull-right">
893                 <button type="button" class="btn bg-teal btn-sm" data-widget="collapse"><i class="fa fa-minus"></i>
894                 </button>
895                 <button type="button" class="btn bg-teal btn-sm" data-widget="remove"><i class="fa fa-times"></i>
896                 </button>
897               </div>
898             </div>
899             <div class="box-body border-radius-none">
900               <div class="chart" id="line-chart" style="height: 250px;"></div>
901             </div>
902             <!-- /.box-body -->
903             <div class="box-footer no-border">
904               <div class="row">
905                 <div class="col-xs-4 text-center" style="border-right: 1px solid #f4f4f4">
906                   <input type="text" class="knob" data-readonly="true" value="20" data-width="60" data-height="60" data-fgColor="#39CCCC">
907
908                   <div class="knob-label">Mail-Orders</div>
909                 </div>
910                 <!-- ./col -->
911                 <div class="col-xs-4 text-center" style="border-right: 1px solid #f4f4f4">
912                   <input type="text" class="knob" data-readonly="true" value="50" data-width="60" data-height="60" data-fgColor="#39CCCC">
913
914                   <div class="knob-label">Online</div>
915                 </div>
916                 <!-- ./col -->
917                 <div class="col-xs-4 text-center">
918                   <input type="text" class="knob" data-readonly="true" value="30" data-width="60" data-height="60" data-fgColor="#39CCCC">
919
920                   <div class="knob-label">In-Store</div>
921                 </div>
922                 <!-- ./col -->
923               </div>
924               <!-- /.row -->
925             </div>
926             <!-- /.box-footer -->
927           </div>
928           <!-- /.box -->
929
930           <!-- Calendar -->
931           <div class="box box-solid bg-green-gradient">
932             <div class="box-header">
933               <i class="fa fa-calendar"></i>
934
935               <h3 class="box-title">Calendar</h3>
936               <!-- tools box -->
937               <div class="pull-right box-tools">
938                 <!-- button with a dropdown -->
939                 <div class="btn-group">
940                   <button type="button" class="btn btn-success btn-sm dropdown-toggle" data-toggle="dropdown">
941                     <i class="fa fa-bars"></i></button>
942                   <ul class="dropdown-menu pull-right" role="menu">
943                     <li><a href="#">Add new event</a></li>
944                     <li><a href="#">Clear events</a></li>
945                     <li class="divider"></li>
946                     <li><a href="#">View calendar</a></li>
947                   </ul>
948                 </div>
949                 <button type="button" class="btn btn-success btn-sm" data-widget="collapse"><i class="fa fa-minus"></i>
950                 </button>
951                 <button type="button" class="btn btn-success btn-sm" data-widget="remove"><i class="fa fa-times"></i>
952                 </button>
953               </div>
954               <!-- /. tools -->
955             </div>
956             <!-- /.box-header -->
957             <div class="box-body no-padding">
958               <!--The calendar -->
959               <div id="calendar" style="width: 100%"></div>
960             </div>
961             <!-- /.box-body -->
962             <div class="box-footer text-black">
963               <div class="row">
964                 <div class="col-sm-6">
965                   <!-- Progress bars -->
966                   <div class="clearfix">
967                     <span class="pull-left">Task #1</span>
968                     <small class="pull-right">90%</small>
969                   </div>
970                   <div class="progress xs">
971                     <div class="progress-bar progress-bar-green" style="width: 90%;"></div>
972                   </div>
973
974                   <div class="clearfix">
975                     <span class="pull-left">Task #2</span>
976                     <small class="pull-right">70%</small>
977                   </div>
978                   <div class="progress xs">
979                     <div class="progress-bar progress-bar-green" style="width: 70%;"></div>
980                   </div>
981                 </div>
982                 <!-- /.col -->
983                 <div class="col-sm-6">
984                   <div class="clearfix">
985                     <span class="pull-left">Task #3</span>
986                     <small class="pull-right">60%</small>
987                   </div>
988                   <div class="progress xs">
989                     <div class="progress-bar progress-bar-green" style="width: 60%;"></div>
990                   </div>
991
992                   <div class="clearfix">
993                     <span class="pull-left">Task #4</span>
994                     <small class="pull-right">40%</small>
995                   </div>
996                   <div class="progress xs">
997                     <div class="progress-bar progress-bar-green" style="width: 40%;"></div>
998                   </div>
999                 </div>
1000                 <!-- /.col -->
1001               </div>
1002               <!-- /.row -->
1003             </div>
1004           </div>
1005           <!-- /.box -->
1006
1007         </section>
1008         <!-- right col -->
1009       </div>
1010       <!-- /.row (main row) -->
1011
1012     </section>
1013     <!-- /.content -->
1014   </div>
1015   <!-- /.content-wrapper -->
1016   <footer class="main-footer">
1017     <div class="pull-right hidden-xs">
1018       <b>Version</b> 2.3.7
1019     </div>
1020     <strong>Copyright &copy; 2014-2016 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights
1021     reserved.
1022   </footer>
1023
1024   <!-- Control Sidebar -->
1025   <aside class="control-sidebar control-sidebar-dark">
1026     <!-- Create the tabs -->
1027     <ul class="nav nav-tabs nav-justified control-sidebar-tabs">
1028       <li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
1029       <li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
1030     </ul>
1031     <!-- Tab panes -->
1032     <div class="tab-content">
1033       <!-- Home tab content -->
1034       <div class="tab-pane" id="control-sidebar-home-tab">
1035         <h3 class="control-sidebar-heading">Recent Activity</h3>
1036         <ul class="control-sidebar-menu">
1037           <li>
1038             <a href="javascript:void(0)">
1039               <i class="menu-icon fa fa-birthday-cake bg-red"></i>
1040
1041               <div class="menu-info">
1042                 <h4 class="control-sidebar-subheading">Langdon's Birthday</h4>
1043
1044                 <p>Will be 23 on April 24th</p>
1045               </div>
1046             </a>
1047           </li>
1048           <li>
1049             <a href="javascript:void(0)">
1050               <i class="menu-icon fa fa-user bg-yellow"></i>
1051
1052               <div class="menu-info">
1053                 <h4 class="control-sidebar-subheading">Frodo Updated His Profile</h4>
1054
1055                 <p>New phone +1(800)555-1234</p>
1056               </div>
1057             </a>
1058           </li>
1059           <li>
1060             <a href="javascript:void(0)">
1061               <i class="menu-icon fa fa-envelope-o bg-light-blue"></i>
1062
1063               <div class="menu-info">
1064                 <h4 class="control-sidebar-subheading">Nora Joined Mailing List</h4>
1065
1066                 <p>nora@example.com</p>
1067               </div>
1068             </a>
1069           </li>
1070           <li>
1071             <a href="javascript:void(0)">
1072               <i class="menu-icon fa fa-file-code-o bg-green"></i>
1073
1074               <div class="menu-info">
1075                 <h4 class="control-sidebar-subheading">Cron Job 254 Executed</h4>
1076
1077                 <p>Execution time 5 seconds</p>
1078               </div>
1079             </a>
1080           </li>
1081         </ul>
1082         <!-- /.control-sidebar-menu -->
1083
1084         <h3 class="control-sidebar-heading">Tasks Progress</h3>
1085         <ul class="control-sidebar-menu">
1086           <li>
1087             <a href="javascript:void(0)">
1088               <h4 class="control-sidebar-subheading">
1089                 Custom Template Design
1090                 <span class="label label-danger pull-right">70%</span>
1091               </h4>
1092
1093               <div class="progress progress-xxs">
1094                 <div class="progress-bar progress-bar-danger" style="width: 70%"></div>
1095               </div>
1096             </a>
1097           </li>
1098           <li>
1099             <a href="javascript:void(0)">
1100               <h4 class="control-sidebar-subheading">
1101                 Update Resume
1102                 <span class="label label-success pull-right">95%</span>
1103               </h4>
1104
1105               <div class="progress progress-xxs">
1106                 <div class="progress-bar progress-bar-success" style="width: 95%"></div>
1107               </div>
1108             </a>
1109           </li>
1110           <li>
1111             <a href="javascript:void(0)">
1112               <h4 class="control-sidebar-subheading">
1113                 Laravel Integration
1114                 <span class="label label-warning pull-right">50%</span>
1115               </h4>
1116
1117               <div class="progress progress-xxs">
1118                 <div class="progress-bar progress-bar-warning" style="width: 50%"></div>
1119               </div>
1120             </a>
1121           </li>
1122           <li>
1123             <a href="javascript:void(0)">
1124               <h4 class="control-sidebar-subheading">
1125                 Back End Framework
1126                 <span class="label label-primary pull-right">68%</span>
1127               </h4>
1128
1129               <div class="progress progress-xxs">
1130                 <div class="progress-bar progress-bar-primary" style="width: 68%"></div>
1131               </div>
1132             </a>
1133           </li>
1134         </ul>
1135         <!-- /.control-sidebar-menu -->
1136
1137       </div>
1138       <!-- /.tab-pane -->
1139       <!-- Stats tab content -->
1140       <div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div>
1141       <!-- /.tab-pane -->
1142       <!-- Settings tab content -->
1143       <div class="tab-pane" id="control-sidebar-settings-tab">
1144         <form method="post">
1145           <h3 class="control-sidebar-heading">General Settings</h3>
1146
1147           <div class="form-group">
1148             <label class="control-sidebar-subheading">
1149               Report panel usage
1150               <input type="checkbox" class="pull-right" checked>
1151             </label>
1152
1153             <p>
1154               Some information about this general settings option
1155             </p>
1156           </div>
1157           <!-- /.form-group -->
1158
1159           <div class="form-group">
1160             <label class="control-sidebar-subheading">
1161               Allow mail redirect
1162               <input type="checkbox" class="pull-right" checked>
1163             </label>
1164
1165             <p>
1166               Other sets of options are available
1167             </p>
1168           </div>
1169           <!-- /.form-group -->
1170
1171           <div class="form-group">
1172             <label class="control-sidebar-subheading">
1173               Expose author name in posts
1174               <input type="checkbox" class="pull-right" checked>
1175             </label>
1176
1177             <p>
1178               Allow the user to show his name in blog posts
1179             </p>
1180           </div>
1181           <!-- /.form-group -->
1182
1183           <h3 class="control-sidebar-heading">Chat Settings</h3>
1184
1185           <div class="form-group">
1186             <label class="control-sidebar-subheading">
1187               Show me as online
1188               <input type="checkbox" class="pull-right" checked>
1189             </label>
1190           </div>
1191           <!-- /.form-group -->
1192
1193           <div class="form-group">
1194             <label class="control-sidebar-subheading">
1195               Turn off notifications
1196               <input type="checkbox" class="pull-right">
1197             </label>
1198           </div>
1199           <!-- /.form-group -->
1200
1201           <div class="form-group">
1202             <label class="control-sidebar-subheading">
1203               Delete chat history
1204               <a href="javascript:void(0)" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
1205             </label>
1206           </div>
1207           <!-- /.form-group -->
1208         </form>
1209       </div>
1210       <!-- /.tab-pane -->
1211     </div>
1212   </aside>
1213   <!-- /.control-sidebar -->
1214   <!-- Add the sidebar's background. This div must be placed
1215        immediately after the control sidebar -->
1216   <div class="control-sidebar-bg"></div>
1217 </div>
1218 <!-- ./wrapper -->
1219
1220 <!-- jQuery 2.2.3 -->
1221 <script src="plugins/jQuery/jquery-2.2.3.min.js"></script>
1222 <!-- jQuery UI 1.11.4 -->
1223 <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
1224 <!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
1225 <script>
1226   $.widget.bridge('uibutton', $.ui.button);
1227 </script>
1228 <!-- Bootstrap 3.3.6 -->
1229 <script src="bootstrap/js/bootstrap.min.js"></script>
1230 <!-- Morris.js charts -->
1231 <script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
1232 <script src="plugins/morris/morris.min.js"></script>
1233 <!-- Sparkline -->
1234 <script src="plugins/sparkline/jquery.sparkline.min.js"></script>
1235 <!-- jvectormap -->
1236 <script src="plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
1237 <script src="plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
1238 <!-- jQuery Knob Chart -->
1239 <script src="plugins/knob/jquery.knob.js"></script>
1240 <!-- daterangepicker -->
1241 <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.11.2/moment.min.js"></script>
1242 <script src="plugins/daterangepicker/daterangepicker.js"></script>
1243 <!-- datepicker -->
1244 <script src="plugins/datepicker/bootstrap-datepicker.js"></script>
1245 <!-- Bootstrap WYSIHTML5 -->
1246 <script src="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
1247 <!-- Slimscroll -->
1248 <script src="plugins/slimScroll/jquery.slimscroll.min.js"></script>
1249 <!-- FastClick -->
1250 <script src="plugins/fastclick/fastclick.js"></script>
1251 <!-- AdminLTE App -->
1252 <script src="dist/js/app.min.js"></script>
1253 <!-- AdminLTE dashboard demo (This is only for demo purposes) -->
1254 <script src="dist/js/pages/dashboard.js"></script>
1255 <!-- AdminLTE for demo purposes -->
1256 <script src="dist/js/demo.js"></script>
1257 </body>
1258 </html>