758 lines
57 KiB
HTML
758 lines
57 KiB
HTML
|
<!doctype html>
|
||
|
|
<html lang="en">
|
||
|
|
|
||
|
|
|
||
|
|
<!-- Mirrored from technext.github.io/concept/pages/accordions.html by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 09 Oct 2021 09:53:30 GMT -->
|
||
|
|
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=utf-8" /><!-- /Added by HTTrack -->
|
||
|
|
<head>
|
||
|
|
<!-- Required meta tags -->
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||
|
|
<title>Concept - Bootstrap 4 Admin Dashboard Template</title>
|
||
|
|
<!-- Bootstrap CSS -->
|
||
|
|
<link rel="stylesheet" href="../assets/vendor/bootstrap/css/bootstrap.min.css">
|
||
|
|
<link href="../assets/vendor/fonts/circular-std/style.css" rel="stylesheet">
|
||
|
|
<link rel="stylesheet" href="../assets/libs/css/style.css">
|
||
|
|
<link rel="stylesheet" href="../assets/vendor/fonts/fontawesome/css/fontawesome-all.css">
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- main wrapper -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<div class="dashboard-main-wrapper">
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- navbar -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<div class="dashboard-header">
|
||
|
|
<nav class="navbar navbar-expand-lg bg-white fixed-top">
|
||
|
|
<a class="navbar-brand" href="../index.html">Concept</a>
|
||
|
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||
|
|
<span class="navbar-toggler-icon"></span>
|
||
|
|
</button>
|
||
|
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||
|
|
<ul class="navbar-nav ml-auto navbar-right-top">
|
||
|
|
<li class="nav-item">
|
||
|
|
<div id="custom-search" class="top-search-bar">
|
||
|
|
<input class="form-control" type="text" placeholder="Search..">
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item dropdown notification">
|
||
|
|
<a class="nav-link nav-icons" href="#" id="navbarDropdownMenuLink1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fas fa-fw fa-bell"></i> <span class="indicator"></span></a>
|
||
|
|
<ul class="dropdown-menu dropdown-menu-right notification-dropdown">
|
||
|
|
<li>
|
||
|
|
<div class="notification-title"> Notification</div>
|
||
|
|
<div class="notification-list">
|
||
|
|
<div class="list-group">
|
||
|
|
<a href="#" class="list-group-item list-group-item-action active">
|
||
|
|
<div class="notification-info">
|
||
|
|
<div class="notification-list-user-img"><img src="../assets/images/avatar-2.jpg" alt="" class="user-avatar-md rounded-circle"></div>
|
||
|
|
<div class="notification-list-user-block"><span class="notification-list-user-name">Jeremy Rakestraw</span>accepted your invitation to join the team.
|
||
|
|
<div class="notification-date">2 min ago</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</a>
|
||
|
|
<a href="#" class="list-group-item list-group-item-action">
|
||
|
|
<div class="notification-info">
|
||
|
|
<div class="notification-list-user-img"><img src="../assets/images/avatar-3.jpg" alt="" class="user-avatar-md rounded-circle"></div>
|
||
|
|
<div class="notification-list-user-block"><span class="notification-list-user-name">
|
||
|
|
John Abraham</span>is now following you
|
||
|
|
<div class="notification-date">2 days ago</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</a>
|
||
|
|
<a href="#" class="list-group-item list-group-item-action">
|
||
|
|
<div class="notification-info">
|
||
|
|
<div class="notification-list-user-img"><img src="../assets/images/avatar-4.jpg" alt="" class="user-avatar-md rounded-circle"></div>
|
||
|
|
<div class="notification-list-user-block"><span class="notification-list-user-name">Monaan Pechi</span> is watching your main repository
|
||
|
|
<div class="notification-date">2 min ago</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</a>
|
||
|
|
<a href="#" class="list-group-item list-group-item-action">
|
||
|
|
<div class="notification-info">
|
||
|
|
<div class="notification-list-user-img"><img src="../assets/images/avatar-5.jpg" alt="" class="user-avatar-md rounded-circle"></div>
|
||
|
|
<div class="notification-list-user-block"><span class="notification-list-user-name">Jessica Caruso</span>accepted your invitation to join the team.
|
||
|
|
<div class="notification-date">2 min ago</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<div class="list-footer"> <a href="#">View all notifications</a></div>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item dropdown connection">
|
||
|
|
<a class="nav-link" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="fas fa-fw fa-th"></i> </a>
|
||
|
|
<ul class="dropdown-menu dropdown-menu-right connection-dropdown">
|
||
|
|
<li class="connection-list">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-xl-4 col-lg-4 col-md-6 col-sm-12 col-12 ">
|
||
|
|
<a href="#" class="connection-item"><img src="../assets/images/github.png" alt="" > <span>Github</span></a>
|
||
|
|
</div>
|
||
|
|
<div class="col-xl-4 col-lg-4 col-md-6 col-sm-12 col-12 ">
|
||
|
|
<a href="#" class="connection-item"><img src="../assets/images/dribbble.png" alt="" > <span>Dribbble</span></a>
|
||
|
|
</div>
|
||
|
|
<div class="col-xl-4 col-lg-4 col-md-6 col-sm-12 col-12 ">
|
||
|
|
<a href="#" class="connection-item"><img src="../assets/images/dropbox.png" alt="" > <span>Dropbox</span></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-xl-4 col-lg-4 col-md-6 col-sm-12 col-12 ">
|
||
|
|
<a href="#" class="connection-item"><img src="../assets/images/bitbucket.png" alt=""> <span>Bitbucket</span></a>
|
||
|
|
</div>
|
||
|
|
<div class="col-xl-4 col-lg-4 col-md-6 col-sm-12 col-12 ">
|
||
|
|
<a href="#" class="connection-item"><img src="../assets/images/mail_chimp.png" alt="" ><span>Mail chimp</span></a>
|
||
|
|
</div>
|
||
|
|
<div class="col-xl-4 col-lg-4 col-md-6 col-sm-12 col-12 ">
|
||
|
|
<a href="#" class="connection-item"><img src="../assets/images/slack.png" alt="" > <span>Slack</span></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<div class="conntection-footer"><a href="#">More</a></div>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item dropdown nav-user">
|
||
|
|
<a class="nav-link nav-user-img" href="#" id="navbarDropdownMenuLink2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><img src="../assets/images/avatar-1.jpg" alt="" class="user-avatar-md rounded-circle"></a>
|
||
|
|
<div class="dropdown-menu dropdown-menu-right nav-user-dropdown" aria-labelledby="navbarDropdownMenuLink2">
|
||
|
|
<div class="nav-user-info">
|
||
|
|
<h5 class="mb-0 text-white nav-user-name">
|
||
|
|
John Abraham</h5>
|
||
|
|
<span class="status"></span><span class="ml-2">Available</span>
|
||
|
|
</div>
|
||
|
|
<a class="dropdown-item" href="#"><i class="fas fa-user mr-2"></i>Account</a>
|
||
|
|
<a class="dropdown-item" href="#"><i class="fas fa-cog mr-2"></i>Setting</a>
|
||
|
|
<a class="dropdown-item" href="#"><i class="fas fa-power-off mr-2"></i>Logout</a>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</nav>
|
||
|
|
</div>
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- end navbar -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- left sidebar -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<div class="nav-left-sidebar sidebar-dark">
|
||
|
|
<div class="menu-list">
|
||
|
|
<nav class="navbar navbar-expand-lg navbar-light">
|
||
|
|
<a class="d-xl-none d-lg-none" href="#">Dashboard</a>
|
||
|
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||
|
|
<span class="navbar-toggler-icon"></span>
|
||
|
|
</button>
|
||
|
|
<div class="collapse navbar-collapse" id="navbarNav">
|
||
|
|
<ul class="navbar-nav flex-column">
|
||
|
|
<li class="nav-divider">
|
||
|
|
Menu
|
||
|
|
</li>
|
||
|
|
<li class="nav-item ">
|
||
|
|
<a class="nav-link active" href="#" data-toggle="collapse" aria-expanded="false" data-target="#submenu-1" aria-controls="submenu-1"><i class="fa fa-fw fa-user-circle"></i>Dashboard <span class="badge badge-success">6</span></a>
|
||
|
|
<div id="submenu-1" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="index.html" data-toggle="collapse" aria-expanded="false" data-target="#submenu-1-2" aria-controls="submenu-1-2">E-Commerce</a>
|
||
|
|
<div id="submenu-1-2" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="../index.html">E Commerce Dashboard</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="../ecommerce-product.html">Product List</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="../ecommerce-product-single.html">Product Single</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="../ecommerce-product-checkout.html">Product Checkout</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="../dashboard-finance.html">Finance</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="../dashboard-sales.html">Sales</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#" data-toggle="collapse" aria-expanded="false" data-target="#submenu-1-1" aria-controls="submenu-1-1">Infulencer</a>
|
||
|
|
<div id="submenu-1-1" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="../dashboard-influencer.html">Influencer</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="../influencer-finder.html">Influencer Finder</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="../influencer-profile.html">Influencer Profile</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#" data-toggle="collapse" aria-expanded="false" data-target="#submenu-2" aria-controls="submenu-2"><i class="fa fa-fw fa-rocket"></i>UI Elements</a>
|
||
|
|
<div id="submenu-2" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="cards.html">Cards <span class="badge badge-secondary">New</span></a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="general.html">General</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="carousel.html">Carousel</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="listgroup.html">List Group</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="typography.html">Typography</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="accordions.html">Accordions</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="tabs.html">Tabs</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#" data-toggle="collapse" aria-expanded="false" data-target="#submenu-3" aria-controls="submenu-3"><i class="fas fa-fw fa-chart-pie"></i>Chart</a>
|
||
|
|
<div id="submenu-3" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="chart-c3.html">C3 Charts</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="chart-chartist.html">Chartist Charts</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="chart-charts.html">Chart</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="chart-morris.html">Morris</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="chart-sparkline.html">Sparkline</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="chart-gauge.html">Guage</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item ">
|
||
|
|
<a class="nav-link" href="#" data-toggle="collapse" aria-expanded="false" data-target="#submenu-4" aria-controls="submenu-4"><i class="fab fa-fw fa-wpforms"></i>Forms</a>
|
||
|
|
<div id="submenu-4" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="form-elements.html">Form Elements</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="form-validation.html">Parsely Validations</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="multiselect.html">Multiselect</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#" data-toggle="collapse" aria-expanded="false" data-target="#submenu-5" aria-controls="submenu-5"><i class="fas fa-fw fa-table"></i>Tables</a>
|
||
|
|
<div id="submenu-5" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="general-table.html">General Tables</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="data-tables.html">Data Tables</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="nav-divider">
|
||
|
|
Features
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#" data-toggle="collapse" aria-expanded="false" data-target="#submenu-6" aria-controls="submenu-6"><i class="fas fa-fw fa-file"></i>Pages</a>
|
||
|
|
<div id="submenu-6" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="invoice.html">Invoice</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="blank-page.html">Blank Page</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="blank-page-header.html">Blank Page Header</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="login.html">Login</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="404-page.html">404 page</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="sign-up.html">Sign up Page</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="forgot-password.html">Forgot Password</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="pricing.html">Pricing Tables</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="timeline.html">Timeline</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="calendar.html">Calendar</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="sortable-nestable-lists.html">Sortable/Nestable List</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="widgets.html">Widgets</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="media-object.html">Media Objects</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="cropper-image.html">Cropper</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="color-picker.html">Color Picker</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#" data-toggle="collapse" aria-expanded="false" data-target="#submenu-7" aria-controls="submenu-7"><i class="fas fa-fw fa-inbox"></i>Apps <span class="badge badge-secondary">New</span></a>
|
||
|
|
<div id="submenu-7" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="inbox.html">Inbox</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="email-details.html">Email Detail</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="email-compose.html">Email Compose</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="message-chat.html">Message Chat</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#" data-toggle="collapse" aria-expanded="false" data-target="#submenu-8" aria-controls="submenu-8"><i class="fas fa-fw fa-columns"></i>Icons</a>
|
||
|
|
<div id="submenu-8" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="icon-fontawesome.html">FontAwesome Icons</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="icon-material.html">Material Icons</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="icon-simple-lineicon.html">Simpleline Icon</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="icon-themify.html">Themify Icon</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="icon-flag.html">Flag Icons</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="icon-weather.html">Weather Icon</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#" data-toggle="collapse" aria-expanded="false" data-target="#submenu-9" aria-controls="submenu-9"><i class="fas fa-fw fa-map-marker-alt"></i>Maps</a>
|
||
|
|
<div id="submenu-9" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="map-google.html">Google Maps</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="map-vector.html">Vector Maps</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#" data-toggle="collapse" aria-expanded="false" data-target="#submenu-10" aria-controls="submenu-10"><i class="fas fa-f fa-folder"></i>Menu Level</a>
|
||
|
|
<div id="submenu-10" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#">Level 1</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#" data-toggle="collapse" aria-expanded="false" data-target="#submenu-11" aria-controls="submenu-11">Level 2</a>
|
||
|
|
<div id="submenu-11" class="collapse submenu" style="">
|
||
|
|
<ul class="nav flex-column">
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#">Level 1</a>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#">Level 2</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="nav-item">
|
||
|
|
<a class="nav-link" href="#">Level 3</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</nav>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- end left sidebar -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- wrapper -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<div class="dashboard-wrapper">
|
||
|
|
<div class="container-fluid dashboard-content">
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- pageheader -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
|
||
|
|
<div class="page-header">
|
||
|
|
<h2 class="pageheader-title">Accordions </h2>
|
||
|
|
<p class="pageheader-text">Proin placerat ante duiullam scelerisque a velit ac porta, fusce sit amet vestibulum mi. Morbi lobortis pulvinar quam.</p>
|
||
|
|
<div class="page-breadcrumb">
|
||
|
|
<nav aria-label="breadcrumb">
|
||
|
|
<ol class="breadcrumb">
|
||
|
|
<li class="breadcrumb-item"><a href="#" class="breadcrumb-link">Dashboard</a></li>
|
||
|
|
<li class="breadcrumb-item"><a href="#" class="breadcrumb-link">UI Elements</a></li>
|
||
|
|
<li class="breadcrumb-item active" aria-current="page">Accordions</li>
|
||
|
|
</ol>
|
||
|
|
</nav>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- end pageheader -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- accrodions -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
|
||
|
|
<div class="row">
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- accrodions style one -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
|
||
|
|
<div class="section-block">
|
||
|
|
<h5 class="section-title">Regular Accordions</h5>
|
||
|
|
<p>Takes the basic nav from above and adds the .nav-tabs class to generate a tabbed interface..</p>
|
||
|
|
</div>
|
||
|
|
<div class="accrodion-regular">
|
||
|
|
<div id="accordion">
|
||
|
|
<div class="card">
|
||
|
|
<div class="card-header" id="headingOne">
|
||
|
|
<h5 class="mb-0">
|
||
|
|
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
|
||
|
|
Accordion Heading Title Here
|
||
|
|
</button>
|
||
|
|
</h5>
|
||
|
|
</div>
|
||
|
|
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
|
||
|
|
<div class="card-body">
|
||
|
|
<p class="lead"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch.</p>
|
||
|
|
<p> Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.</p>
|
||
|
|
<a href="#" class="btn btn-secondary">Go somewhere</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="card">
|
||
|
|
<div class="card-header" id="headingTwo">
|
||
|
|
<h5 class="mb-0">
|
||
|
|
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
|
||
|
|
Accordion Heading Title Here
|
||
|
|
</button> </h5>
|
||
|
|
</div>
|
||
|
|
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
|
||
|
|
<div class="card-body">
|
||
|
|
Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="card">
|
||
|
|
<div class="card-header" id="headingThree">
|
||
|
|
<h5 class="mb-0">
|
||
|
|
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
|
||
|
|
Accordion Heading Title Here
|
||
|
|
</button>
|
||
|
|
</h5>
|
||
|
|
</div>
|
||
|
|
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordion">
|
||
|
|
<div class="card-body">
|
||
|
|
Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-tabhetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- end accrodions style one -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- accrodions style two -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
|
||
|
|
<div class="section-block">
|
||
|
|
<h5 class="section-title">Outline Accordions</h5>
|
||
|
|
<p>Takes the basic nav from above and adds the .nav-tabs class to generate a tabbed interface..</p>
|
||
|
|
</div>
|
||
|
|
<div class="accrodion-outline">
|
||
|
|
<div id="accordion2">
|
||
|
|
<div class="card">
|
||
|
|
<div class="card-header" id="headingFour">
|
||
|
|
<h5 class="mb-0">
|
||
|
|
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseFour" aria-expanded="true" aria-controls="collapseFour">
|
||
|
|
Accordion Heading Title Here
|
||
|
|
</button>
|
||
|
|
</h5>
|
||
|
|
</div>
|
||
|
|
<div id="collapseFour" class="collapse show" aria-labelledby="headingFour" data-parent="#accordion2">
|
||
|
|
<div class="card-body">
|
||
|
|
<p class="lead"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch.</p>
|
||
|
|
<p> Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.</p>
|
||
|
|
<a href="#" class="btn btn-secondary">Go somewhere</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="card">
|
||
|
|
<div class="card-header" id="headingFive">
|
||
|
|
<h5 class="mb-0">
|
||
|
|
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
|
||
|
|
Accordion Heading Title Here
|
||
|
|
</button> </h5>
|
||
|
|
</div>
|
||
|
|
<div id="collapseFive" class="collapse" aria-labelledby="headingFive" data-parent="#accordion2">
|
||
|
|
<div class="card-body">
|
||
|
|
Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="card">
|
||
|
|
<div class="card-header" id="headingSix">
|
||
|
|
<h5 class="mb-0">
|
||
|
|
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSix" aria-expanded="false" aria-controls="collapseSix">
|
||
|
|
Accordion Heading Title Here
|
||
|
|
</button>
|
||
|
|
</h5>
|
||
|
|
</div>
|
||
|
|
<div id="collapseSix" class="collapse" aria-labelledby="headingSix" data-parent="#accordion2">
|
||
|
|
<div class="card-body">
|
||
|
|
Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-tabhetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- end accrodions style two -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- accrodions style three -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
|
||
|
|
<div class="section-block">
|
||
|
|
<h5 class="section-title">Accordions with Icon</h5>
|
||
|
|
<p>Takes the basic nav from above and adds the .nav-tabs class to generate a tabbed interface..</p>
|
||
|
|
</div>
|
||
|
|
<div class="accrodion-regular">
|
||
|
|
<div id="accordion3">
|
||
|
|
<div class="card">
|
||
|
|
<div class="card-header" id="headingSeven">
|
||
|
|
<h5 class="mb-0">
|
||
|
|
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseSeven" aria-expanded="true" aria-controls="collapseSeven">
|
||
|
|
<span class="fas fa-angle-down mr-3"></span>Accordion Heading Title Here
|
||
|
|
</button>
|
||
|
|
</h5>
|
||
|
|
</div>
|
||
|
|
<div id="collapseSeven" class="collapse show" aria-labelledby="headingSeven" data-parent="#accordion3">
|
||
|
|
<div class="card-body">
|
||
|
|
<p class="lead"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch.</p>
|
||
|
|
<p> Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.</p>
|
||
|
|
<a href="#" class="btn btn-secondary">Go somewhere</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="card mb-2">
|
||
|
|
<div class="card-header" id="headingEight">
|
||
|
|
<h5 class="mb-0">
|
||
|
|
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEight" aria-expanded="false" aria-controls="collapseEight">
|
||
|
|
<span class="fas fa-angle-down mr-3"></span>Accordion Heading Title Here
|
||
|
|
</button> </h5>
|
||
|
|
</div>
|
||
|
|
<div id="collapseEight" class="collapse" aria-labelledby="headingEight" data-parent="#accordion3">
|
||
|
|
<div class="card-body">
|
||
|
|
Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="card mb-2">
|
||
|
|
<div class="card-header" id="headingNine">
|
||
|
|
<h5 class="mb-0">
|
||
|
|
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseNine" aria-expanded="false" aria-controls="collapseNine">
|
||
|
|
<span class="fas fa-angle-down mr-3"></span>Accordion Heading Title Here
|
||
|
|
</button>
|
||
|
|
</h5>
|
||
|
|
</div>
|
||
|
|
<div id="collapseNine" class="collapse" aria-labelledby="headingNine" data-parent="#accordion3">
|
||
|
|
<div class="card-body">
|
||
|
|
Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-tabhetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- end accrodions style two -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- accrodions style four -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
|
||
|
|
<div class="section-block">
|
||
|
|
<h5 class="section-title">Accordions with Color</h5>
|
||
|
|
<p>Takes the basic nav from above and adds the .nav-tabs class to generate a tabbed interface..</p>
|
||
|
|
</div>
|
||
|
|
<div class="accrodion-regular">
|
||
|
|
<div id="accordion4">
|
||
|
|
<div class="card bg-primary">
|
||
|
|
<div class="card-header" id="headingTen">
|
||
|
|
<h5 class="mb-0">
|
||
|
|
<button class="btn btn-link text-white" data-toggle="collapse" data-target="#collapseTen" aria-expanded="true" aria-controls="collapseTen">
|
||
|
|
<span class="fas fa-angle-down mr-3"></span>Accordion Heading Title Here
|
||
|
|
</button>
|
||
|
|
</h5>
|
||
|
|
</div>
|
||
|
|
<div id="collapseTen" class="collapse show" aria-labelledby="headingTen" data-parent="#accordion4">
|
||
|
|
<div class="card-body">
|
||
|
|
<p class="lead text-white"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch.</p>
|
||
|
|
<p> Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.</p>
|
||
|
|
<a href="#" class="btn btn-secondary">Go somewhere</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="card bg-brand ">
|
||
|
|
<div class="card-header" id="headingEleven">
|
||
|
|
<h5 class="mb-0">
|
||
|
|
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEleven" aria-expanded="false" aria-controls="collapseEleven">
|
||
|
|
<span class="fas fa-angle-down mr-3"></span>Accordion Heading Title Here
|
||
|
|
</button> </h5>
|
||
|
|
</div>
|
||
|
|
<div id="collapseEleven" class="collapse" aria-labelledby="headingEleven" data-parent="#accordion4">
|
||
|
|
<div class="card-body">
|
||
|
|
Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="card bg-secondary">
|
||
|
|
<div class="card-header" id="headingTwelve">
|
||
|
|
<h5 class="mb-0">
|
||
|
|
<button class="btn btn-link collapsed text-white" data-toggle="collapse" data-target="#collapseTwelve" aria-expanded="false" aria-controls="collapseTwelve">
|
||
|
|
<span class="fas fa-angle-down mr-3"></span>Accordion Heading Title Here
|
||
|
|
</button>
|
||
|
|
</h5>
|
||
|
|
</div>
|
||
|
|
<div id="collapseTwelve" class="collapse" aria-labelledby="headingTwelve" data-parent="#accordion4">
|
||
|
|
<div class="card-body">
|
||
|
|
Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-tabhetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- end accrodions style four -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- footer -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<div class="footer">
|
||
|
|
<div class="container-fluid">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
|
||
|
|
Copyright © 2018 Concept. All rights reserved. Dashboard by <a href="https://colorlib.com/wp/">Colorlib</a>.
|
||
|
|
</div>
|
||
|
|
<div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
|
||
|
|
<div class="text-md-right footer-links d-none d-sm-block">
|
||
|
|
<a href="javascript: void(0);">About</a>
|
||
|
|
<a href="javascript: void(0);">Support</a>
|
||
|
|
<a href="javascript: void(0);">Contact Us</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- end footer -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
</div>
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- end wrapper -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
</div>
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- end main wrapper -->
|
||
|
|
<!-- ============================================================== -->
|
||
|
|
<!-- Optional JavaScript -->
|
||
|
|
<script src="../assets/vendor/jquery/jquery-3.3.1.min.js"></script>
|
||
|
|
<script src="../assets/vendor/bootstrap/js/bootstrap.bundle.js"></script>
|
||
|
|
<script src="../assets/vendor/slimscroll/jquery.slimscroll.js"></script>
|
||
|
|
<script src="../assets/libs/js/main-js.js"></script>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
$('.collapse').on('shown.bs.collapse', function() {
|
||
|
|
$(this).parent().find(".fa-angle-down").removeClass("fa-angle-down").addClass("fa-angle-up");
|
||
|
|
}).on('hidden.bs.collapse', function() {
|
||
|
|
$(this).parent().find(".fa-angle-up").removeClass("fa-angle-up").addClass("fa-angle-down");
|
||
|
|
});
|
||
|
|
|
||
|
|
$('.panel-heading a').click(function() {
|
||
|
|
$('.panel-heading').removeClass('active');
|
||
|
|
|
||
|
|
//If the panel was open and would be closed by this click, do not active it
|
||
|
|
if (!$(this).closest('.panel').find('.panel-collapse').hasClass('in'))
|
||
|
|
$(this).parents('.panel-heading').addClass('active');
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
|
||
|
|
|
||
|
|
<!-- Mirrored from technext.github.io/concept/pages/accordions.html by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 09 Oct 2021 09:53:30 GMT -->
|
||
|
|
</html>
|