Feat: Added styling in accordion

This commit is contained in:
iampratiktandel 2020-06-20 21:14:55 +05:30
parent 6a6b9be38c
commit 283decc818
2 changed files with 44 additions and 20 deletions

View file

@ -136,6 +136,19 @@ nav {
.dropdown-item {
color: white;
}
/* roadmap styling */
#accordion a {
display: block;
background-color: rgb(3, 76, 105);
}
#accordion a:hover {
color: #25d9e0;
}
/* /roadmap styling */
*/
/* /Special Branded Color Classes*/
/* hr Style for heading*/

View file

@ -82,15 +82,17 @@
<div class="row">
<!--main-column-->
<div class="col-lg-10 col-xl-8 offset-sm-0 offset-md-0 offset-lg-1 offset-xl-2">
<!--roadmap-accordion-->
<div id="accordion">
<!--already-completed-->
<div class="lbry-dark">
<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">
<h2 class="mb-0">
<a class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Already Completed
</button>
</h5>
</a>
</h2>
</div>
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
@ -156,13 +158,16 @@
</div>
</div>
</div>
<!--/already-completed-->
<!--adminstrative-challenges-->
<div class="lbry-dark">
<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">
<h2 class="mb-0">
<a class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
Administrative Challenges
</button>
</h5>
</a>
</h2>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
<div class="card-body">
@ -176,13 +181,16 @@
</div>
</div>
</div>
<!--/adminstrative-challenges-->
<!--technical-challenges-->
<div class="lbry-dark">
<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">
<h2 class="mb-0">
<a class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
Technical Challenges
</button>
</h5>
</a>
</h2>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordion">
<div class="card-body">
@ -193,13 +201,16 @@
</div>
</div>
</div>
<!--/technical-challenges-->
<!--marketing-challenges-->
<div class="lbry-dark">
<div class="card-header" id="headingFour">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
<h2 class="mb-0">
<a class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
Marketing and Outreach Challenges
</button>
</h5>
</a>
</h2>
</div>
<div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#accordion">
<div class="card-body">
@ -221,11 +232,11 @@
</div>
</div>
</div>
<!--/marketing-challenges-->
</div>
<!--/roadmap-accordion-->
</div>
<!--main-column-->
<!--/main-column-->
</div>
<!--/main-row-->
</div>