Pixel-perfect styling of Popup Dialogs

[jsfan3]

This commit is the solution for https://stackoverflow.com/questions/63449222/problems-in-the-styling-of-a-popupdialog

It adds the method setUIIDByPopupPosition to use the UIIDs "PopupContentPaneDownwards", "PopupContentPaneUpwards", "PopupContentPaneRight", "PopupContentPaneLeft".

If this method is not explicitly invoked, the working of the code remains the same as before, ensuring backward compatibility.

Example of usage:

Dialog d = new Dialog(new BorderLayout());
if (DeviceUtilities.isAndroidTheme) d.setUIIDByPopupPosition(true);
d.add(BorderLayout.CENTER, dialogBody);
d.showPopupDialog(groupInfoBtn);

Example of CSS to get (almost) identical styling on iOS and Android, assuming that in the previous code I call d.setUIIDByPopupPosition(true) only on Android devices (this is not a requirement, it's my choice):

PopupDialog {
    padding: 1mm;
}

PopupDialogTitle {
    margin: 0px;
    padding: 0px;
}

@media platform-and {   
    PopupContentPaneDownwards {
        margin: 0px;
        padding: 1.5mm;
        padding-top: 3.0mm;
    }
    
    PopupContentPaneUpwards {
        margin: 0px;
        padding: 1.5mm;
    }
}

@media platform-ios { 
    PopupContentPane {
        margin: 0px;
        padding: 2.0mm;
        padding-top: 0px;
    }
}

Final note: the use of custom UIIDs for 'PopupContentPane' is safe, while the use of custom UIIDs for PopupDialog is not safe because it can break the UI (I experienced that, that's why my method sets custom UIIDs for 'PopupContentPane' only).

[shai-almog]

Thanks!