On mobile my group focus within my repeating groups will go off screen for certain elements. Is there anyway to keep a group focus always on screen?
Offsetting it based on screen width doesn’t really work here I don’t think as the RG goes from left to right and so one side need a certain offset different to the other.
Let me know someone if this works, whereas now i use workflow “if this condition is true” and setting up when (in my case) a popup is visible, to hide the FocusGroup.
Try adding this to either your app (Settings > Script in the Body) or the page (click the page in Elements Tree > Page HTML Header)
<style>
@media all and (max-width: 767px) {
.GroupFocus {
width: 95% !important; /*Or whatever % you want*/
max-width: unset !important;
left: 2.5% !important; /*This is just 100% minus width (above) divided by 2 to make it centered*/
}
}
</style>
So instead of this on mobile:
It should be centered like this:
If you just want it for a specific Group Focus, give the element an ID, and use #theElementIdYouUsed instead of .GroupFocus in the CSS above.