Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add a collapse icon in ngx-bootstrap Accordion

In my Angular app that is using ngx-bootstrap, I would like to add a collapse icon which reflects the status of the accordion (collapsed/expanded) like the following:

enter image description here

enter image description here

like image 821
Francesco Borzi Avatar asked Dec 04 '22 19:12

Francesco Borzi


1 Answers

You can basically do this in css :

.accordion-toggle[aria-expanded="true"]:before {
    content: "\f107";
    font: normal normal normal 14px/1 FontAwesome;
}

.accordion-toggle[aria-expanded="false"]:before {
    content: '\f106';
    font: normal normal normal 14px/1 FontAwesome;
}

Just have to style the before selector with the font familly of your favorite icon...

like image 67
BENARD Patrick Avatar answered Dec 11 '22 17:12

BENARD Patrick