Change the width of a PopUp

Popup windows have a fixed width of 900 px by default, but it is possible to modify this value and customize the popup.

You can assign both a Fixed Width and a Minimum Width to the pop-up, for this, we identify the class that assigns this "Width". In our example to identify the class, we use the browser's inspect option:

We see that the class that assigns a "min-width: 900px;" is "gx-popup-document".

In order to modify this class, we have to enter from WorkWithPlusTheme, where we identify the class "gx-popup-document". In the case that it is not found, it can be created from Custom >> Add Class:

In the class, we can assign a "min-width" for a minimum width that we want, or a "width: auto" if we want it to adapt to the size of the content. In addition, it will be important to add these properties 

in "Custom Properties" with the rule "!Important" to overwrite any class that assigns a width to the pop-up:

min-width: 1200px !important;   

If you use Design System Object simply add the class as shown in the image:

Then we save the changes and execute, the result is this:

Other properties, which are usually assigned to this class are "width: auto" (So that the popup fits the content), "Overflow: hidden" (So that the popup hasn't scroll).

0 Votos