<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>LMS | Home</title> <!--styles links--> <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script> <script src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js"></script> <link rel="stylesheet" href="https://cdn.datatables.net/1.10.22/css/jquery.dataTables.min.css"> <link rel="stylesheet" href="../assets/css/bootstrap.min.css"> <link rel="stylesheet" href="../assets/css/font-family.css"> <link rel="stylesheet" href="../assets/css/all.css"> <link rel="stylesheet" href="../assets/css/style.css"> <link rel="stylesheet" href="../assets/css/responsive.css"> <link rel="stylesheet" href="../admin/css/template_style.css"> <link rel="stylesheet" href="../assets/owl-carousel/css/owl.carousel.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.1/css/bootstrap-select.css" /> </head> <body> <div class="wraper"> <div class="container-fluid"> <div class="row"> <!--left side content--> <div class="col-lg-2 col-md-2 col-sm-12 my-tabs-items"> <div class="list_of-items-tab admin_sidenav"> <div class="logo-set"><a href="#"><img src="../assets/images/logo.png" class="logo" alt="" ></a></div> <ul> <li class="active"><a class="active" href="#">Classroom</a></li> <li><a href="" target="_blank">Teachers</a></li> <li><a href="" target="_blank">Students</a></li> <li><a href="#">Programme</a></li> <li><a href="#">Subjects</a></li> <li><a href="#">Notifications</a></li> <li><a href="#">Settings</a></li> </ul> </div> </div> <!--End left side content--> <!--right-top side--> <div class="col-lg-10 col-md-10 col-sm-12"> <div class="row"> <div class="col-lg-12 col-md-12 col-sm-12 text-right "> <div class="top-head-tlt"> <div class="notification"><i class="far fa-bell"></i></div> <div class="user-drpdown"> <div class="drp-item"> <div class="user-dp">A</div> <div class="user-name-tlt">Andrew <span><i class="fas fa-caret-down"></i></span></div> </div> <div class="drpdown-items"> <ul> <li class="active"><a href="#" class="active"><span class="ico"><i class="fas fa-user-alt"></i></span>My Profile</a></li> <li><a href="#"><span class="ico"><i class="fas fa-power-off"></i></span>Logout</a></li> </ul> </div> </div> </div> </div> </div> <!----admin template section----> <div class="admin_tempblock"> <div class="admin_tempsec"> <div class="admin_sec"> <form> <div class="subsec_sec"> <div class="subject_l"> <div class="subject_lsec"> <div class="subject_lhead">Create Course</div> <div class="subject_lformarea"> <div class="form-group"> <label for="">Course Name</label> <input type="email" class="form-control" placeholder="Name of your course"> </div> <div class="form-group assign_subject"> <label>Assign Subject</label> <select class="selectpicker" multiple data-live-search="true"> <option>Physics</option> <option>Chemistery</option> <option>Math</option> <option>Physics</option> <option>Chemistery</option> <option>Math</option> </select> </div> <div class="form-group"> <label for="">Course Description</label> <textarea class="form-control" rows="6" placeholder="Add some description of your course..."></textarea> </div> <button type="button" class="subject_addbtn">Add</button> </div> </div> </div> <div class="divider"></div> <div class="subject_r"> <div class="subject_lsec"> <div class="subject_lhead">Subject List</div> <div class=""> <table id="tbl" class="display"> <thead> <tr> <th>#</th> <th>Course</th> <th>Description</th> <th>Action</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>Physics</td> <td><div class="sub_descdetail">lorem ipsm...</div></td> <td> <div class="sub_tabbtnsec"> <div class="sub_viewbtn"><i class="fa fa-eye" aria-hidden="true"></i></div> <div class="sub_editbtn"><i class="fas fa-pencil-alt"></i></div> <div class="sub_delbtn"><i class="fa fa-trash" aria-hidden="true"></i></div> </div> </td> </tr> <tr> <td>1</td> <td>Physics</td> <td><div class="sub_descdetail">lorem ipsm...</div></td> <td> <div class="sub_tabbtnsec"> <div class="sub_viewbtn"><i class="fa fa-eye" aria-hidden="true"></i></div> <div class="sub_editbtn"><i class="fas fa-pencil-alt"></i></div> <div class="sub_delbtn"><i class="fa fa-trash" aria-hidden="true"></i></div> </div> </td> </tr> <tr> <td>1</td> <td>Physics</td> <td><div class="sub_descdetail">lorem ipsm...</div></td> <td> <div class="sub_tabbtnsec"> <div class="sub_viewbtn"><i class="fa fa-eye" aria-hidden="true"></i></div> <div class="sub_editbtn"><i class="fas fa-pencil-alt"></i></div> <div class="sub_delbtn"><i class="fa fa-trash" aria-hidden="true"></i></div> </div> </td> </tr> <tr> <td>1</td> <td>Physics</td> <td><div class="sub_descdetail">lorem ipsm...</div></td> <td> <div class="sub_tabbtnsec"> <div class="sub_viewbtn"><i class="fa fa-eye" aria-hidden="true"></i></div> <div class="sub_editbtn"><i class="fas fa-pencil-alt"></i></div> <div class="sub_delbtn"><i class="fa fa-trash" aria-hidden="true"></i></div> </div> </td> </tr> <tr> <td>1</td> <td>Physics</td> <td><div class="sub_descdetail">lorem ipsm...</div></td> <td> <div class="sub_tabbtnsec"> <div class="sub_viewbtn"><i class="fa fa-eye" aria-hidden="true"></i></div> <div class="sub_editbtn"><i class="fas fa-pencil-alt"></i></div> <div class="sub_delbtn"><i class="fa fa-trash" aria-hidden="true"></i></div> </div> </td> </tr> <tr> <td>1</td> <td>Physics</td> <td><div class="sub_descdetail">lorem ipsm...</div></td> <td> <div class="sub_tabbtnsec"> <div class="sub_viewbtn"><i class="fa fa-eye" aria-hidden="true"></i></div> <div class="sub_editbtn"><i class="fas fa-pencil-alt"></i></div> <div class="sub_delbtn"><i class="fa fa-trash" aria-hidden="true"></i></div> </div> </td> </tr> <tr> <td>1</td> <td>Physics</td> <td><div class="sub_descdetail">lorem ipsm...</div></td> <td> <div class="sub_tabbtnsec"> <div class="sub_viewbtn"><i class="fa fa-eye" aria-hidden="true"></i></div> <div class="sub_editbtn"><i class="fas fa-pencil-alt"></i></div> <div class="sub_delbtn"><i class="fa fa-trash" aria-hidden="true"></i></div> </div> </td> </tr> </tbody> </table> </div> </div> </div> </div> </form> </div> </div> </div> <!----admin template section end----> </div> <!--End right-top side--> </div> </div> </div> <!-- <script src="../assets/js/jquery-3.2.1.slim.min.js"></script> --> <script src="../assets/js/popper.min.js"></script> <script src="../assets/js/bootstrap.min.js"></script> <script defer src="../assets/js/all.js"></script> <script src="../assets/owl-carousel/js/owl.carousel.min.js"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.bundle.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.1/js/bootstrap-select.min.js"></script> <script> $(document).ready(function(){ $('.user-drpdown').click(function(){ $('.drpdown-items').toggle(); }); //table js $('#tbl').DataTable( { "lengthMenu": [[5,10, 25, 50, -1], [5,10, 25, 50, "All"]] } ); //table js end //multiple select js start $('select').selectpicker(); //multiple select js end }); </script> </body> </html>