Extra padding on ADG3 dialog

Atlassian Ecosystem Design
, ,
1

Creating a fullscreen dialog on a jira cloud instance with the new ADG3 enabled leaves some extra margins.
Is there a way to get rid of those ? (it was looking fine before the new UI)

I’m creating the dialog like this:

AP.require('dialog', function(dialog) {
            dialog.create({
                key: 'load-content',
                //size: "maximum",
                width: "100%",
                height: "100%",
                chrome: false
            });
        });

(I’ve tried with both size maximum and width/height 100%)

but the dialog content div (id = aui-dialog2-content) gets some extra padding from this css:

.adg3 .aui-dialog2 .aui-dialog2-content {
    padding: 0 24px;
}

Anyone else ran into this issue ?

–
Mihai

2 Likes
2

Hi,

I have also noticed this extra padding and i really doubt there is a way to remove it since its outside of the iframe, unless there is an option in the dialog to disable it.

Would be nice to have this extra padding being something optional or even disable when the option chrome on the dialog is set to false.

Thank you,
André Rodrigues

3 
<div id="ac-iframe-options" data-options="margin:false"></div>

See https://developer.atlassian.com/static/connect/docs/latest/concepts/javascript-api.html#options

1 Like
4

We already use the data-options=“margin:false” on the iframe that’s contained in the dialog. The thing is, that extra padding in not added to the iframe, but to the dialog content itself (div that contains our iframe).
I feel like this is either a bug for the crome:false flag, or a new config parameter when the dialog is created - a param that I’m not aware of :slight_smile:

5

Should I open up a ticket for this issue on the New JIRA UI component https://ecosystem.atlassian.net/browse/ACJIRA-1281?jql=project%20%3D%20ACJIRA%20AND%20component%20%3D%20"New%20JIRA%20UI" ?
Or is there a workaround ? Or maybe I’m just missing some parameter to the dialog ?

Thank you,
Mihai

6

@mihai did you find any solution to this? I have the same issue and other people are having the same issue on standard pages https://community.developer.atlassian.com/t/hard-margins-on-add-ons-iframe-is-it-necessary/6752

Hope there will be a workaround for this soon.

7

No solution yet but I’ve created a new ticket for this:
https://ecosystem.atlassian.net/browse/ACJIRA-1314

1 Like
8

I ran into this today, in relation to a dialog that is not full-screen. Here’s the culprit:

.adg3 .aui-dialog2 .aui-dialog2-content {
    padding: 0 24px;
}

I thought this had been fixed years ago.