0

我正在使用 TinyMCE 5.6.2，我有一个自定义对话框的奇怪错误。我将其设置为大尺寸，并带有内容的选项卡面板。我有一个标题和两个按钮设置。当对话框打开时，按钮被按下，这样您就可以看到顶部的几个像素。它看起来像一些媒体断点问题，因为当我调整窗口大小时，按钮在 654 像素及以下的高度完全可见。

我怎样才能让这些按钮一直显示？

    tinymce.PluginManager.add('imageGallery', function (editor, url){
        editor.ui.registry.addButton('imageGallery', {
            icon: 'gallery',
            tooltip: 'Image Gallery',
            onAction: function() {
                editor.windowManager.open({
                    title: 'Image Gallery',
                    size: 'large',
                    body: {
                        type: 'tabpanel',
                        tabs:[
                            {
                                name: 'upload',
                                title: 'Upload',
                                items: [
                                    {
                                        type: 'dropzone',
                                        name: 'dropzone'
                                    }
                                ]
                            },
                            {
                                name: 'site',
                                title: 'My Images',
                                items: [
                                    {
                                        type: 'htmlpanel',
                                        html: '<div id="myImages" class="img-flex-grid"></div>'
                                    }
                                ]
                            },
                            {
                                name: 'shared',
                                title: 'Shared',
                                items: [ 
                                    {
                                        type: 'htmlpanel',
                                        html: '<div id="sharedCategories" style="float: left; min-width: 150px; background-color: lightgray; font-size: 14px; color: rgba(34,47,62,.7);"></div><div id="sharedImages" class="img-flex-grid" style="float: right; width: 900px"></div>'
                                    }
                                ]
                            },
                        ],
                        
                    },
                    buttons: [
                        {
                            type: 'submit',
                            text: 'Select',
                            name: 'select',
                            disabled: true,
                            primary: true,
                        },
                        {
                            type: 'cancel',
                            text: 'Close'
                    }],
                    onChange: function(dialogInstance, details) {
                        handleInputChange(dialogInstance, details);
                    },
                    onSubmit: function() {
                        handleSubmit();
                    },
                    onTabChange: function(dialogInstance, details) {
                        handleMainTabChange(dialogInstance, details.newTabName)
                    }
                });
            }
        });
    }
4

1 回答 1

0

如果其他人遇到这个问题，我必须重写一个 CSS 类。因为我通过 CDN 访问 TinyMCE，所以我看不到创建自定义皮肤或主题的方法。这是我添加到我的 CSS 文件中的代码。

.tox-dialog--width-lg {
    min-height: 650px !important;
    height: auto !important;
}
于 2021-01-21T20:36:00.380 回答