Issue with collapsible row in mobile view

[georgie]

In the mobile view, I have the section called ‘Our products encourage’ set in a collapsible row. The row contains a swift slider slide show. But when viewed in a mobile browser, the row is already open by default (it should be closed). Also, the row doesn’t collapse on clicking the + icon. It just stays open. The other rows all work fine. Not able to figure out what is wrong.

[David Martin – Support]

By default it is closed for me, please clear your iPhone cache and re-test.

Thanks.

[georgie]

Hi David,

I had rebuilt the row element and it started working fine. But I didnt want to add a reply to this thread and move lower in the queue :). I have two more questions:

1.) Is it possible to change the colour of the title (only for the second collapsible row ‘our products encourage…’) to white? Since the row bg is blue.

2.) If you scroll lower down on the page and expand the ‘currently in store’ row, is it possible to centre align the add to cart button?

Thanks

[David Martin – Support]

1) Yes, add a custom class to the Row. You can then target title in the Row dropdown using that custom class/custom CSS.

2) You can tweak the CSS for the button with a media query, ex:

@media only screen and (max-width: 767px) {
.add-to-cart-shortcode {
    text-align: center;
    display: block;
}
.add-to-cart-shortcode>.add_to_cart_button {
  float: none;
}
}

[georgie]

Hi David, the code for cart button works fine. How do I enter the code for targeting row title in CSS? I am not familiar with writing code.

[David Martin – Support]

1) An example would be:

section.row.row-white-txt > a {
    color: #fff;
}

This assumes you add the class to row-white-txt to your Row.

[georgie]

Hi David,

This didn’t work for me for some reason. Is it because it is a collapsible row title and not a row header?

[David Martin – Support]

No, it will depend on where you added the class.

I do not see the class added if I view your source code looking for: row-white-txt. Please add it so I can debug further.