如何解决django-mdeditor在管理界面中弹窗变形问题

注意：下面的内容都不用看了，我制作了django5-mdeditor包，可以解决这个问题，具体可见django5-mdeditor

这两天对Django非常感兴趣，于是就想着写个Demo玩玩，结果在使用django-mdeditor插件的时候，出现了一些bug。

这应该是因为仓库年老失修导致的，具体如下图：

所有的弹窗都会出现类似的变形效果，非常的讨厌。

经过一系列艰难的搜索，发现网络上并没有对应的解决措施。

只好自己探究了一下，具体方法如下：

1. 在static/css目录下新建一个css文件，我这里就命名为admin_style.css，编辑内容如下：

.editormd-dialog {
    width: auto !important;
    height: auto !important;
}

2. 在你的 Django 应用中，编辑 admin.py 文件，通过 class Media 引入自定义 css。

例如：

from django.contrib import admin
from .models import ContentBase


@admin.register(ContentBase)
class ContentBaseAdmin(admin.ModelAdmin):
    class Media:
        css = {
            'all': ('css/admin_style.css',),
        }

    list_display = ('title', 'content')

3. 然后重启你的服务，就可以看到弹窗的大小就恢复正常了，如下：

到这里解决方案就结束了，下面是解决问题过程中的发现和思考。

探索这个解决方案的主要方法是，在研究mdeditor的html元素时，发现样式被直接写在了html上，具体如下图：

所以，我就在想，如果我能够重写这个样式，就可以解决这个问题了。

由于mdeditor是使用js生成的HTML，直接改代码，有点呆，于是就使用了Django的方式进行了解决。

后续计划将django-mdeditor库进行更新，从源头上解决问题。