Repeating Group Shadow

Hello,

I got one problem with repeating group, when I put some content in it, and add a shadow to these content it cannot go outside of the box, is there any way to prevent this and allow shadow to go outside? As you can see on included image there is a line and this line is the beggining of the RG.
image

Hi Kamil,
You can make the shadow “overflow” by adding a HTML element nearby and enter the below Class style:

.SPILL{ overflow: visible!important; } Then enter the Class name to the element ID field: {addClass: "SPILL"} I hope that helps
5 Likes

Thank you, this helped me a lot!

Hi @hauke.rux and @dean2 I tried a few variations of this and still can’t get it to work. Do you put the class name on the RG or on the object within the RG?

And is this what the html looks like in the html element?

<style>
    .SPILL {
      overflow: visible !important;
    }
  </style>

Hi Arensbpa,

This should only be considered as a last resort spilling can cause other undesirable problems.

try making the container bigger than the child by adding padding on the container or margin to the child.

If you do want to make this work:

  • make sure you have the “Classify” plugin added to your app.
  • Add the class to the parent and any other parent you want the show to go through by putting {addClass: “spill”} in the ID attribute field of the parents.
  • add a HTML just like you typed exactly

if you still have issues please show some screen shots.

Cheers

Thanks @dean2 ! It works beautifully! Only place i’ve seen issues with it is on horizontal scrolling repeating groups, the RG no longer gets contained. I’ve tried setting “flex-wrap: nowrap;” but still get an RG that loads all items instead of fitting to the width of the screen. Is this is lost cause?