Carats in Accordion Widget not Acting Properly

Builder content link

The carats in the accordion widget appearing on one of our landing pages are not acting properly. When the first or second carat is selected, the carat disappears and the accordion opens like normal. However, when either the third or fourth carat is selected, both carats disappear. We don’t want this to look this way but all the carats are set up the same way in the settings and I’m not sure why this is happening.


Hi @jvejvoda,

To resolve this you will have to use a different state for the fourth accordion item, we see you are using state.accordionActive3 currently for the fourth item

For reference, kindly refer to the below loom

Thank you so much @manish-sharma! Everything is working as expected

Hey @manish-sharma the team discovered one more issue. The start state of the arrows in the accordion is wrong, they point up on first page load and then if the accordion is opened then closed, they point down. Is there any way to change it so that they all point down consistently when closed?

Hi @jvejvoda,

You can change the color of the arrow from ‘white’ to ‘black’ by changing the style.color under the data tab element binding option, if you wish to show the arrow when accordion items are open and to change the starting position of the arrow change style.transform property for the arrow layer state.accordionActive ? 'rotate(0deg)' : 'rotate(-180deg)'

You may also find help at our forum post