]> git.proxmox.com Git - ceph.git/blame - ceph/src/pybind/mgr/dashboard/static/AdminLTE-2.3.7/pages/UI/modals.html
projects / ceph.git / blame
? search:
summary | shortlog | log | commit | commitdiff | tree
blob | blame (incremental) | history | HEAD
bump version to 12.2.2-pve1
[ceph.git] / ceph / src / pybind / mgr / dashboard / static / AdminLTE-2.3.7 / pages / UI / modals.html
CommitLineData
31f18b77
FG		 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 | Modals</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
28 <style>
29 .example-modal .modal {
30 position: relative;
31 top: auto;
32 bottom: auto;
33 right: auto;
34 left: auto;
35 display: block;
36 z-index: 1;
37 }
38
39 .example-modal .modal {
40 background: transparent !important;
41 }
42 </style>
43</head>
44<body class="hold-transition skin-blue sidebar-mini">
45<div class="wrapper">
46
47 <header class="main-header">
48 <!-- Logo -->
49 <a href="../../index2.html" class="logo">
50 <!-- mini logo for sidebar mini 50x50 pixels -->
51 <span class="logo-mini"><b>A</b>LT</span>
52 <!-- logo for regular state and mobile devices -->
53 <span class="logo-lg"><b>Admin</b>LTE</span>
54 </a>
55 <!-- Header Navbar: style can be found in header.less -->
56 <nav class="navbar navbar-static-top">
57 <!-- Sidebar toggle button-->
58 <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
59 <span class="sr-only">Toggle navigation</span>
60 <span class="icon-bar"></span>
61 <span class="icon-bar"></span>
62 <span class="icon-bar"></span>
63 </a>
64
65 <div class="navbar-custom-menu">
66 <ul class="nav navbar-nav">
67 <!-- Messages: style can be found in dropdown.less-->
68 <li class="dropdown messages-menu">
69 <a href="#" class="dropdown-toggle" data-toggle="dropdown">
70 <i class="fa fa-envelope-o"></i>
71 <span class="label label-success">4</span>
72 </a>
73 <ul class="dropdown-menu">
74 <li class="header">You have 4 messages</li>
75 <li>
76 <!-- inner menu: contains the actual data -->
77 <ul class="menu">
78 <li><!-- start message -->
79 <a href="#">
80 <div class="pull-left">
81 <img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
82 </div>
83 <h4>
84 Support Team
85 <small><i class="fa fa-clock-o"></i> 5 mins</small>
86 </h4>
87 <p>Why not buy a new awesome theme?</p>
88 </a>
89 </li>
90 <!-- end message -->
91 <li>
92 <a href="#">
93 <div class="pull-left">
94 <img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="User Image">
95 </div>
96 <h4>
97 AdminLTE Design Team
98 <small><i class="fa fa-clock-o"></i> 2 hours</small>
99 </h4>
100 <p>Why not buy a new awesome theme?</p>
101 </a>
102 </li>
103 <li>
104 <a href="#">
105 <div class="pull-left">
106 <img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="User Image">
107 </div>
108 <h4>
109 Developers
110 <small><i class="fa fa-clock-o"></i> Today</small>
111 </h4>
112 <p>Why not buy a new awesome theme?</p>
113 </a>
114 </li>
115 <li>
116 <a href="#">
117 <div class="pull-left">
118 <img src="../../dist/img/user3-128x128.jpg" class="img-circle" alt="User Image">
119 </div>
120 <h4>
121 Sales Department
122 <small><i class="fa fa-clock-o"></i> Yesterday</small>
123 </h4>
124 <p>Why not buy a new awesome theme?</p>
125 </a>
126 </li>
127 <li>
128 <a href="#">
129 <div class="pull-left">
130 <img src="../../dist/img/user4-128x128.jpg" class="img-circle" alt="User Image">
131 </div>
132 <h4>
133 Reviewers
134 <small><i class="fa fa-clock-o"></i> 2 days</small>
135 </h4>
136 <p>Why not buy a new awesome theme?</p>
137 </a>
138 </li>
139 </ul>
140 </li>
141 <li class="footer"><a href="#">See All Messages</a></li>
142 </ul>
143 </li>
144 <!-- Notifications: style can be found in dropdown.less -->
145 <li class="dropdown notifications-menu">
146 <a href="#" class="dropdown-toggle" data-toggle="dropdown">
147 <i class="fa fa-bell-o"></i>
148 <span class="label label-warning">10</span>
149 </a>
150 <ul class="dropdown-menu">
151 <li class="header">You have 10 notifications</li>
152 <li>
153 <!-- inner menu: contains the actual data -->
154 <ul class="menu">
155 <li>
156 <a href="#">
157 <i class="fa fa-users text-aqua"></i> 5 new members joined today
158 </a>
159 </li>
160 <li>
161 <a href="#">
162 <i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the
163 page and may cause design problems
164 </a>
165 </li>
166 <li>
167 <a href="#">
168 <i class="fa fa-users text-red"></i> 5 new members joined
169 </a>
170 </li>
171
172 <li>
173 <a href="#">
174 <i class="fa fa-shopping-cart text-green"></i> 25 sales made
175 </a>
176 </li>
177 <li>
178 <a href="#">
179 <i class="fa fa-user text-red"></i> You changed your username
180 </a>
181 </li>
182 </ul>
183 </li>
184 <li class="footer"><a href="#">View all</a></li>
185 </ul>
186 </li>
187 <!-- Tasks: style can be found in dropdown.less -->
188 <li class="dropdown tasks-menu">
189 <a href="#" class="dropdown-toggle" data-toggle="dropdown">
190 <i class="fa fa-flag-o"></i>
191 <span class="label label-danger">9</span>
192 </a>
193 <ul class="dropdown-menu">
194 <li class="header">You have 9 tasks</li>
195 <li>
196 <!-- inner menu: contains the actual data -->
197 <ul class="menu">
198 <li><!-- Task item -->
199 <a href="#">
200 <h3>
201 Design some buttons
202 <small class="pull-right">20%</small>
203 </h3>
204 <div class="progress xs">
205 <div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
206 <span class="sr-only">20% Complete</span>
207 </div>
208 </div>
209 </a>
210 </li>
211 <!-- end task item -->
212 <li><!-- Task item -->
213 <a href="#">
214 <h3>
215 Create a nice theme
216 <small class="pull-right">40%</small>
217 </h3>
218 <div class="progress xs">
219 <div class="progress-bar progress-bar-green" style="width: 40%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
220 <span class="sr-only">40% Complete</span>
221 </div>
222 </div>
223 </a>
224 </li>
225 <!-- end task item -->
226 <li><!-- Task item -->
227 <a href="#">
228 <h3>
229 Some task I need to do
230 <small class="pull-right">60%</small>
231 </h3>
232 <div class="progress xs">
233 <div class="progress-bar progress-bar-red" style="width: 60%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
234 <span class="sr-only">60% Complete</span>
235 </div>
236 </div>
237 </a>
238 </li>
239 <!-- end task item -->
240 <li><!-- Task item -->
241 <a href="#">
242 <h3>
243 Make beautiful transitions
244 <small class="pull-right">80%</small>
245 </h3>
246 <div class="progress xs">
247 <div class="progress-bar progress-bar-yellow" style="width: 80%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
248 <span class="sr-only">80% Complete</span>
249 </div>
250 </div>
251 </a>
252 </li>
253 <!-- end task item -->
254 </ul>
255 </li>
256 <li class="footer">
257 <a href="#">View all tasks</a>
258 </li>
259 </ul>
260 </li>
261 <!-- User Account: style can be found in dropdown.less -->
262 <li class="dropdown user user-menu">
263 <a href="#" class="dropdown-toggle" data-toggle="dropdown">
264 <img src="../../dist/img/user2-160x160.jpg" class="user-image" alt="User Image">
265 <span class="hidden-xs">Alexander Pierce</span>
266 </a>
267 <ul class="dropdown-menu">
268 <!-- User image -->
269 <li class="user-header">
270 <img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
271
272 <p>
273 Alexander Pierce - Web Developer
274 <small>Member since Nov. 2012</small>
275 </p>
276 </li>
277 <!-- Menu Body -->
278 <li class="user-body">
279 <div class="row">
280 <div class="col-xs-4 text-center">
281 <a href="#">Followers</a>
282 </div>
283 <div class="col-xs-4 text-center">
284 <a href="#">Sales</a>
285 </div>
286 <div class="col-xs-4 text-center">
287 <a href="#">Friends</a>
288 </div>
289 </div>
290 <!-- /.row -->
291 </li>
292 <!-- Menu Footer-->
293 <li class="user-footer">
294 <div class="pull-left">
295 <a href="#" class="btn btn-default btn-flat">Profile</a>
296 </div>
297 <div class="pull-right">
298 <a href="#" class="btn btn-default btn-flat">Sign out</a>
299 </div>
300 </li>
301 </ul>
302 </li>
303 </ul>
304 </div>
305 </nav>
306 </header>
307 <!-- Left side column. contains the logo and sidebar -->
308 <aside class="main-sidebar">
309 <!-- sidebar: style can be found in sidebar.less -->
310 <section class="sidebar">
311 <!-- Sidebar user panel -->
312 <div class="user-panel">
313 <div class="pull-left image">
314 <img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
315 </div>
316 <div class="pull-left info">
317 <p>Alexander Pierce</p>
318 <a href="#"><i class="fa fa-circle text-success"></i> Online</a>
319 </div>
320 </div>
321 <!-- search form -->
322 <form action="#" method="get" class="sidebar-form">
323 <div class="input-group">
324 <input type="text" name="q" class="form-control" placeholder="Search...">
325 <span class="input-group-btn">
326 <button type="submit" name="search" id="search-btn" class="btn btn-flat"><i class="fa fa-search"></i>
327 </button>
328 </span>
329 </div>
330 </form>
331 <!-- /.search form -->
332 <!-- sidebar menu: : style can be found in sidebar.less -->
333 <ul class="sidebar-menu">
334 <li class="header">MAIN NAVIGATION</li>
335 <li class="treeview">
336 <a href="#">
337 <i class="fa fa-dashboard"></i> <span>Dashboard</span>
338 <span class="pull-right-container">
339 <i class="fa fa-angle-left pull-right"></i>
340 </span>
341 </a>
342 <ul class="treeview-menu">
343 <li><a href="../../index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
344 <li><a href="../../index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
345 </ul>
346 </li>
347 <li class="treeview">
348 <a href="#">
349 <i class="fa fa-files-o"></i>
350 <span>Layout Options</span>
351 <span class="pull-right-container">
352 <span class="label label-primary pull-right">4</span>
353 </span>
354 </a>
355 <ul class="treeview-menu">
356 <li><a href="../layout/top-nav.html"><i class="fa fa-circle-o"></i> Top Navigation</a></li>
357 <li><a href="../layout/boxed.html"><i class="fa fa-circle-o"></i> Boxed</a></li>
358 <li><a href="../layout/fixed.html"><i class="fa fa-circle-o"></i> Fixed</a></li>
359 <li><a href="../layout/collapsed-sidebar.html"><i class="fa fa-circle-o"></i> Collapsed Sidebar</a></li>
360 </ul>
361 </li>
362 <li>
363 <a href="../widgets.html">
364 <i class="fa fa-th"></i> <span>Widgets</span>
365 <span class="pull-right-container">
366 <small class="label pull-right bg-green">new</small>
367 </span>
368 </a>
369 </li>
370 <li class="treeview">
371 <a href="#">
372 <i class="fa fa-pie-chart"></i>
373 <span>Charts</span>
374 <span class="pull-right-container">
375 <i class="fa fa-angle-left pull-right"></i>
376 </span>
377 </a>
378 <ul class="treeview-menu">
379 <li><a href="../charts/chartjs.html"><i class="fa fa-circle-o"></i> ChartJS</a></li>
380 <li><a href="../charts/morris.html"><i class="fa fa-circle-o"></i> Morris</a></li>
381 <li><a href="../charts/flot.html"><i class="fa fa-circle-o"></i> Flot</a></li>
382 <li><a href="../charts/inline.html"><i class="fa fa-circle-o"></i> Inline charts</a></li>
383 </ul>
384 </li>
385 <li class="treeview active">
386 <a href="#">
387 <i class="fa fa-laptop"></i>
388 <span>UI Elements</span>
389 <span class="pull-right-container">
390 <i class="fa fa-angle-left pull-right"></i>
391 </span>
392 </a>
393 <ul class="treeview-menu">
394 <li><a href="general.html"><i class="fa fa-circle-o"></i> General</a></li>
395 <li><a href="icons.html"><i class="fa fa-circle-o"></i> Icons</a></li>
396 <li><a href="buttons.html"><i class="fa fa-circle-o"></i> Buttons</a></li>
397 <li><a href="sliders.html"><i class="fa fa-circle-o"></i> Sliders</a></li>
398 <li><a href="timeline.html"><i class="fa fa-circle-o"></i> Timeline</a></li>
399 <li class="active"><a href="modals.html"><i class="fa fa-circle-o"></i> Modals</a></li>
400 </ul>
401 </li>
402 <li class="treeview">
403 <a href="#">
404 <i class="fa fa-edit"></i> <span>Forms</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><a href="../forms/general.html"><i class="fa fa-circle-o"></i> General Elements</a></li>
411 <li><a href="../forms/advanced.html"><i class="fa fa-circle-o"></i> Advanced Elements</a></li>
412 <li><a href="../forms/editors.html"><i class="fa fa-circle-o"></i> Editors</a></li>
413 </ul>
414 </li>
415 <li class="treeview">
416 <a href="#">
417 <i class="fa fa-table"></i> <span>Tables</span>
418 <span class="pull-right-container">
419 <i class="fa fa-angle-left pull-right"></i>
420 </span>
421 </a>
422 <ul class="treeview-menu">
423 <li><a href="../tables/simple.html"><i class="fa fa-circle-o"></i> Simple tables</a></li>
424 <li><a href="../tables/data.html"><i class="fa fa-circle-o"></i> Data tables</a></li>
425 </ul>
426 </li>
427 <li>
428 <a href="../calendar.html">
429 <i class="fa fa-calendar"></i> <span>Calendar</span>
430 <span class="pull-right-container">
431 <small class="label pull-right bg-red">3</small>
432 <small class="label pull-right bg-blue">17</small>
433 </span>
434 </a>
435 </li>
436 <li>
437 <a href="../mailbox/mailbox.html">
438 <i class="fa fa-envelope"></i> <span>Mailbox</span>
439 <span class="pull-right-container">
440 <small class="label pull-right bg-yellow">12</small>
441 <small class="label pull-right bg-green">16</small>
442 <small class="label pull-right bg-red">5</small>
443 </span>
444 </a>
445 </li>
446 <li class="treeview">
447 <a href="#">
448 <i class="fa fa-folder"></i> <span>Examples</span>
449 <span class="pull-right-container">
450 <i class="fa fa-angle-left pull-right"></i>
451 </span>
452 </a>
453 <ul class="treeview-menu">
454 <li><a href="../examples/invoice.html"><i class="fa fa-circle-o"></i> Invoice</a></li>
455 <li><a href="../examples/profile.html"><i class="fa fa-circle-o"></i> Profile</a></li>
456 <li><a href="../examples/login.html"><i class="fa fa-circle-o"></i> Login</a></li>
457 <li><a href="../examples/register.html"><i class="fa fa-circle-o"></i> Register</a></li>
458 <li><a href="../examples/lockscreen.html"><i class="fa fa-circle-o"></i> Lockscreen</a></li>
459 <li><a href="../examples/404.html"><i class="fa fa-circle-o"></i> 404 Error</a></li>
460 <li><a href="../examples/500.html"><i class="fa fa-circle-o"></i> 500 Error</a></li>
461 <li><a href="../examples/blank.html"><i class="fa fa-circle-o"></i> Blank Page</a></li>
462 <li><a href="../examples/pace.html"><i class="fa fa-circle-o"></i> Pace Page</a></li>
463 </ul>
464 </li>
465 <li class="treeview">
466 <a href="#">
467 <i class="fa fa-share"></i> <span>Multilevel</span>
468 <span class="pull-right-container">
469 <i class="fa fa-angle-left pull-right"></i>
470 </span>
471 </a>
472 <ul class="treeview-menu">
473 <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
474 <li>
475 <a href="#"><i class="fa fa-circle-o"></i> Level One
476 <span class="pull-right-container">
477 <i class="fa fa-angle-left pull-right"></i>
478 </span>
479 </a>
480 <ul class="treeview-menu">
481 <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
482 <li>
483 <a href="#"><i class="fa fa-circle-o"></i> Level Two
484 <span class="pull-right-container">
485 <i class="fa fa-angle-left pull-right"></i>
486 </span>
487 </a>
488 <ul class="treeview-menu">
489 <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
490 <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
491 </ul>
492 </li>
493 </ul>
494 </li>
495 <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
496 </ul>
497 </li>
498 <li><a href="../../documentation/index.html"><i class="fa fa-book"></i> <span>Documentation</span></a></li>
499 <li class="header">LABELS</li>
500 <li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
501 <li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
502 <li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
503 </ul>
504 </section>
505 <!-- /.sidebar -->
506 </aside>
507
508 <!-- Content Wrapper. Contains page content -->
509 <div class="content-wrapper">
510 <!-- Content Header (Page header) -->
511 <section class="content-header">
512 <h1>
513 Modals
514 <small>new</small>
515 </h1>
516 <ol class="breadcrumb">
517 <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
518 <li><a href="#">UI</a></li>
519 <li class="active">Modals</li>
520 </ol>
521 </section>
522
523 <!-- Main content -->
524 <section class="content">
525 <div class="callout callout-info">
526 <h4>Reminder!</h4>
527 Instructions for how to use modals are available on the
528 <a href="http://getbootstrap.com/javascript/#modals">Bootstrap documentation</a>
529 </div>
530
531 <div class="example-modal">
532 <div class="modal">
533 <div class="modal-dialog">
534 <div class="modal-content">
535 <div class="modal-header">
536 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
537 <span aria-hidden="true">&times;</span></button>
538 <h4 class="modal-title">Default Modal</h4>
539 </div>
540 <div class="modal-body">
541 <p>One fine body&hellip;</p>
542 </div>
543 <div class="modal-footer">
544 <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Close</button>
545 <button type="button" class="btn btn-primary">Save changes</button>
546 </div>
547 </div>
548 <!-- /.modal-content -->
549 </div>
550 <!-- /.modal-dialog -->
551 </div>
552 <!-- /.modal -->
553 </div>
554 <!-- /.example-modal -->
555
556 <div class="example-modal">
557 <div class="modal modal-primary">
558 <div class="modal-dialog">
559 <div class="modal-content">
560 <div class="modal-header">
561 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
562 <span aria-hidden="true">&times;</span></button>
563 <h4 class="modal-title">Primary Modal</h4>
564 </div>
565 <div class="modal-body">
566 <p>One fine body&hellip;</p>
567 </div>
568 <div class="modal-footer">
569 <button type="button" class="btn btn-outline pull-left" data-dismiss="modal">Close</button>
570 <button type="button" class="btn btn-outline">Save changes</button>
571 </div>
572 </div>
573 <!-- /.modal-content -->
574 </div>
575 <!-- /.modal-dialog -->
576 </div>
577 <!-- /.modal -->
578 </div>
579 <!-- /.example-modal -->
580
581 <div class="example-modal">
582 <div class="modal modal-info">
583 <div class="modal-dialog">
584 <div class="modal-content">
585 <div class="modal-header">
586 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
587 <span aria-hidden="true">&times;</span></button>
588 <h4 class="modal-title">Info Modal</h4>
589 </div>
590 <div class="modal-body">
591 <p>One fine body&hellip;</p>
592 </div>
593 <div class="modal-footer">
594 <button type="button" class="btn btn-outline pull-left" data-dismiss="modal">Close</button>
595 <button type="button" class="btn btn-outline">Save changes</button>
596 </div>
597 </div>
598 <!-- /.modal-content -->
599 </div>
600 <!-- /.modal-dialog -->
601 </div>
602 <!-- /.modal -->
603 </div>
604 <!-- /.example-modal -->
605
606 <div class="example-modal">
607 <div class="modal modal-warning">
608 <div class="modal-dialog">
609 <div class="modal-content">
610 <div class="modal-header">
611 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
612 <span aria-hidden="true">&times;</span></button>
613 <h4 class="modal-title">Warning Modal</h4>
614 </div>
615 <div class="modal-body">
616 <p>One fine body&hellip;</p>
617 </div>
618 <div class="modal-footer">
619 <button type="button" class="btn btn-outline pull-left" data-dismiss="modal">Close</button>
620 <button type="button" class="btn btn-outline">Save changes</button>
621 </div>
622 </div>
623 <!-- /.modal-content -->
624 </div>
625 <!-- /.modal-dialog -->
626 </div>
627 <!-- /.modal -->
628 </div>
629 <!-- /.example-modal -->
630
631 <div class="example-modal">
632 <div class="modal modal-success">
633 <div class="modal-dialog">
634 <div class="modal-content">
635 <div class="modal-header">
636 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
637 <span aria-hidden="true">&times;</span></button>
638 <h4 class="modal-title">Success Modal</h4>
639 </div>
640 <div class="modal-body">
641 <p>One fine body&hellip;</p>
642 </div>
643 <div class="modal-footer">
644 <button type="button" class="btn btn-outline pull-left" data-dismiss="modal">Close</button>
645 <button type="button" class="btn btn-outline">Save changes</button>
646 </div>
647 </div>
648 <!-- /.modal-content -->
649 </div>
650 <!-- /.modal-dialog -->
651 </div>
652 <!-- /.modal -->
653 </div>
654 <!-- /.example-modal -->
655
656 <div class="example-modal">
657 <div class="modal modal-danger">
658 <div class="modal-dialog">
659 <div class="modal-content">
660 <div class="modal-header">
661 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
662 <span aria-hidden="true">&times;</span></button>
663 <h4 class="modal-title">Danger Modal</h4>
664 </div>
665 <div class="modal-body">
666 <p>One fine body&hellip;</p>
667 </div>
668 <div class="modal-footer">
669 <button type="button" class="btn btn-outline pull-left" data-dismiss="modal">Close</button>
670 <button type="button" class="btn btn-outline">Save changes</button>
671 </div>
672 </div>
673 <!-- /.modal-content -->
674 </div>
675 <!-- /.modal-dialog -->
676 </div>
677 <!-- /.modal -->
678 </div>
679 <!-- /.example-modal -->
680 </section>
681 <!-- /.content -->
682 </div>
683 <!-- /.content-wrapper -->
684
685 <footer class="main-footer">
686 <div class="pull-right hidden-xs">
687 <b>Version</b> 2.3.7
688 </div>
689 <strong>Copyright &copy; 2014-2016 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights
690 reserved.
691 </footer>
692
693 <!-- Control Sidebar -->
694 <aside class="control-sidebar control-sidebar-dark">
695 <!-- Create the tabs -->
696 <ul class="nav nav-tabs nav-justified control-sidebar-tabs">
697 <li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
698
699 <li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
700 </ul>
701 <!-- Tab panes -->
702 <div class="tab-content">
703 <!-- Home tab content -->
704 <div class="tab-pane" id="control-sidebar-home-tab">
705 <h3 class="control-sidebar-heading">Recent Activity</h3>
706 <ul class="control-sidebar-menu">
707 <li>
708 <a href="javascript:void(0)">
709 <i class="menu-icon fa fa-birthday-cake bg-red"></i>
710
711 <div class="menu-info">
712 <h4 class="control-sidebar-subheading">Langdon's Birthday</h4>
713
714 <p>Will be 23 on April 24th</p>
715 </div>
716 </a>
717 </li>
718 <li>
719 <a href="javascript:void(0)">
720 <i class="menu-icon fa fa-user bg-yellow"></i>
721
722 <div class="menu-info">
723 <h4 class="control-sidebar-subheading">Frodo Updated His Profile</h4>
724
725 <p>New phone +1(800)555-1234</p>
726 </div>
727 </a>
728 </li>
729 <li>
730 <a href="javascript:void(0)">
731 <i class="menu-icon fa fa-envelope-o bg-light-blue"></i>
732
733 <div class="menu-info">
734 <h4 class="control-sidebar-subheading">Nora Joined Mailing List</h4>
735
736 <p>nora@example.com</p>
737 </div>
738 </a>
739 </li>
740 <li>
741 <a href="javascript:void(0)">
742 <i class="menu-icon fa fa-file-code-o bg-green"></i>
743
744 <div class="menu-info">
745 <h4 class="control-sidebar-subheading">Cron Job 254 Executed</h4>
746
747 <p>Execution time 5 seconds</p>
748 </div>
749 </a>
750 </li>
751 </ul>
752 <!-- /.control-sidebar-menu -->
753
754 <h3 class="control-sidebar-heading">Tasks Progress</h3>
755 <ul class="control-sidebar-menu">
756 <li>
757 <a href="javascript:void(0)">
758 <h4 class="control-sidebar-subheading">
759 Custom Template Design
760 <span class="label label-danger pull-right">70%</span>
761 </h4>
762
763 <div class="progress progress-xxs">
764 <div class="progress-bar progress-bar-danger" style="width: 70%"></div>
765 </div>
766 </a>
767 </li>
768 <li>
769 <a href="javascript:void(0)">
770 <h4 class="control-sidebar-subheading">
771 Update Resume
772 <span class="label label-success pull-right">95%</span>
773 </h4>
774
775 <div class="progress progress-xxs">
776 <div class="progress-bar progress-bar-success" style="width: 95%"></div>
777 </div>
778 </a>
779 </li>
780 <li>
781 <a href="javascript:void(0)">
782 <h4 class="control-sidebar-subheading">
783 Laravel Integration
784 <span class="label label-warning pull-right">50%</span>
785 </h4>
786
787 <div class="progress progress-xxs">
788 <div class="progress-bar progress-bar-warning" style="width: 50%"></div>
789 </div>
790 </a>
791 </li>
792 <li>
793 <a href="javascript:void(0)">
794 <h4 class="control-sidebar-subheading">
795 Back End Framework
796 <span class="label label-primary pull-right">68%</span>
797 </h4>
798
799 <div class="progress progress-xxs">
800 <div class="progress-bar progress-bar-primary" style="width: 68%"></div>
801 </div>
802 </a>
803 </li>
804 </ul>
805 <!-- /.control-sidebar-menu -->
806
807 </div>
808 <!-- /.tab-pane -->
809 <!-- Stats tab content -->
810 <div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div>
811 <!-- /.tab-pane -->
812 <!-- Settings tab content -->
813 <div class="tab-pane" id="control-sidebar-settings-tab">
814 <form method="post">
815 <h3 class="control-sidebar-heading">General Settings</h3>
816
817 <div class="form-group">
818 <label class="control-sidebar-subheading">
819 Report panel usage
820 <input type="checkbox" class="pull-right" checked>
821 </label>
822
823 <p>
824 Some information about this general settings option
825 </p>
826 </div>
827 <!-- /.form-group -->
828
829 <div class="form-group">
830 <label class="control-sidebar-subheading">
831 Allow mail redirect
832 <input type="checkbox" class="pull-right" checked>
833 </label>
834
835 <p>
836 Other sets of options are available
837 </p>
838 </div>
839 <!-- /.form-group -->
840
841 <div class="form-group">
842 <label class="control-sidebar-subheading">
843 Expose author name in posts
844 <input type="checkbox" class="pull-right" checked>
845 </label>
846
847 <p>
848 Allow the user to show his name in blog posts
849 </p>
850 </div>
851 <!-- /.form-group -->
852
853 <h3 class="control-sidebar-heading">Chat Settings</h3>
854
855 <div class="form-group">
856 <label class="control-sidebar-subheading">
857 Show me as online
858 <input type="checkbox" class="pull-right" checked>
859 </label>
860 </div>
861 <!-- /.form-group -->
862
863 <div class="form-group">
864 <label class="control-sidebar-subheading">
865 Turn off notifications
866 <input type="checkbox" class="pull-right">
867 </label>
868 </div>
869 <!-- /.form-group -->
870
871 <div class="form-group">
872 <label class="control-sidebar-subheading">
873 Delete chat history
874 <a href="javascript:void(0)" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
875 </label>
876 </div>
877 <!-- /.form-group -->
878 </form>
879 </div>
880 <!-- /.tab-pane -->
881 </div>
882 </aside>
883 <!-- /.control-sidebar -->
884 <!-- Add the sidebar's background. This div must be placed
885 immediately after the control sidebar -->
886 <div class="control-sidebar-bg"></div>
887</div>
888<!-- ./wrapper -->
889
890<!-- jQuery 2.2.3 -->
891<script src="../../plugins/jQuery/jquery-2.2.3.min.js"></script>
892<!-- Bootstrap 3.3.6 -->
893<script src="../../bootstrap/js/bootstrap.min.js"></script>
894<!-- FastClick -->
895<script src="../../plugins/fastclick/fastclick.js"></script>
896<!-- AdminLTE App -->
897<script src="../../dist/js/app.min.js"></script>
898<!-- AdminLTE for demo purposes -->
899<script src="../../dist/js/demo.js"></script>
900</body>
901</html>
Ceph