Reduce popup on mobile

CSS Codes Popup
1

Add the code below to Custom CSS field on your Popup widget’s Settings tab:

@media(max-width: 500px){
  .global-styles, [class*="LayoutSlideIn__ModalContent-sc"], [class*="Popup__PopupCloseInsideInner-sc"] {
  transform: scale(0.9);
}
  .global-styles, [class^="Popup__PopupCloseInsideInner-sc"] {
    top:30px;
    right: 20px;
  }
}
1 Like
2

Hi Helga!

When using it, I get this white border around my pop up, do you know how to fix it?

Thank you for this code (and all your great ones on the platform!).

2 Likes
4

Hi there and welcome to the Community, @Digital_Media :waving_hand:

Thanks for flagging this up!

Here is an updated code that should work fine:

@media(max-width: 500px){
  .global-styles, [class*="LayoutSlideIn__ModalContent-sc"], [class*="Popup__PopupCloseInsideInner-sc"] {
  transform: scale(0.9);
}
  .global-styles, [class^="Popup__PopupCloseInsideInner-sc"] {
    top:30px;
    right: 20px;
  }
}

Please try it out and let us know how it works for you :slightly_smiling_face: