Topic: moving open/close+ icon in accordion header

Author

Posts
July 30, 2015 at 5:17 pm #345767

nataliapinzon
Participant

Dear X-theme Support,

How can I move the open/close icon to the bottom right hand corner of the accordion title/header? Ideally, I would like to change the icon to fa-plus-square in orange and have it rotate when open.

Thank you!

July 30, 2015 at 10:50 pm #345958
Rue Nel
Moderator
Hello There,

Thanks for writing in!

To move the open/close icon to the bottom right hand corner of the accordion title/header and change the icon to fa-plus-square in orange, have it rotate when open, please insert this code in your child theme’s style.css (if you are using a child theme)
```
.x-accordion-heading .x-accordion-toggle:before {
    float: right;
    margin-top: 4px;
    content: "\f0fe";
}

.x-accordion-heading .x-accordion-toggle:before,
.site .x-accordion-heading .x-accordion-toggle:hover:before {
    color: orange !important;
}
```
Please let us know if this works out for you.
July 30, 2015 at 11:14 pm #345976

nataliapinzon
Participant

perfect! only now I have two icons showing up because I am using two lines of text on the header.. any suggestions?

July 30, 2015 at 11:14 pm #345977

nataliapinzon
Participant

This reply has been marked as private.

July 30, 2015 at 11:21 pm #345986

nataliapinzon
Participant

I figured it out.. not sure how but problem solved – thank you

July 31, 2015 at 12:42 am #346044

Rupok
Member

You are welcome!

Glad that it solved. Feel free to let us know if you face any other issue. We’ll be happy to assist you.

Thanks for using X.

Cheers!
Author

Posts

<script> jQuery(function($){ $("#no-reply-345767 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>