mirror of https://github.com/ColorlibHQ/gentelella
accordion fix / vertical tabs fix
parent
ef52d29cf6
commit
6b445df90c
|
@ -1130,20 +1130,20 @@ article.media {
|
|||
font-size: 20px;
|
||||
}
|
||||
|
||||
.accordion .panel {
|
||||
.accordion .card {
|
||||
margin-bottom: 5px;
|
||||
border-radius: 0;
|
||||
border-bottom: 1px solid #efefef;
|
||||
}
|
||||
|
||||
.accordion .panel-heading {
|
||||
/* TODO to be deleted */
|
||||
/*.accordion .card-title {
|
||||
background: #F2F5F7;
|
||||
padding: 13px;
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
}*/
|
||||
|
||||
.accordion .panel:hover {
|
||||
.accordion .card:hover {
|
||||
background: #F2F5F7;
|
||||
}
|
||||
|
||||
|
|
|
@ -567,19 +567,19 @@
|
|||
</div>
|
||||
<div class="x_content">
|
||||
<div class="row">
|
||||
<div class="col-md-2">
|
||||
<div class="col-md-2 col-sm-4 col-4">
|
||||
<p>Display value</p>
|
||||
<input class="knob" data-width="100" data-height="120"
|
||||
data-min="-100"
|
||||
data-displayPrevious=true data-fgColor="#26B99A" value="44">
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<div class="col-md-2 col-sm-4 col-4">
|
||||
<p>× 'cursor' mode</p>
|
||||
<input class="knob" data-width="100" data-height="120"
|
||||
data-cursor=true
|
||||
data-fgColor="#34495E" value="29">
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<div class="col-md-2 col-sm-4 col-4">
|
||||
<p>Step 0.1</p>
|
||||
<input class="knob" data-width="100" data-height="120"
|
||||
data-min="-10000"
|
||||
|
@ -587,21 +587,21 @@
|
|||
data-max="10000"
|
||||
data-step=".1" value="0">
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<div class="col-md-2 col-sm-4 col-4">
|
||||
<p>Angle arc</p>
|
||||
<input class="knob" data-width="100" data-height="120"
|
||||
data-angleOffset=-125
|
||||
data-angleArc=250 data-fgColor="#34495E"
|
||||
data-rotation="anticlockwise" value="35">
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<div class="col-md-2 col-sm-4 col-4">
|
||||
<p>Alternate design</p>
|
||||
<input class="knob" data-width="110" data-height="120"
|
||||
data-displayPrevious=true data-fgColor="#26B99A"
|
||||
data-skin="tron"
|
||||
data-thickness=".2" value="75">
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<div class="col-md-2 col-sm-4 col-4">
|
||||
<p>Angle offset</p>
|
||||
<input class="knob" data-width="100" data-height="120"
|
||||
data-angleOffset=90
|
||||
|
|
|
@ -403,7 +403,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
|
@ -500,7 +499,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
|
@ -598,7 +596,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
|
@ -626,22 +623,25 @@
|
|||
</div>
|
||||
<div class="x_content">
|
||||
<div class="row">
|
||||
<div class="col-md-2">
|
||||
<div class="col-md-2 col-sm-2 col-3">
|
||||
<!-- required for floating -->
|
||||
<!-- Nav tabs -->
|
||||
<ul class="nav nav-tabs tabs-left flex-column" role="tablist">
|
||||
<li class="nav-item"><a class="nav-link active" href="#home" data-toggle="tab">Home</a>
|
||||
<li class="nav-item"><a class="nav-link active" href="#home"
|
||||
data-toggle="tab">Home</a>
|
||||
</li>
|
||||
<li class="nav-item"><a class="nav-link" href="#profile" data-toggle="tab">Profile</a>
|
||||
<li class="nav-item"><a class="nav-link" href="#profile"
|
||||
data-toggle="tab">Profile</a>
|
||||
</li>
|
||||
<li class="nav-item"><a class="nav-link" href="#messages" data-toggle="tab">Messages</a>
|
||||
<li class="nav-item"><a class="nav-link" href="#messages"
|
||||
data-toggle="tab">Messages</a>
|
||||
</li>
|
||||
<li class="nav-item"><a class="nav-link" href="#settings" data-toggle="tab">Settings</a>
|
||||
<li class="nav-item"><a class="nav-link" href="#settings"
|
||||
data-toggle="tab">Settings</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-md-10">
|
||||
<div class="col-md-10 col-sm-10 col-9">
|
||||
<!-- Tab panes -->
|
||||
<div class="tab-content">
|
||||
<div class="tab-pane active" id="home">
|
||||
|
@ -665,7 +665,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
|
@ -693,7 +692,7 @@
|
|||
</div>
|
||||
<div class="x_content">
|
||||
<div class="row">
|
||||
<div class="col-md-10">
|
||||
<div class="col-md-10 col-sm-10 col-9">
|
||||
<!-- Tab panes -->
|
||||
<div class="tab-content">
|
||||
<div class="tab-pane active" id="home-r">
|
||||
|
@ -713,17 +712,21 @@
|
|||
<div class="tab-pane" id="settings-r">Settings Tab.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<div class="col-md-2 col-sm-2 col-3">
|
||||
<!-- required for floating -->
|
||||
<!-- Nav tabs -->
|
||||
<ul class="nav nav-tabs flex-column tabs-right">
|
||||
<li class="nav-item"><a class="active nav-link" href="#home-r" data-toggle="tab">Home</a>
|
||||
<li class="nav-item"><a class="active nav-link" href="#home-r"
|
||||
data-toggle="tab">Home</a>
|
||||
</li>
|
||||
<li class="nav-item"><a class="nav-link" href="#profile-r" data-toggle="tab">Profile</a>
|
||||
<li class="nav-item"><a class="nav-link" href="#profile-r"
|
||||
data-toggle="tab">Profile</a>
|
||||
</li>
|
||||
<li class="nav-item"><a class="nav-link" href="#messages-r" data-toggle="tab">Messages</a>
|
||||
<li class="nav-item"><a class="nav-link" href="#messages-r"
|
||||
data-toggle="tab">Messages</a>
|
||||
</li>
|
||||
<li class="nav-item"><a class="nav-link" href="#settings-r" data-toggle="tab">Settings</a>
|
||||
<li class="nav-item"><a class="nav-link" href="#settings-r"
|
||||
data-toggle="tab">Settings</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
@ -732,7 +735,6 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
|
@ -763,12 +765,14 @@
|
|||
<!-- start accordion -->
|
||||
<div class="accordion" id="accordion" role="tablist"
|
||||
aria-multiselectable="true">
|
||||
<div class="panel">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<a class="panel-heading" role="tab" id="headingOne"
|
||||
data-toggle="collapse"
|
||||
data-parent="#accordion" href="#collapseOne" aria-expanded="true"
|
||||
data-parent="#accordion" href="#collapseOne"
|
||||
aria-expanded="true"
|
||||
aria-controls="collapseOne">
|
||||
<h4 class="panel-title">Collapsible Group Items #1</h4>
|
||||
<h4 class="card-title">Collapsible Group Items #1</h4>
|
||||
</a>
|
||||
<div id="collapseOne" class="panel-collapse collapse in"
|
||||
role="tabpanel"
|
||||
|
@ -807,12 +811,14 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel">
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<a class="panel-heading collapsed" role="tab" id="headingTwo"
|
||||
data-toggle="collapse" data-parent="#accordion"
|
||||
href="#collapseTwo"
|
||||
aria-expanded="false" aria-controls="collapseTwo">
|
||||
<h4 class="panel-title">Collapsible Group Items #2</h4>
|
||||
<h4 class="card-title">Collapsible Group Items #2</h4>
|
||||
</a>
|
||||
<div id="collapseTwo" class="panel-collapse collapse"
|
||||
role="tabpanel"
|
||||
|
@ -820,22 +826,26 @@
|
|||
<div class="panel-body">
|
||||
<p><strong>Collapsible Item 2 data</strong>
|
||||
</p>
|
||||
Anim pariatur cliche reprehenderit, enim eiusmod high life
|
||||
Anim pariatur cliche reprehenderit, enim eiusmod high
|
||||
life
|
||||
accusamus
|
||||
terry richardson ad squid. 3 wolf moon officia aute, non
|
||||
cupidatat
|
||||
skateboard dolor brunch. Food truck quinoa nesciunt laborum
|
||||
skateboard dolor brunch. Food truck quinoa nesciunt
|
||||
laborum
|
||||
eiusmod.
|
||||
Brunch 3 wolf moon tempor,
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel">
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<a class="panel-heading collapsed" role="tab" id="headingThree"
|
||||
data-toggle="collapse" data-parent="#accordion"
|
||||
href="#collapseThree"
|
||||
aria-expanded="false" aria-controls="collapseThree">
|
||||
<h4 class="panel-title">Collapsible Group Items #3</h4>
|
||||
<h4 class="card-title">Collapsible Group Items #3</h4>
|
||||
</a>
|
||||
<div id="collapseThree" class="panel-collapse collapse"
|
||||
role="tabpanel"
|
||||
|
@ -843,24 +853,26 @@
|
|||
<div class="panel-body">
|
||||
<p><strong>Collapsible Item 3 data</strong>
|
||||
</p>
|
||||
Anim pariatur cliche reprehenderit, enim eiusmod high life
|
||||
Anim pariatur cliche reprehenderit, enim eiusmod high
|
||||
life
|
||||
accusamus
|
||||
terry richardson ad squid. 3 wolf moon officia aute, non
|
||||
cupidatat
|
||||
skateboard dolor brunch. Food truck quinoa nesciunt laborum
|
||||
skateboard dolor brunch. Food truck quinoa nesciunt
|
||||
laborum
|
||||
eiusmod.
|
||||
Brunch 3 wolf moon tempor
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end of accordion -->
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
|
@ -891,13 +903,14 @@
|
|||
<!-- start accordion -->
|
||||
<div class="accordion" id="accordion1" role="tablist"
|
||||
aria-multiselectable="true">
|
||||
<div class="panel">
|
||||
<a class="panel-heading" role="tab" id="headingOne1"
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<a class="card-title" role="tab" id="headingOne1"
|
||||
data-toggle="collapse"
|
||||
data-parent="#accordion1" href="#collapseOne1"
|
||||
aria-expanded="true"
|
||||
aria-controls="collapseOne">
|
||||
<h4 class="panel-title">Collapsible Group Item #1</h4>
|
||||
<h4 class="card-title">Collapsible Group Item #1</h4>
|
||||
</a>
|
||||
<div id="collapseOne1" class="panel-collapse collapse in"
|
||||
role="tabpanel"
|
||||
|
@ -936,12 +949,14 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<a class="panel-heading collapsed" role="tab" id="headingTwo1"
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<a class="card-title collapsed" role="tab" id="headingTwo1"
|
||||
data-toggle="collapse" data-parent="#accordion1"
|
||||
href="#collapseTwo1"
|
||||
aria-expanded="false" aria-controls="collapseTwo">
|
||||
<h4 class="panel-title">Collapsible Group Item #2</h4>
|
||||
<h4 class="card-title">Collapsible Group Item #2</h4>
|
||||
</a>
|
||||
<div id="collapseTwo1" class="panel-collapse collapse"
|
||||
role="tabpanel"
|
||||
|
@ -949,22 +964,26 @@
|
|||
<div class="panel-body">
|
||||
<p><strong>Collapsible Item 2 data</strong>
|
||||
</p>
|
||||
Anim pariatur cliche reprehenderit, enim eiusmod high life
|
||||
Anim pariatur cliche reprehenderit, enim eiusmod high
|
||||
life
|
||||
accusamus
|
||||
terry richardson ad squid. 3 wolf moon officia aute, non
|
||||
cupidatat
|
||||
skateboard dolor brunch. Food truck quinoa nesciunt laborum
|
||||
skateboard dolor brunch. Food truck quinoa nesciunt
|
||||
laborum
|
||||
eiusmod.
|
||||
Brunch 3 wolf moon tempor,
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<a class="panel-heading collapsed" role="tab" id="headingThree1"
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<a class="card-title collapsed" role="tab" id="headingThree1"
|
||||
data-toggle="collapse" data-parent="#accordion1"
|
||||
href="#collapseThree1"
|
||||
aria-expanded="false" aria-controls="collapseThree">
|
||||
<h4 class="panel-title">Collapsible Group Item #3</h4>
|
||||
<h4 class="card-title">Collapsible Group Item #3</h4>
|
||||
</a>
|
||||
<div id="collapseThree1" class="panel-collapse collapse"
|
||||
role="tabpanel"
|
||||
|
@ -972,24 +991,26 @@
|
|||
<div class="panel-body">
|
||||
<p><strong>Collapsible Item 3 data</strong>
|
||||
</p>
|
||||
Anim pariatur cliche reprehenderit, enim eiusmod high life
|
||||
Anim pariatur cliche reprehenderit, enim eiusmod high
|
||||
life
|
||||
accusamus
|
||||
terry richardson ad squid. 3 wolf moon officia aute, non
|
||||
cupidatat
|
||||
skateboard dolor brunch. Food truck quinoa nesciunt laborum
|
||||
skateboard dolor brunch. Food truck quinoa nesciunt
|
||||
laborum
|
||||
eiusmod.
|
||||
Brunch 3 wolf moon tempor
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end of accordion -->
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
|
@ -1050,7 +1071,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
|
@ -1104,8 +1124,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
|
@ -1219,7 +1237,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
|
@ -1260,7 +1277,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
|
@ -1382,7 +1398,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
|
@ -1501,7 +1516,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
|
@ -1691,8 +1705,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
<h2>Pop Overs
|
||||
|
@ -1759,8 +1772,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
<h2><i class="fa fa-align-left"></i> Progress bar
|
||||
|
@ -1965,7 +1977,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Start to do list -->
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
|
@ -2041,8 +2052,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<!-- End to do list -->
|
||||
|
||||
<div class="col-md-6">
|
||||
<div class="col-md-6 col-sm-6 col-12">
|
||||
<div class="x_panel">
|
||||
<div class="x_title">
|
||||
<h2>Daily active users
|
||||
|
|
|
@ -348,7 +348,7 @@
|
|||
</div>
|
||||
<div class="tiles">
|
||||
<div class="row">
|
||||
<div class="col-md-4 tile">
|
||||
<div class="col-md-4 tile col-sm-4 col-6">
|
||||
<span>Total Sessions</span>
|
||||
<h2>231,809</h2>
|
||||
<span class="sparkline11 graph" style="height: 160px;">
|
||||
|
@ -356,7 +356,7 @@
|
|||
style="display: inline-block; vertical-align: top; width: 94px; height: 30px;"></canvas>
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-md-4 tile">
|
||||
<div class="col-md-4 tile col-sm-4 col-6">
|
||||
<span>Total Revenue</span>
|
||||
<h2>$231,809</h2>
|
||||
<span class="sparkline22 graph" style="height: 160px;">
|
||||
|
@ -364,7 +364,7 @@
|
|||
style="display: inline-block; vertical-align: top; width: 94px; height: 30px;"></canvas>
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-md-4 tile">
|
||||
<div class="col-md-4 tile col-sm-4 col-6">
|
||||
<span>Total Sessions</span>
|
||||
<h2>231,809</h2>
|
||||
<span class="sparkline11 graph" style="height: 160px;">
|
||||
|
@ -514,17 +514,17 @@
|
|||
|
||||
<div class="col-md-5">
|
||||
<div class="row" style="text-align: center;">
|
||||
<div class="col-md-4">
|
||||
<div class="col-md-4 col-sm-4 col-4">
|
||||
<canvas class="canvasDoughnut" height="110" width="110"
|
||||
style="margin: 5px 10px 10px 0"></canvas>
|
||||
<h5 style="margin:0">Bounce Rates</h5>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="col-md-4 col-sm-4 col-4">
|
||||
<canvas class="canvasDoughnut" height="110" width="110"
|
||||
style="margin: 5px 10px 10px 0"></canvas>
|
||||
<h5 style="margin:0">New Traffic</h5>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="col-md-4 col-sm-4 col-4">
|
||||
<canvas class="canvasDoughnut" height="110" width="110"
|
||||
style="margin: 5px 10px 10px 0"></canvas>
|
||||
<h5 style="margin:0">Device Share</h5>
|
||||
|
|
Loading…
Reference in New Issue