moving open/close+ icon in accordion header – Themeco Community

moving open/close+ icon in accordion header

nataliapinzon — Thu, 30 Jul 2015 22:17:15 +0000

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!

Reply To: moving open/close+ icon in accordion header

Rue Nel — Fri, 31 Jul 2015 03:50:29 +0000

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.

Reply To: moving open/close+ icon in accordion header

nataliapinzon — Fri, 31 Jul 2015 04:14:06 +0000

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

Reply To: moving open/close+ icon in accordion header

nataliapinzon — Fri, 31 Jul 2015 04:14:48 +0000

This reply has been marked as private.

Reply To: moving open/close+ icon in accordion header

nataliapinzon — Fri, 31 Jul 2015 04:21:41 +0000

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

Reply To: moving open/close+ icon in accordion header

Rupok — Fri, 31 Jul 2015 05:42:41 +0000

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!