Accordion Border and Change Toggle Icon

[managet0p_xtheme]

Hello,
I need your assistance with the Classic Accordian icon.
I currently have the following issues:

1. Remove the border completely
2. Change the “+” icon to chevron-down
3. Move the new chevron-icon to “after” text

I have looked at a number of different threads and tried different CSS additions but nothing is working.
This is what I have tried:
.x-accordion-group {
border:none !important;
}

.x-accordion-heading .x-accordion-toggle:after {
font-family: “FontAwesome” !important;
font-weight: bold !important;
font-size: 200%;
content:"\f078";
}

.x-accordion-inner {
border:none !important;
…
I’ve also tried:
.accordion-opportunity .x-accordion-group {
border-color: #C7C6C6 !important;
}

This is what I am trying to achieve:

Hope you can help!
Thanks

[Prasant]

Hello @managet0p_xtheme,

Thanks for asking.

Please add following CSS under X > Launch > Options > CSS to change accordion styling:

.x-accordion-group {box-shadow: none !important;}

.x-accordion-heading .x-accordion-toggle:after {content: "\f107" !important;}

Thanks.

[managet0p_xtheme]

Thanks @Prasant,
the box-shadow worked perfect.
I did have problems with displaying the icon, but after adding font-family: “FontAwesome”; it works perfectly.

Many thanks for your assistance

[thai]

You’re welcome.