525 lines
28 KiB
HTML
525 lines
28 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Bootsrtap Free Admin Template - SIMINTA | Admin Dashboad Template</title>
|
|
<!-- Core CSS - Include with every page -->
|
|
<link href="assets/plugins/bootstrap/bootstrap.css" rel="stylesheet" />
|
|
<link href="assets/font-awesome/css/font-awesome.css" rel="stylesheet" />
|
|
<link href="assets/plugins/pace/pace-theme-big-counter.css" rel="stylesheet" />
|
|
<link href="assets/css/style.css" rel="stylesheet" />
|
|
<link href="assets/css/main-style.css" rel="stylesheet" />
|
|
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<!-- wrapper -->
|
|
<div id="wrapper">
|
|
<!-- navbar top -->
|
|
<nav class="navbar navbar-default navbar-fixed-top" role="navigation" id="navbar">
|
|
<!-- navbar-header -->
|
|
<div class="navbar-header">
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".sidebar-collapse">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
<a class="navbar-brand" href="index.html">
|
|
<img src="assets/img/logo.png" alt="" />
|
|
</a>
|
|
</div>
|
|
<!-- end navbar-header -->
|
|
<!-- navbar-top-links -->
|
|
<ul class="nav navbar-top-links navbar-right">
|
|
<!-- main dropdown -->
|
|
<li class="dropdown">
|
|
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
|
|
<span class="top-label label label-danger">3</span><i class="fa fa-envelope fa-3x"></i>
|
|
</a>
|
|
<!-- dropdown-messages -->
|
|
<ul class="dropdown-menu dropdown-messages">
|
|
<li>
|
|
<a href="#">
|
|
<div>
|
|
<strong><span class=" label label-danger">Andrew Smith</span></strong>
|
|
<span class="pull-right text-muted">
|
|
<em>Yesterday</em>
|
|
</span>
|
|
</div>
|
|
<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eleifend...</div>
|
|
</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a href="#">
|
|
<div>
|
|
<strong><span class=" label label-info">Jonney Depp</span></strong>
|
|
<span class="pull-right text-muted">
|
|
<em>Yesterday</em>
|
|
</span>
|
|
</div>
|
|
<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eleifend...</div>
|
|
</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a href="#">
|
|
<div>
|
|
<strong><span class=" label label-success">Jonney Depp</span></strong>
|
|
<span class="pull-right text-muted">
|
|
<em>Yesterday</em>
|
|
</span>
|
|
</div>
|
|
<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eleifend...</div>
|
|
</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a class="text-center" href="#">
|
|
<strong>Read All Messages</strong>
|
|
<i class="fa fa-angle-right"></i>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<!-- end dropdown-messages -->
|
|
</li>
|
|
|
|
<li class="dropdown">
|
|
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
|
|
<span class="top-label label label-success">4</span> <i class="fa fa-tasks fa-3x"></i>
|
|
</a>
|
|
<!-- dropdown tasks -->
|
|
<ul class="dropdown-menu dropdown-tasks">
|
|
<li>
|
|
<a href="#">
|
|
<div>
|
|
<p>
|
|
<strong>Task 1</strong>
|
|
<span class="pull-right text-muted">40% Complete</span>
|
|
</p>
|
|
<div class="progress progress-striped active">
|
|
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
|
|
<span class="sr-only">40% Complete (success)</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a href="#">
|
|
<div>
|
|
<p>
|
|
<strong>Task 2</strong>
|
|
<span class="pull-right text-muted">20% Complete</span>
|
|
</p>
|
|
<div class="progress progress-striped active">
|
|
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%">
|
|
<span class="sr-only">20% Complete</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a href="#">
|
|
<div>
|
|
<p>
|
|
<strong>Task 3</strong>
|
|
<span class="pull-right text-muted">60% Complete</span>
|
|
</p>
|
|
<div class="progress progress-striped active">
|
|
<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">
|
|
<span class="sr-only">60% Complete (warning)</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a href="#">
|
|
<div>
|
|
<p>
|
|
<strong>Task 4</strong>
|
|
<span class="pull-right text-muted">80% Complete</span>
|
|
</p>
|
|
<div class="progress progress-striped active">
|
|
<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%">
|
|
<span class="sr-only">80% Complete (danger)</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a class="text-center" href="#">
|
|
<strong>See All Tasks</strong>
|
|
<i class="fa fa-angle-right"></i>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<!-- end dropdown-tasks -->
|
|
</li>
|
|
|
|
<li class="dropdown">
|
|
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
|
|
<span class="top-label label label-warning">5</span> <i class="fa fa-bell fa-3x"></i>
|
|
</a>
|
|
<!-- dropdown alerts-->
|
|
<ul class="dropdown-menu dropdown-alerts">
|
|
<li>
|
|
<a href="#">
|
|
<div>
|
|
<i class="fa fa-comment fa-fw"></i>New Comment
|
|
<span class="pull-right text-muted small">4 minutes ago</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a href="#">
|
|
<div>
|
|
<i class="fa fa-twitter fa-fw"></i>3 New Followers
|
|
<span class="pull-right text-muted small">12 minutes ago</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a href="#">
|
|
<div>
|
|
<i class="fa fa-envelope fa-fw"></i>Message Sent
|
|
<span class="pull-right text-muted small">4 minutes ago</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a href="#">
|
|
<div>
|
|
<i class="fa fa-tasks fa-fw"></i>New Task
|
|
<span class="pull-right text-muted small">4 minutes ago</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a href="#">
|
|
<div>
|
|
<i class="fa fa-upload fa-fw"></i>Server Rebooted
|
|
<span class="pull-right text-muted small">4 minutes ago</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li>
|
|
<a class="text-center" href="#">
|
|
<strong>See All Alerts</strong>
|
|
<i class="fa fa-angle-right"></i>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<!-- end dropdown-alerts -->
|
|
</li>
|
|
|
|
<li class="dropdown">
|
|
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
|
|
<i class="fa fa-user fa-3x"></i>
|
|
</a>
|
|
<!-- dropdown user-->
|
|
<ul class="dropdown-menu dropdown-user">
|
|
<li><a href="#"><i class="fa fa-user fa-fw"></i>User Profile</a>
|
|
</li>
|
|
<li><a href="#"><i class="fa fa-gear fa-fw"></i>Settings</a>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li><a href="login.html"><i class="fa fa-sign-out fa-fw"></i>Logout</a>
|
|
</li>
|
|
</ul>
|
|
<!-- end dropdown-user -->
|
|
</li>
|
|
<!-- end main dropdown -->
|
|
</ul>
|
|
<!-- end navbar-top-links -->
|
|
|
|
</nav>
|
|
<!-- end navbar top -->
|
|
|
|
<!-- navbar side -->
|
|
<nav class="navbar-default navbar-static-side" role="navigation">
|
|
<!-- sidebar-collapse -->
|
|
<div class="sidebar-collapse">
|
|
<!-- side-menu -->
|
|
<ul class="nav" id="side-menu">
|
|
<li>
|
|
<!-- user image section-->
|
|
<div class="user-section">
|
|
<div class="user-section-inner">
|
|
<img src="assets/img/user.jpg" alt="">
|
|
</div>
|
|
<div class="user-info">
|
|
<div>Jonny <strong>Deen</strong></div>
|
|
<div class="user-text-online">
|
|
<span class="user-circle-online btn btn-success btn-circle "></span> Online
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end user image section-->
|
|
</li>
|
|
<li class="sidebar-search">
|
|
<!-- search section-->
|
|
<div class="input-group custom-search-form">
|
|
<input type="text" class="form-control" placeholder="Search...">
|
|
<span class="input-group-btn">
|
|
<button class="btn btn-default" type="button">
|
|
<i class="fa fa-search"></i>
|
|
</button>
|
|
</span>
|
|
</div>
|
|
<!--end search section-->
|
|
</li>
|
|
<li class="">
|
|
<a href="index.html"><i class="fa fa-dashboard fa-fw"></i>Dashboard</a>
|
|
</li>
|
|
<li>
|
|
<a href="#"><i class="fa fa-bar-chart-o fa-fw"></i>Charts<span class="fa arrow"></span></a>
|
|
<ul class="nav nav-second-level">
|
|
<li>
|
|
<a href="flot.html">Flot Charts</a>
|
|
</li>
|
|
<li>
|
|
<a href="morris.html">Morris Charts</a>
|
|
</li>
|
|
</ul>
|
|
<!-- second-level-items -->
|
|
</li>
|
|
<li>
|
|
<a href="timeline.html"><i class="fa fa-flask fa-fw"></i>Timeline</a>
|
|
</li>
|
|
<li>
|
|
<a href="tables.html"><i class="fa fa-table fa-fw"></i>Tables</a>
|
|
</li>
|
|
<li>
|
|
<a href="forms.html"><i class="fa fa-edit fa-fw"></i>Forms</a>
|
|
</li>
|
|
<li class="active">
|
|
<a href="#"><i class="fa fa-wrench fa-fw"></i>UI Elements<span class="fa arrow"></span></a>
|
|
<ul class="nav nav-second-level">
|
|
<li>
|
|
<a href="panels-wells.html">Panels and Wells</a>
|
|
</li>
|
|
<li>
|
|
<a href="buttons.html">Buttons</a>
|
|
</li>
|
|
<li class="selected">
|
|
<a href="notifications.html">Notifications</a>
|
|
</li>
|
|
<li>
|
|
<a href="typography.html">Typography</a>
|
|
</li>
|
|
<li>
|
|
<a href="grid.html">Grid</a>
|
|
</li>
|
|
</ul>
|
|
<!-- second-level-items -->
|
|
</li>
|
|
<li>
|
|
<a href="#"><i class="fa fa-sitemap fa-fw"></i>Multi-Level Dropdown<span class="fa arrow"></span></a>
|
|
<ul class="nav nav-second-level">
|
|
<li>
|
|
<a href="#">Second Level Item</a>
|
|
</li>
|
|
<li>
|
|
<a href="#">Second Level Item</a>
|
|
</li>
|
|
<li>
|
|
<a href="#">Third Level <span class="fa arrow"></span></a>
|
|
<ul class="nav nav-third-level">
|
|
<li>
|
|
<a href="#">Third Level Item</a>
|
|
</li>
|
|
<li>
|
|
<a href="#">Third Level Item</a>
|
|
</li>
|
|
<li>
|
|
<a href="#">Third Level Item</a>
|
|
</li>
|
|
<li>
|
|
<a href="#">Third Level Item</a>
|
|
</li>
|
|
</ul>
|
|
<!-- third-level-items -->
|
|
</li>
|
|
</ul>
|
|
<!-- second-level-items -->
|
|
</li>
|
|
<li>
|
|
<a href="#"><i class="fa fa-files-o fa-fw"></i>Sample Pages<span class="fa arrow"></span></a>
|
|
<ul class="nav nav-second-level">
|
|
<li>
|
|
<a href="blank.html">Blank Page</a>
|
|
</li>
|
|
<li>
|
|
<a href="login.html">Login Page</a>
|
|
</li>
|
|
</ul>
|
|
<!-- second-level-items -->
|
|
</li>
|
|
</ul>
|
|
<!-- end side-menu -->
|
|
</div>
|
|
<!-- end sidebar-collapse -->
|
|
</nav>
|
|
<!-- end navbar side -->
|
|
<!-- page-wrapper -->
|
|
<div id="page-wrapper">
|
|
<div class="row">
|
|
<!-- page header -->
|
|
<div class="col-lg-12">
|
|
<h1 class="page-header">Notifications</h1>
|
|
</div>
|
|
<!--end page header -->
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-lg-6">
|
|
<!-- Alert Styles -->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
Alert Styles
|
|
</div>
|
|
<div class="panel-body">
|
|
<div class="alert alert-success">
|
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit. <a href="#" class="alert-link">Alert Link</a>.
|
|
</div>
|
|
<div class="alert alert-info">
|
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit. <a href="#" class="alert-link">Alert Link</a>.
|
|
</div>
|
|
<div class="alert alert-warning">
|
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit. <a href="#" class="alert-link">Alert Link</a>.
|
|
</div>
|
|
<div class="alert alert-danger">
|
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit. <a href="#" class="alert-link">Alert Link</a>.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Alert Styles -->
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<!-- Dismissable Alerts -->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
Dismissable Alerts
|
|
</div>
|
|
<div class="panel-body">
|
|
<div class="alert alert-success alert-dismissable">
|
|
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
|
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit. <a href="#" class="alert-link">Alert Link</a>.
|
|
</div>
|
|
<div class="alert alert-info alert-dismissable">
|
|
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
|
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit. <a href="#" class="alert-link">Alert Link</a>.
|
|
</div>
|
|
<div class="alert alert-warning alert-dismissable">
|
|
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
|
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit. <a href="#" class="alert-link">Alert Link</a>.
|
|
</div>
|
|
<div class="alert alert-danger alert-dismissable">
|
|
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
|
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit. <a href="#" class="alert-link">Alert Link</a>.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Dismissable Alerts -->
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-lg-6">
|
|
<!-- Modals-->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
Modals
|
|
</div>
|
|
<div class="panel-body">
|
|
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
|
|
Launch Demo Modal
|
|
</button>
|
|
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
|
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
|
<button type="button" class="btn btn-primary">Save changes</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Modals-->
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<!-- Tooltips and Popovers-->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
Tooltips and Popovers
|
|
</div>
|
|
<div class="panel-body">
|
|
<h4>Tooltip Demo</h4>
|
|
<div class="tooltip-demo">
|
|
<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>
|
|
<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</button>
|
|
<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>
|
|
<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</button>
|
|
</div>
|
|
<br>
|
|
<h4>Clickable Popover Demo</h4>
|
|
<div class="tooltip-demo">
|
|
<button type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="left" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
|
|
Popover on left
|
|
</button>
|
|
<button type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
|
|
Popover on top
|
|
</button>
|
|
<button type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="bottom" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
|
|
Popover on bottom
|
|
</button>
|
|
<button type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
|
|
Popover on right
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--End Tooltips and Popovers-->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- end page-wrapper -->
|
|
|
|
</div>
|
|
<!-- end wrapper -->
|
|
|
|
<!-- Core Scripts - Include with every page -->
|
|
<script src="assets/plugins/jquery-1.10.2.js"></script>
|
|
<script src="assets/plugins/bootstrap/bootstrap.min.js"></script>
|
|
<script src="assets/plugins/metisMenu/jquery.metisMenu.js"></script>
|
|
<script src="assets/plugins/pace/pace.js"></script>
|
|
<script src="assets/scripts/siminta.js"></script>
|
|
|
|
</body>
|
|
|
|
</html>
|