File manager

File manager - Edit - /home/cipherteam/htdocs/cipherteam.in/yogi/colors/ui-bootstrap.html

Back
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- Tell the browser to be responsive to screen width --> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content=""> <meta name="author" content=""> <!-- Favicon icon --> <link rel="icon" type="image/png" sizes="16x16" href="../assets/images/favicon.png"> <title>Elite Admin Template - The Ultimate Multipurpose admin template</title> <!-- Custom CSS --> <link href="dist/css/style.min.css" rel="stylesheet"> <!-- page css --> <link href="dist/css/pages/ui-bootstrap-page.css" rel="stylesheet"> <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> <![endif]--> </head> <body class="skin-red-dark fixed-layout"> <!-- ============================================================== --> <!-- Preloader - style you can find in spinners.css --> <!-- ============================================================== --> <div class="preloader"> <div class="loader"> <div class="loader__figure"></div> <p class="loader__label">Elite admin</p> </div> </div> <!-- ============================================================== --> <!-- Main wrapper - style you can find in pages.scss --> <!-- ============================================================== --> <div id="main-wrapper"> <!-- ============================================================== --> <!-- Topbar header - style you can find in pages.scss --> <!-- ============================================================== --> <header class="topbar"> <nav class="navbar top-navbar navbar-expand-md navbar-dark"> <!-- ============================================================== --> <!-- Logo --> <!-- ============================================================== --> <div class="navbar-header"> <a class="navbar-brand" href="index.html"> <!-- Logo icon --><b> <!--You can put here icon as well // <i class="wi wi-sunset"></i> //--> <!-- Dark Logo icon --> <img src="../assets/images/logo-icon.png" alt="homepage" class="dark-logo" /> <!-- Light Logo icon --> <img src="../assets/images/logo-light-icon.png" alt="homepage" class="light-logo" /> </b> <!--End Logo icon --> <!-- Logo text --><span> <!-- dark Logo text --> <img src="../assets/images/logo-text.png" alt="homepage" class="dark-logo" /> <!-- Light Logo text --> <img src="../assets/images/logo-light-text.png" class="light-logo" alt="homepage" /></span> </a> </div> <!-- ============================================================== --> <!-- End Logo --> <!-- ============================================================== --> <div class="navbar-collapse"> <!-- ============================================================== --> <!-- toggle and nav items --> <!-- ============================================================== --> <ul class="navbar-nav mr-auto"> <!-- This is --> <li class="nav-item"> <a class="nav-link nav-toggler d-block d-md-none waves-effect waves-dark" href="javascript:void(0)"><i class="ti-menu"></i></a> </li> <li class="nav-item"> <a class="nav-link sidebartoggler d-none d-lg-block d-md-block waves-effect waves-dark" href="javascript:void(0)"><i class="icon-menu"></i></a> </li> <!-- ============================================================== --> <!-- Search --> <!-- ============================================================== --> <li class="nav-item"> <form class="app-search d-none d-md-block d-lg-block"> <input type="text" class="form-control" placeholder="Search & enter"> </form> </li> </ul> <!-- ============================================================== --> <!-- User profile and search --> <!-- ============================================================== --> <ul class="navbar-nav my-lg-0"> <!-- ============================================================== --> <!-- Comment --> <!-- ============================================================== --> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle waves-effect waves-dark" href="" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="ti-email"></i> <div class="notify"> <span class="heartbit"></span> <span class="point"></span> </div> </a> <div class="dropdown-menu dropdown-menu-right mailbox animated bounceInDown"> <ul> <li> <div class="drop-title">Notifications</div> </li> <li> <div class="message-center"> <!-- Message --> <a href="javascript:void(0)"> <div class="btn btn-danger btn-circle"><i class="fa fa-link"></i></div> <div class="mail-contnet"> <h5>Luanch Admin</h5> <span class="mail-desc">Just see the my new admin!</span> <span class="time">9:30 AM</span> </div> </a> <!-- Message --> <a href="javascript:void(0)"> <div class="btn btn-success btn-circle"><i class="ti-calendar"></i></div> <div class="mail-contnet"> <h5>Event today</h5> <span class="mail-desc">Just a reminder that you have event</span> <span class="time">9:10 AM</span> </div> </a> <!-- Message --> <a href="javascript:void(0)"> <div class="btn btn-info btn-circle"><i class="ti-settings"></i></div> <div class="mail-contnet"> <h5>Settings</h5> <span class="mail-desc">You can customize this template as you want</span> <span class="time">9:08 AM</span> </div> </a> <!-- Message --> <a href="javascript:void(0)"> <div class="btn btn-primary btn-circle"><i class="ti-user"></i></div> <div class="mail-contnet"> <h5>Pavan kumar</h5> <span class="mail-desc">Just see the my admin!</span> <span class="time">9:02 AM</span> </div> </a> </div> </li> <li> <a class="nav-link text-center link" href="javascript:void(0);"> <strong>Check all notifications</strong> <i class="fa fa-angle-right"></i> </a> </li> </ul> </div> </li> <!-- ============================================================== --> <!-- End Comment --> <!-- ============================================================== --> <!-- ============================================================== --> <!-- Messages --> <!-- ============================================================== --> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle waves-effect waves-dark" href="" id="2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="icon-note"></i> <div class="notify"> <span class="heartbit"></span> <span class="point"></span> </div> </a> <div class="dropdown-menu mailbox dropdown-menu-right animated bounceInDown" aria-labelledby="2"> <ul> <li> <div class="drop-title">You have 4 new messages</div> </li> <li> <div class="message-center"> <!-- Message --> <a href="javascript:void(0)"> <div class="user-img"> <img src="../assets/images/users/1.jpg" alt="user" class="img-circle"> <span class="profile-status online pull-right"></span> </div> <div class="mail-contnet"> <h5>Pavan kumar</h5> <span class="mail-desc">Just see the my admin!</span> <span class="time">9:30 AM</span> </div> </a> <!-- Message --> <a href="javascript:void(0)"> <div class="user-img"> <img src="../assets/images/users/2.jpg" alt="user" class="img-circle"> <span class="profile-status busy pull-right"></span> </div> <div class="mail-contnet"> <h5>Sonu Nigam</h5> <span class="mail-desc">I've sung a song! See you at</span> <span class="time">9:10 AM</span> </div> </a> <!-- Message --> <a href="javascript:void(0)"> <div class="user-img"> <img src="../assets/images/users/3.jpg" alt="user" class="img-circle"> <span class="profile-status away pull-right"></span> </div> <div class="mail-contnet"> <h5>Arijit Sinh</h5> <span class="mail-desc">I am a singer!</span> <span class="time">9:08 AM</span> </div> </a> <!-- Message --> <a href="javascript:void(0)"> <div class="user-img"> <img src="../assets/images/users/4.jpg" alt="user" class="img-circle"> <span class="profile-status offline pull-right"></span> </div> <div class="mail-contnet"> <h5>Pavan kumar</h5> <span class="mail-desc">Just see the my admin!</span> <span class="time">9:02 AM</span> </div> </a> </div> </li> <li> <a class="nav-link text-center link" href="javascript:void(0);"> <strong>See all e-Mails</strong> <i class="fa fa-angle-right"></i> </a> </li> </ul> </div> </li> <!-- ============================================================== --> <!-- End Messages --> <!-- ============================================================== --> <!-- ============================================================== --> <!-- mega menu --> <!-- ============================================================== --> <li class="nav-item dropdown mega-dropdown"> <a class="nav-link dropdown-toggle waves-effect waves-dark" href="" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="ti-layout-width-default"></i></a> <div class="dropdown-menu animated bounceInDown"> <ul class="mega-dropdown-menu row"> <li class="col-lg-3 col-xlg-2 m-b-30"> <h4 class="m-b-20">CAROUSEL</h4> <!-- CAROUSEL --> <div id="carouselExampleControls" class="carousel slide" data-ride="carousel"> <div class="carousel-inner" role="listbox"> <div class="carousel-item active"> <div class="container"> <img class="d-block img-fluid" src="../assets/images/big/img1.jpg" alt="First slide"></div> </div> <div class="carousel-item"> <div class="container"><img class="d-block img-fluid" src="../assets/images/big/img2.jpg" alt="Second slide"></div> </div> <div class="carousel-item"> <div class="container"><img class="d-block img-fluid" src="../assets/images/big/img3.jpg" alt="Third slide"></div> </div> </div> <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> </div> <!-- End CAROUSEL --> </li> <li class="col-lg-3 m-b-30"> <h4 class="m-b-20">ACCORDION</h4> <!-- Accordian --> <div class="accordion" id="accordionExample"> <div class="card m-b-0"> <div class="card-header bg-white p-0" id="headingOne"> <h5 class="mb-0"> <button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Collapsible Group Item #1 </button> </h5> </div> <div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionExample"> <div class="card-body"> Anim pariatur cliche reprehenderit, enim eiusmod high. </div> </div> </div> <div class="card m-b-0"> <div class="card-header bg-white p-0" id="headingTwo"> <h5 class="mb-0"> <button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> Collapsible Group Item #2 </button> </h5> </div> <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample"> <div class="card-body"> Anim pariatur cliche reprehenderit, enim eiusmod high. </div> </div> </div> <div class="card m-b-0"> <div class="card-header bg-white p-0" id="headingThree"> <h5 class="mb-0"> <button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> Collapsible Group Item #3 </button> </h5> </div> <div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionExample"> <div class="card-body"> Anim pariatur cliche reprehenderit, enim eiusmod high. </div> </div> </div> </div> </li> <li class="col-lg-3 m-b-30"> <h4 class="m-b-20">CONTACT US</h4> <!-- Contact --> <form> <div class="form-group"> <input type="text" class="form-control" id="exampleInputname1" placeholder="Enter Name"> </div> <div class="form-group"> <input type="email" class="form-control" placeholder="Enter email"> </div> <div class="form-group"> <textarea class="form-control" id="exampleTextarea" rows="3" placeholder="Message"></textarea> </div> <button type="submit" class="btn btn-info">Submit</button> </form> </li> <li class="col-lg-3 col-xlg-4 m-b-30"> <h4 class="m-b-20">List style</h4> <!-- List style --> <ul class="list-style-none"> <li><a href="javascript:void(0)"><i class="fa fa-check text-success"></i> You can give link</a></li> <li><a href="javascript:void(0)"><i class="fa fa-check text-success"></i> Give link</a></li> <li><a href="javascript:void(0)"><i class="fa fa-check text-success"></i> Another Give link</a></li> <li><a href="javascript:void(0)"><i class="fa fa-check text-success"></i> Forth link</a></li> <li><a href="javascript:void(0)"><i class="fa fa-check text-success"></i> Another fifth link</a></li> </ul> </li> </ul> </div> </li> <!-- ============================================================== --> <!-- End mega menu --> <!-- ============================================================== --> <li class="nav-item right-side-toggle"> <a class="nav-link waves-effect waves-light" href="javascript:void(0)"><i class="ti-settings"></i></a></li> </ul> </div> </nav> </header> <!-- ============================================================== --> <!-- End Topbar header --> <!-- ============================================================== --> <!-- ============================================================== --> <!-- Left Sidebar - style you can find in sidebar.scss --> <!-- ============================================================== --> <aside class="left-sidebar"> <!-- Sidebar scroll--> <div class="scroll-sidebar"> <!-- User Profile--> <div class="user-profile"> <div class="user-pro-body"> <div><img src="../assets/images/users/2.jpg" alt="user-img" class="img-circle"></div> <div class="dropdown"> <a href="javascript:void(0)" class="dropdown-toggle u-dropdown link hide-menu" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Steave Gection <span class="caret"></span></a> <div class="dropdown-menu animated flipInY"> <!-- text--> <a href="javascript:void(0)" class="dropdown-item"><i class="ti-user"></i> My Profile</a> <!-- text--> <a href="javascript:void(0)" class="dropdown-item"><i class="ti-wallet"></i> My Balance</a> <!-- text--> <a href="javascript:void(0)" class="dropdown-item"><i class="ti-email"></i> Inbox</a> <!-- text--> <div class="dropdown-divider"></div> <!-- text--> <a href="javascript:void(0)" class="dropdown-item"><i class="ti-settings"></i> Account Setting</a> <!-- text--> <div class="dropdown-divider"></div> <!-- text--> <a href="pages-login.html" class="dropdown-item"><i class="fas fa-power-off"></i> Logout</a> <!-- text--> </div> </div> </div> </div> <!-- Sidebar navigation--> <nav class="sidebar-nav"> <ul id="sidebarnav"> <li class="nav-small-cap">--- PERSONAL</li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="icon-speedometer"></i><span class="hide-menu">Dashboard <span class="badge badge-pill badge-cyan ml-auto">4</span></span></a> <ul aria-expanded="false" class="collapse"> <li><a href="index.html">Minimal </a></li> <li><a href="index2.html">Analytical</a></li> <li><a href="index3.html">Demographical</a></li> <li><a href="index4.html">Modern</a></li> </ul> </li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="ti-layout-grid2"></i><span class="hide-menu">Apps</span></a> <ul aria-expanded="false" class="collapse"> <li><a href="app-calendar.html">Calendar</a></li> <li><a href="app-chat.html">Chat app</a></li> <li><a href="app-ticket.html">Support Ticket</a></li> <li><a href="app-contact.html">Contact / Employee</a></li> <li><a href="app-contact2.html">Contact Grid</a></li> <li><a href="app-contact-detail.html">Contact Detail</a></li> </ul> </li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="ti-email"></i><span class="hide-menu">Inbox</span></a> <ul aria-expanded="false" class="collapse"> <li><a href="app-email.html">Mailbox</a></li> <li><a href="app-email-detail.html">Mailbox Detail</a></li> <li><a href="app-compose.html">Compose Mail</a></li> </ul> </li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="ti-palette"></i><span class="hide-menu">Ui Elements <span class="badge badge-pill badge-primary text-white ml-auto">25</span></span></a> <ul aria-expanded="false" class="collapse"> <li><a href="ui-cards.html">Cards</a></li> <li><a href="ui-user-card.html">User Cards</a></li> <li><a href="ui-buttons.html">Buttons</a></li> <li><a href="ui-modals.html">Modals</a></li> <li><a href="ui-tab.html">Tab</a></li> <li><a href="ui-tooltip-popover.html">Tooltip & Popover</a></li> <li><a href="ui-tooltip-stylish.html">Tooltip stylish</a></li> <li><a href="ui-sweetalert.html">Sweet Alert</a></li> <li><a href="ui-notification.html">Notification</a></li> <li><a href="ui-progressbar.html">Progressbar</a></li> <li><a href="ui-nestable.html">Nestable</a></li> <li><a href="ui-range-slider.html">Range slider</a></li> <li><a href="ui-timeline.html">Timeline</a></li> <li><a href="ui-typography.html">Typography</a></li> <li><a href="ui-horizontal-timeline.html">Horizontal Timeline</a></li> <li><a href="ui-session-timeout.html">Session Timeout</a></li> <li><a href="ui-session-ideal-timeout.html">Session Ideal Timeout</a></li> <li><a href="ui-bootstrap.html">Bootstrap Ui</a></li> <li><a href="ui-breadcrumb.html">Breadcrumb</a></li> <li><a href="ui-bootstrap-switch.html">Bootstrap Switch</a></li> <li><a href="ui-list-media.html">List Media</a></li> <li><a href="ui-ribbons.html">Ribbons</a></li> <li><a href="ui-grid.html">Grid</a></li> <li><a href="ui-carousel.html">Carousel</a></li> <li><a href="ui-date-paginator.html">Date-paginator</a></li> <li><a href="ui-dragable-portlet.html">Dragable Portlet</a></li> <li><a href="ui-spinner.html">Spinner</a></li> <li><a href="ui-scrollspy.html">Scrollspy</a></li> <li><a href="ui-toasts.html">Toasts</a></li> </ul> </li> <li class="nav-small-cap">--- FORMS, TABLE & WIDGETS</li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="ti-layout-media-right-alt"></i><span class="hide-menu">Forms</span></a> <ul aria-expanded="false" class="collapse"> <li><a href="form-basic.html">Basic Forms</a></li> <li><a href="form-layout.html">Form Layouts</a></li> <li><a href="form-addons.html">Form Addons</a></li> <li><a href="form-material.html">Form Material</a></li> <li><a href="form-float-input.html">Floating Lable</a></li> <li><a href="form-pickers.html">Form Pickers</a></li> <li><a href="form-upload.html">File Upload</a></li> <li><a href="form-mask.html">Form Mask</a></li> <li><a href="form-validation.html">Form Validation</a></li> <li><a href="form-bootstrap-validation.html">Form Bootstrap Validation</a></li> <li><a href="form-dropzone.html">File Dropzone</a></li> <li><a href="form-icheck.html">Icheck control</a></li> <li><a href="form-img-cropper.html">Image Cropper</a></li> <li><a href="form-bootstrapwysihtml5.html">HTML5 Editor</a></li> <li><a href="form-typehead.html">Form Typehead</a></li> <li><a href="form-wizard.html">Form Wizard</a></li> <li><a href="form-xeditable.html">Xeditable Editor</a></li> <li><a href="form-summernote.html">Summernote Editor</a></li> <li><a href="form-tinymce.html">Tinymce Editor</a></li> </ul> </li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="ti-layout-accordion-merged"></i><span class="hide-menu">Tables</span></a> <ul aria-expanded="false" class="collapse"> <li><a href="table-basic.html">Basic Tables</a></li> <li><a href="table-layout.html">Table Layouts</a></li> <li><a href="table-data-table.html">Data Tables</a></li> <li><a href="table-footable.html">Footable</a></li> <li><a href="table-jsgrid.html">Js Grid Table</a></li> <li><a href="table-responsive.html">Responsive Table</a></li> <li><a href="table-bootstrap.html">Bootstrap Tables</a></li> <li><a href="table-editable-table.html">Editable Table</a></li> </ul> </li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="ti-settings"></i><span class="hide-menu">Widgets</span></a> <ul aria-expanded="false" class="collapse"> <li><a href="widget-data.html">Data Widgets</a></li> <li><a href="widget-apps.html">Apps Widgets</a></li> <li><a href="widget-charts.html">Charts Widgets</a></li> </ul> </li> <li class="nav-small-cap">--- EXTRA COMPONENTS</li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="ti-gallery"></i><span class="hide-menu">Page Layout</span></a> <ul aria-expanded="false" class="collapse"> <li><a href="layout-single-column.html">1 Column</a></li> <li><a href="layout-fix-header.html">Fix header</a></li> <li><a href="layout-fix-sidebar.html">Fix sidebar</a></li> <li><a href="layout-fix-header-sidebar.html">Fixe header & Sidebar</a></li> <li><a href="layout-boxed.html">Boxed Layout</a></li> <li><a href="layout-logo-center.html">Logo in Center</a></li> </ul> </li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="ti-files"></i><span class="hide-menu">Sample Pages <span class="badge badge-pill badge-info">25</span></span></a> <ul aria-expanded="false" class="collapse"> <li><a href="starter-kit.html">Starter Kit</a></li> <li><a href="pages-blank.html">Blank page</a></li> <li><a href="javascript:void(0)" class="has-arrow">Authentication <span class="badge badge-pill badge-success pull-right">6</span></a> <ul aria-expanded="false" class="collapse"> <li><a href="pages-login.html">Login 1</a></li> <li><a href="pages-login-2.html">Login 2</a></li> <li><a href="pages-register.html">Register</a></li> <li><a href="pages-register2.html">Register 2</a></li> <li><a href="pages-register3.html">Register 3</a></li> <li><a href="pages-lockscreen.html">Lockscreen</a></li> <li><a href="pages-recover-password.html">Recover password</a></li> </ul> </li> <li><a href="pages-profile.html">Profile page</a></li> <li><a href="pages-animation.html">Animation</a></li> <li><a href="pages-fix-innersidebar.html">Sticky Left sidebar</a></li> <li><a href="pages-fix-inner-right-sidebar.html">Sticky Right sidebar</a></li> <li><a href="pages-invoice.html">Invoice</a></li> <li><a href="pages-treeview.html">Treeview</a></li> <li><a href="pages-utility-classes.html">Helper Classes</a></li> <li><a href="pages-search-result.html">Search result</a></li> <li><a href="pages-scroll.html">Scrollbar</a></li> <li><a href="pages-pricing.html">Pricing</a></li> <li><a href="pages-lightbox-popup.html">Lighbox popup</a></li> <li><a href="pages-gallery.html">Gallery</a></li> <li><a href="pages-faq.html">Faqs</a></li> <li><a href="javascript:void(0)" class="has-arrow">Error Pages</a> <ul aria-expanded="false" class="collapse"> <li><a href="pages-error-400.html">400</a></li> <li><a href="pages-error-403.html">403</a></li> <li><a href="pages-error-404.html">404</a></li> <li><a href="pages-error-500.html">500</a></li> <li><a href="pages-error-503.html">503</a></li> </ul> </li> </ul> </li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="ti-pie-chart"></i><span class="hide-menu">Charts</span></a> <ul aria-expanded="false" class="collapse"> <li><a href="chart-morris.html">Morris Chart</a></li> <li><a href="chart-chartist.html">Chartis Chart</a></li> <li><a href="chart-echart.html">Echarts</a></li> <li><a href="chart-flot.html">Flot Chart</a></li> <li><a href="chart-knob.html">Knob Chart</a></li> <li><a href="chart-chart-js.html">Chartjs</a></li> <li><a href="chart-sparkline.html">Sparkline Chart</a></li> <li><a href="chart-extra-chart.html">Extra chart</a></li> <li><a href="chart-peity.html">Peity Charts</a></li> </ul> </li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="ti-light-bulb"></i><span class="hide-menu">Icons</span></a> <ul aria-expanded="false" class="collapse"> <li><a href="icon-material.html">Material Icons</a></li> <li><a href="icon-fontawesome.html">Fontawesome Icons</a></li> <li><a href="icon-themify.html">Themify Icons</a></li> <li><a href="icon-weather.html">Weather Icons</a></li> <li><a href="icon-simple-lineicon.html">Simple Line icons</a></li> <li><a href="icon-iconmind.html">Iconmind icons</a></li> <li><a href="icon-flag.html">Flag Icons</a></li> </ul> </li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="ti-location-pin"></i><span class="hide-menu">Maps</span></a> <ul aria-expanded="false" class="collapse"> <li><a href="map-google.html">Google Maps</a></li> <li><a href="map-vector.html">Vector Maps</a></li> </ul> </li> <li> <a class="has-arrow waves-effect waves-dark" href="javascript:void(0)" aria-expanded="false"><i class="ti-align-left"></i><span class="hide-menu">Multi level dd</span></a> <ul aria-expanded="false" class="collapse"> <li><a href="javascript:void(0)">item 1.1</a></li> <li><a href="javascript:void(0)">item 1.2</a></li> <li> <a class="has-arrow" href="javascript:void(0)" aria-expanded="false">Menu 1.3</a> <ul aria-expanded="false" class="collapse"> <li><a href="javascript:void(0)">item 1.3.1</a></li> <li><a href="javascript:void(0)">item 1.3.2</a></li> <li><a href="javascript:void(0)">item 1.3.3</a></li> <li><a href="javascript:void(0)">item 1.3.4</a></li> </ul> </li> <li><a href="javascript:void(0)">item 1.4</a></li> </ul> </li> <li class="nav-small-cap">--- SUPPORT</li> <li> <a class="waves-effect waves-dark" href="../documentation/documentation.html" aria-expanded="false"> <i class="far fa-circle text-danger"></i> <span class="hide-menu">Documentation</span> </a> </li> <li> <a class="waves-effect waves-dark" href="pages-login.html" aria-expanded="false"> <i class="far fa-circle text-success"></i> <span class="hide-menu">Log Out</span> </a> </li> <li> <a class="waves-effect waves-dark" href="pages-faq.html" aria-expanded="false"> <i class="far fa-circle text-info"></i> <span class="hide-menu">FAQs</span> </a> </li> </ul> </nav> <!-- End Sidebar navigation --> </div> <!-- End Sidebar scroll--> </aside> <!-- ============================================================== --> <!-- End Left Sidebar - style you can find in sidebar.scss --> <!-- ============================================================== --> <!-- ============================================================== --> <!-- Page wrapper --> <!-- ============================================================== --> <div class="page-wrapper"> <!-- ============================================================== --> <!-- Container fluid --> <!-- ============================================================== --> <div class="container-fluid"> <!-- ============================================================== --> <!-- Bread crumb and right sidebar toggle --> <!-- ============================================================== --> <div class="row page-titles"> <div class="col-md-5 align-self-center"> <h4 class="text-themecolor">Bootstrap Ui</h4> </div> <div class="col-md-7 align-self-center text-right"> <div class="d-flex justify-content-end align-items-center"> <ol class="breadcrumb"> <li class="breadcrumb-item"><a href="javascript:void(0)">Home</a></li> <li class="breadcrumb-item active">Bootstrap Ui</li> </ol> <button type="button" class="btn btn-info d-none d-lg-block m-l-15"><i class="fa fa-plus-circle"></i> Create New</button> </div> </div> </div> <!-- ============================================================== --> <!-- End Bread crumb and right sidebar toggle --> <!-- ============================================================== --> <!-- ============================================================== --> <!-- Start Page Content --> <!-- ============================================================== --> <div class="row"> <div class="col-12"> <div class="card"> <div class="card-body"> <div class="row"> <div class="col-lg-6 mb-4"> <h4 class="card-title">Badges</h4> <h6 class="card-subtitle">Use class <code>.badge</code> and for colors <code>badge-success</code> for get desire badge.</h6> <h1>Example heading <span class="badge badge-secondary">New</span></h1> <h2>Example heading <span class="badge badge-success">New</span></h2> <h3>Example heading <span class="badge badge-info">New</span></h3> <h4>Example heading <span class="badge badge-primary">New</span></h4> <h5>Example heading <span class="badge badge-danger">New</span></h5> <h6>Example heading <span class="badge badge-warning">New</span></h6> </div> <div class="col-lg-3 mb-4"> <h4 class="card-title">Contextual Badge variations</h4> <h6 class="card-subtitle">Use class <code>.badge</code> and for colors <code>badge-success</code> for get desire badge.</h6> <span class="badge badge-secondary">Default</span> <br/> <span class="badge badge-primary">Primary</span> <br/> <span class="badge badge-success">Success</span> <br/> <span class="badge badge-info">Info</span> <br/> <span class="badge badge-warning">Warning</span> <br/> <span class="badge badge-danger">Danger</span> </div> <div class="col-lg-3 mb-4"> <h4 class="card-title">Pill badges</h4> <h6 class="card-subtitle">Use class <code>.badge-pill</code> and for colors <code>badge-success</code> for get desire badge.</h6> <span class="badge badge-pill badge-secondary">Default</span> <br/> <span class="badge badge-pill badge-primary">Primary</span> <br/> <span class="badge badge-pill badge-success">Success</span> <br/> <span class="badge badge-pill badge-info">Info</span> <br/> <span class="badge badge-pill badge-warning">Warning</span> <br/> <span class="badge badge-pill badge-danger">Danger</span> </div> <div class="col-md-6"> <h4 class="card-title mt-3">Badges</h4> <button type="button" class="btn btn-primary"> Notifications <span class="badge badge-light">4</span> </button> <button type="button" class="btn btn-primary"> Profile <span class="badge badge-light">9</span> <span class="sr-only">unread messages</span> </button> </div> <div class="col-md-6"> <h4 class="card-title mt-3">Contextual variations</h4> <span class="badge badge-primary">Primary</span> <span class="badge badge-secondary">Secondary</span> <span class="badge badge-success">Success</span> <span class="badge badge-danger">Danger</span> <span class="badge badge-warning">Warning</span> <span class="badge badge-info">Info</span> <span class="badge badge-light">Light</span> <span class="badge badge-dark">Dark</span> <h4 class="card-title mt-3">Pill badges</h4> <span class="badge badge-pill badge-primary">Primary</span> <span class="badge badge-pill badge-secondary">Secondary</span> <span class="badge badge-pill badge-success">Success</span> <span class="badge badge-pill badge-danger">Danger</span> <span class="badge badge-pill badge-warning">Warning</span> <span class="badge badge-pill badge-info">Info</span> <span class="badge badge-pill badge-light">Light</span> <span class="badge badge-pill badge-dark">Dark</span> </div> <div class="col-12"> <br> <br> <hr> <br> <br> </div> <div class="col-lg-5 mb-4"> <h4 class="card-title">Collapse (Toggle)</h4> <h6 class="card-subtitle">click below button, for Use a link with the <code>href</code> attribute, with class <code>.collapse</code> get desire toggle.</h6> <p> <a class="btn btn-info" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> Link with href </a> <button class="btn btn-success" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> Button with data-target </button> </p> <div class="collapse" id="collapseExample"> <div class="card card-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. </div> </div> </div> <div class="col-lg-6 offset-lg-1"> <h4 class="card-title">Accordion example</h4> <h6 class="card-subtitle">Extend the default collapse behavior to create an accordion.</h6> <div id="accordian-3"> <div class="card"> <a class="card-header" id="heading11"> <button class="btn btn-link" data-toggle="collapse" data-target="#collapse1" aria-expanded="true" aria-controls="collapse1"> <h5 class="mb-0">Accordion Example 1</h5> </button> </a> <div id="collapse1" class="collapse show" aria-labelledby="heading11" data-parent="#accordian-3"> <div class="card-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. </div> </div> </div> <div class="card"> <a class="card-header" id="heading22"> <button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapse2" aria-expanded="false" aria-controls="collapse2"> <h5 class="mb-0">Accordion Example 2</h5> </button> </a> <div id="collapse2" class="collapse" aria-labelledby="heading22" data-parent="#accordian-3"> <div class="card-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. </div> </div> </div> <div class="card"> <a class="card-header" id="heading33"> <button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapse3" aria-expanded="false" aria-controls="collapse3"> <h5 class="mb-0">Accordion Example 3</h5> </button> </a> <div id="collapse3" class="collapse" aria-labelledby="heading33" data-parent="#accordian-3"> <div class="card-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. </div> </div> </div> </div> </div> <div class="col-12"> <br> <br> <hr> <br> <br> </div> <div class="col-lg-6 mb-4"> <h4 class="card-title">Label Example</h4> <h6 class="card-subtitle">Use class <code>.label </code> for get desire text.</h6> <h1>Example heading <span class="label label-inverse">New</span></h1> <h2>Example heading <span class="label label-success">New</span></h2> <h3>Example heading <span class="label label-info">New</span></h3> <h4>Example heading <span class="label label-primary">New</span></h4> <h5>Example heading <span class="label label-danger">New</span></h5> <h6>Example heading <span class="label label-warning">New</span></h6> </div> <div class="col-lg-3 mb-4"> <h4 class="card-title">Contextual Label variations</h4> <h6 class="card-subtitle">Use class <code>.label</code> and for colors <code>label-success</code> for get desire label.</h6> <span class="label label-inverse">Default</span> <br> <span class="label label-primary">Primary</span> <br> <span class="label label-success">Success</span> <br> <span class="label label-info">Info</span> <br> <span class="label label-warning">Warning</span> <br> <span class="label label-danger">Danger</span> </div> <div class="col-lg-3 mb-4"> <h4 class="card-title">Label rounded</h4> <h6 class="card-subtitle">Use class <code>.label .label-rounded</code> and for colors <code>label-success</code> for get desire label.</h6> <span class="label label-rounded label-inverse">Default</span> <br> <span class="label label-rounded label-primary">Primary</span> <br> <span class="label label-rounded label-success">Success</span> <br> <span class="label label-rounded label-info">Info</span> <br> <span class="label label-rounded label-warning">Warning</span> <br> <span class="label label-rounded label-danger">Danger</span> </div> <div class="col-12"> <br> <br> <hr> <br> <br> </div> <div class="col-lg-4 mb-4"> <h4 class="card-title">Simple pagination</h4> <h6 class="card-subtitle">To make pagination give class <code>pagination</code> to ul</h6> <nav aria-label="Page navigation example"> <ul class="pagination"> <li class="page-item"><a class="page-link" href="javascript:void(0)">Previous</a></li> <li class="page-item"><a class="page-link" href="javascript:void(0)">1</a></li> <li class="page-item"><a class="page-link" href="javascript:void(0)">2</a></li> <li class="page-item"><a class="page-link" href="javascript:void(0)">3</a></li> <li class="page-item"><a class="page-link" href="javascript:void(0)">Next</a></li> </ul> </nav> </div> <div class="col-lg-4 mb-4"> <h4 class="card-title">Working with icons</h4> <h6 class="card-subtitle">To make pagination give class <code>pagination</code> to ul</h6> <nav aria-label="Page navigation example"> <ul class="pagination"> <li class="page-item"> <a class="page-link" href="javascript:void(0)" aria-label="Previous"> <span aria-hidden="true">«</span> <span class="sr-only">Previous</span> </a> </li> <li class="page-item"><a class="page-link" href="javascript:void(0)">1</a></li> <li class="page-item"><a class="page-link" href="javascript:void(0)">2</a></li> <li class="page-item"><a class="page-link" href="javascript:void(0)">3</a></li> <li class="page-item"> <a class="page-link" href="javascript:void(0)" aria-label="Next"> <span aria-hidden="true">»</span> <span class="sr-only">Next</span> </a> </li> </ul> </nav> </div> <div class="col-lg-4 mb-4"> <h4 class="card-title">Disabled and active states</h4> <h6 class="card-subtitle">To make pagination active or disable give class <code>.disabled & .active</code> to ul</h6> <nav aria-label="..."> <ul class="pagination"> <li class="page-item disabled"> <a class="page-link" href="javascript:void(0)" tabindex="-1">Previous</a> </li> <li class="page-item"><a class="page-link" href="javascript:void(0)">1</a></li> <li class="page-item active"> <a class="page-link" href="javascript:void(0)">2 <span class="sr-only">(current)</span></a> </li> <li class="page-item"><a class="page-link" href="javascript:void(0)">3</a></li> <li class="page-item"> <a class="page-link" href="javascript:void(0)">Next</a> </li> </ul> </nav> </div> <div class="col-12"> <br> <br> <hr> <br> <br> </div> <div class="col-12"> <h4 class="card-title">Sizing</h4> <h6 class="card-subtitle">Fancy larger or smaller pagination? Add<code>.pagination-sm </code> for additional sizes.</h6> <nav aria-label="..."> <ul class="pagination pagination-sm"> <li class="page-item disabled"> <a class="page-link" href="javascript:void(0)" tabindex="-1">Previous</a> </li> <li class="page-item"><a class="page-link" href="javascript:void(0)">1</a></li> <li class="page-item"><a class="page-link" href="javascript:void(0)">2</a></li> <li class="page-item"><a class="page-link" href="javascript:void(0)">3</a></li> <li class="page-item"> <a class="page-link" href="javascript:void(0)">Next</a> </li> </ul> </nav> </div> <div class="col-12"> <h4 class="card-title">Alignment</h4> <h6 class="card-subtitle">Change the alignment of pagination components with felxbox <code>justify-content-center, justify-content-end, </code></h6> <nav aria-label="Page navigation example"> <ul class="pagination justify-content-center"> <li class="page-item disabled"> <a class="page-link" href="javascript:void(0)" tabindex="-1">Previous</a> </li> <li class="page-item"><a class="page-link" href="javascript:void(0)">1</a></li> <li class="page-item"><a class="page-link" href="javascript:void(0)">2</a></li> <li class="page-item"><a class="page-link" href="javascript:void(0)">3</a></li> <li class="page-item"> <a class="page-link" href="javascript:void(0)">Next</a> </li> </ul> </nav> </div> <div class="col-12"> <h4 class="card-title">Sizing</h4> <h6 class="card-subtitle">Fancy larger or smaller pagination? Add<code>.pagination-lg </code> for additional sizes.</h6> <nav aria-label="..."> <ul class="pagination pagination-lg"> <li class="page-item disabled"> <a class="page-link" href="javascript:void(0)" tabindex="-1">Previous</a> </li> <li class="page-item"><a class="page-link" href="javascript:void(0)">1</a></li> <li class="page-item"><a class="page-link" href="javascript:void(0)">2</a></li> <li class="page-item"><a class="page-link" href="javascript:void(0)">3</a></li> <li class="page-item"> <a class="page-link" href="javascript:void(0)">Next</a> </li> </ul> </nav> </div> <div class="col-12"> <br> <br> <hr> <br> <br> </div> <div class="col-lg-4 mb-4"> <h4 class="card-title">Image with round corner</h4> <h6 class="card-subtitle"><code>.img-rounded</code></h6> <img src="../assets/images/big/img1.jpg" alt="image" class="img-responsive img-rounded" width="200"> <p class="mt-3 mb-0"> </div> <div class="col-lg-4 text-center mb-4"> <h4 class="card-title">Image with circle</h4> <h6 class="card-subtitle"><code>.img-circle</code> Make sure the image is square not ractangle</h6> <img src="../assets/images/users/5.jpg" alt="image" class="rounded-circle" width="290"> <p class="mt-3 mb-0"> </div> <div class="col-lg-4"> <h4 class="card-title">Image with Thumbnail</h4> <h6 class="card-subtitle"><code>img-thumbnail</code></h6> <img src="../assets/images/users/5.jpg" alt="image" class="img-thumbnail" width="290"> <p class="mt-3 mb-0"> </div> <div class="col-12"> <br> <br> <hr> <br> <br> </div> <div class="col-lg-6"> <h4 class="card-title">jumbotron</h4> <h6 class="card-subtitle">A lightweight, flexible component that can optionally extend the entire viewport to showcase key marketing messages on your site.</h6> <div class="jumbotron"> <h1 class="display-3">Hello, world!</h1> <p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p> <hr class="my-4"> <p>It uses utility classes for typography and spacing to space content out within the larger container.</p> <p class="lead"> <a class="btn btn-primary btn-lg" href="javascript:void(0)" role="button">Learn more</a> </p> </div> </div> <div class="col-lg-6"> <h4 class="card-title">Fluid jumbotron</h4> <h6 class="card-subtitle">To make the jumbotron full width, and without rounded corners, add the <code>jumbotron-fluid</code></h6> <div class="jumbotron jumbotron-fluid"> <div class="container"> <h1 class="display-3">Fluid jumbotron</h1> <p class="lead">This is a modified jumbotron that occupies the entire horizontal space of its parent.</p> </div> </div> </div> <div class="col-lg-6 mt-4"> <h4 class="card-title">Range</h4> <label for="customRange1">Ordinary Range</label> <input type="range" class="custom-range" id="customRange1"> <label for="customRange2">Range with Min-Max</label> <input type="range" class="custom-range" min="0" max="5" id="customRange2"> <label for="customRange3">Range with Step</label> <input type="range" class="custom-range" min="0" max="5" step="0.5" id="customRange3"> </div> </div> </div> </div> </div> </div> <!-- ============================================================== --> <!-- End PAge Content --> <!-- ============================================================== --> <!-- ============================================================== --> <!-- Right sidebar --> <!-- ============================================================== --> <!-- .right-sidebar --> <div class="right-sidebar"> <div class="slimscrollright"> <div class="rpanel-title"> Service Panel <span><i class="ti-close right-side-toggle"></i></span> </div> <div class="r-panel-body"> <ul id="themecolors" class="m-t-20"> <li><b>With Light sidebar</b></li> <li><a href="javascript:void(0)" data-skin="skin-default" class="default-theme">1</a></li> <li><a href="javascript:void(0)" data-skin="skin-green" class="green-theme">2</a></li> <li><a href="javascript:void(0)" data-skin="skin-red" class="red-theme">3</a></li> <li><a href="javascript:void(0)" data-skin="skin-blue" class="blue-theme">4</a></li> <li><a href="javascript:void(0)" data-skin="skin-purple" class="purple-theme">5</a></li> <li><a href="javascript:void(0)" data-skin="skin-megna" class="megna-theme">6</a></li> <li class="d-block m-t-30"><b>With Dark sidebar</b></li> <li><a href="javascript:void(0)" data-skin="skin-default-dark" class="default-dark-theme ">7</a></li> <li><a href="javascript:void(0)" data-skin="skin-green-dark" class="green-dark-theme">8</a></li> <li><a href="javascript:void(0)" data-skin="skin-red-dark" class="red-dark-theme working">9</a></li> <li><a href="javascript:void(0)" data-skin="skin-blue-dark" class="blue-dark-theme">10</a></li> <li><a href="javascript:void(0)" data-skin="skin-purple-dark" class="purple-dark-theme">11</a></li> <li><a href="javascript:void(0)" data-skin="skin-megna-dark" class="megna-dark-theme ">12</a></li> </ul> <ul class="m-t-20 chatonline"> <li><b>Chat option</b></li> <li> <a href="javascript:void(0)"><img src="../assets/images/users/1.jpg" alt="user-img" class="img-circle"> <span>Varun Dhavan <small class="text-success">online</small></span></a> </li> <li> <a href="javascript:void(0)"><img src="../assets/images/users/2.jpg" alt="user-img" class="img-circle"> <span>Genelia Deshmukh <small class="text-warning">Away</small></span></a> </li> <li> <a href="javascript:void(0)"><img src="../assets/images/users/3.jpg" alt="user-img" class="img-circle"> <span>Ritesh Deshmukh <small class="text-danger">Busy</small></span></a> </li> <li> <a href="javascript:void(0)"><img src="../assets/images/users/4.jpg" alt="user-img" class="img-circle"> <span>Arijit Sinh <small class="text-muted">Offline</small></span></a> </li> <li> <a href="javascript:void(0)"><img src="../assets/images/users/5.jpg" alt="user-img" class="img-circle"> <span>Govinda Star <small class="text-success">online</small></span></a> </li> <li> <a href="javascript:void(0)"><img src="../assets/images/users/6.jpg" alt="user-img" class="img-circle"> <span>John Abraham<small class="text-success">online</small></span></a> </li> <li> <a href="javascript:void(0)"><img src="../assets/images/users/7.jpg" alt="user-img" class="img-circle"> <span>Hritik Roshan<small class="text-success">online</small></span></a> </li> <li> <a href="javascript:void(0)"><img src="../assets/images/users/8.jpg" alt="user-img" class="img-circle"> <span>Pwandeep rajan <small class="text-success">online</small></span></a> </li> </ul> </div> </div> </div> <!-- ============================================================== --> <!-- End Right sidebar --> <!-- ============================================================== --> </div> <!-- ============================================================== --> <!-- End Container fluid --> <!-- ============================================================== --> </div> <!-- ============================================================== --> <!-- End Page wrapper --> <!-- ============================================================== --> <!-- ============================================================== --> <!-- footer --> <!-- ============================================================== --> <footer class="footer"> © 2019 Eliteadmin by themedesigner.in </footer> <!-- ============================================================== --> <!-- End footer --> <!-- ============================================================== --> </div> <!-- ============================================================== --> <!-- End Wrapper --> <!-- ============================================================== --> <!-- ============================================================== --> <!-- All Jquery --> <!-- ============================================================== --> <script src="../assets/node_modules/jquery/jquery-3.2.1.min.js"></script> <!-- Bootstrap tether Core JavaScript --> <script src="../assets/node_modules/popper/popper.min.js"></script> <script src="../assets/node_modules/bootstrap/dist/js/bootstrap.min.js"></script> <!-- slimscrollbar scrollbar JavaScript --> <script src="dist/js/perfect-scrollbar.jquery.min.js"></script> <!--Wave Effects --> <script src="dist/js/waves.js"></script> <!--Menu sidebar --> <script src="dist/js/sidebarmenu.js"></script> <!--stickey kit --> <script src="../assets/node_modules/sticky-kit-master/dist/sticky-kit.min.js"></script> <script src="../assets/node_modules/sparkline/jquery.sparkline.min.js"></script> <!--Custom JavaScript --> <script src="dist/js/custom.min.js"></script> </body> </html>

| ver. 1.4 | Github | . | PHP 8.2.9 | Generation time: 0.02 | proxy | phpinfo | Settings