Mini Kabibi Habibi

layout TModernNewActionDialog {
    constant:
        kTitle: "$$$/Actions/NewAction=New Action";
        kSeparatorHeight: 2;
        kMargin: 30;
        kSave: "$$$/Actions/Save=Save";
        kCancel: "$$$/Actions/Cancel=Cancel";
        thumbnail_dim: 110;
        vPopupID : 3224;
        vColorID : 3225;
        text_width: 208;

    view TModernNewActionDialog(name: kTitle, margin: 35, width: 495) {

            row(horizontal: align_center,
                    spacing: kMargin)
            {
                column(horizontal: align_fill, spacing: 8, child_horizontal: align_center)
                {
                    overlay()
                    {
                        RoundedIconImageView(horizontal: align_fill, identifier: @placeholderIconThumbnail, iconRootName : 'ActionNewThumbnail',
                                            width: thumbnail_dim, height: thumbnail_dim);
                        
                        icon_document_thumbnail_view(horizontal: align_fill, identifier: @docThumbnail, width: thumbnail_dim, height: thumbnail_dim);
                        
                    }
                
                    row(horizontal: align_fill)
                    {
                        TIconButton(identifier: @action_upload_image,
                                        name: '$$$/Actions/NewAction/Upload=Upload image',
                                        layoverText: '$$$/Actions/NewAction/Upload=Upload image',
                                        layoverTextPosition: align_center,
                                        width: thumbnail_dim,
                                        height: 27,
                                        dataType: 'int32',
                                        useDefaultIcon: false,
                                        fontColorFromTheme: true,
                                        frame:               2,
                                        button_style: 'context_bar');
                        
                    }

                    row(horizontal:align_fill)
                    {
                        TFlyoutTextButton(
                            identifier: @actionChooseIconButton,
                            name: '$$$/Actions/NewAction/Choose=Choose icon',
                            layoverTextPosition: align_center,
                            fontColorFromTheme: true,
                            frame:               2,
                            vertical: align_center,
                            button_style: 'iconButton')
                        {
                            TCustomDrawFlyoutControl(
                                identifier : 'gfly',
                                horizontal: align_fill,
                                height : 27,
                                width : thumbnail_dim,
                                vertical : align_center);
                        }
                    }

                }

                column(spacing: 10, margin: [5, 0, 0, 0]) {
                    row(horizontal: align_fill, child_vertical: align_center)
                    {
                        TStaticText(horizontal: align_left,
                            name: '$$$/Actions/NewAction/Name=Name:');
                
                        TEditText(identifier: 'name', horizontal: align_fill, width: text_width, lines: 1);
                    }

                    row(horizontal: align_fill, child_vertical: align_center)
                    {
                        TStaticText(horizontal: align_left, vertical: align_top,
                            name: '$$$/Actions/NewAction/Description=Description:');
                
                        TEditText(identifier: @action_desc, 
                                default: '$$$/Actions/NewAction/DefaultDesc=Add more details',
                                horizontal: align_fill, width: text_width, lines: 3, maxChars: 128);
                    }
                    
                    row(horizontal: align_fill, child_vertical: align_center)
                    {
                            
                        TStaticText(horizontal: align_left,
                            name: '$$$/Menu/CommandColors=&Color:');

                        ZMenuPopup(identifier: 'colr',
                            resourceIdentifier: vColorID,
                            horizontal: align_fill);
                
                    }
                    
                    row(horizontal: align_fill, child_vertical: align_center)
                    {
                            
                        TStaticText(horizontal: align_left,
                            name: '$$$/Menu/CommandKeysFun=Keyboard shortcut:');

                        TPopup(identifier: 'fkey',
                            resourceIdentifier: vPopupID,
                            horizontal: align_fill);
                
                    }
                    
                    row (horizontal: align_fill, child_vertical: align_center)
                        {
                        TCheckBox(identifier : 'shif',
                            name : "$$$/Actions/NewAction/Shift=Shift");
                        TCheckBox(identifier : 'comm',
                            name : "$$$/Actions/NewAction/Cmd=Command");
                        }
                }
            
                
            }

            row(vertical: align_bottom, horizontal: align_fill) {
                TButton(name: kCancel, identifier: @cancel, horizontal: align_right, width: 40, dismiss: true);
                TButton(name: kSave, identifier: @ok, horizontal: align_right, default: true, width: 40, dismiss: true);
            }

            
        }
}