Touch UI dialog | Set height and width

[Manender24]

How do we set height and width for Touch UI dialog?

I have more than five tabs in the dialog and fourth and fifth tabs are not displayed properly.

Also, resizing the dialog is not possible using mouse. Is there any configuration for this?

[smacdonald2008]

That is an excellent question. I am going to find out the answer for that and update this thread. As well - i am going to update this article:

Creating your first Adobe Experience Manager Touch UI component @ https://helpx.adobe.com/experience-manager/using/creating-touchui-component.html

[smacdonald2008 · Accepted solution]

Here is the answer to your question - you can control via code:

(function ($, $document) {

    "use strict";

    function adjustLayoutHeight(){

        //with only two selects, the second select drop down is not visible when expanded, so adjust the layout height

        //fixedcolumns i guess doesn't support property height, so fallback to jquery

        //http://docs.adobe.com/docs/en/aem/6-0/develop/ref/granite-ui/api/jcr_root/libs/granite/ui/components...

        $(".coral-FixedColumn-column").css("height", "18rem");

    }

    $document.on("dialog-ready", function() {

        adjustLayoutHeight();

    });

})($, $(document));

[teufeld]

Hi,

Someone wrote a clientlib to overlay the dialog layer.

Resizing Touch UI component dialogs | 6D Labs

In order to add the width and height parameter in the cq:dialog.

But I was wondering if Adobe wrote something similaire with the last version AEM 6.3 or do I have to create my own "overlay" thing ?

Thanks