Changing quill editor background color when disabled

Question

I have this quill editor

Code:

<quill-editor
  style="height: 200px; margin-left: -48px; width: 109%"
  class="content-input qleditor"
  :options="options"
  :disabled="!form.isContentRequired"
  v-model="form.content_vn" />
<script>
options: {
        modules: {
          toolbar: [
            "bold",
            "italic",
            "underline",
            "clean",
            { align: [] },
          ],
        },
        placeholder: "Nhập nội dung",
        readOnly: false,
        theme: "snow",
      },
</script>

What I want is to change its background color when it's disabled, I have tried using css:

.qleditor[disabled] {
   background-color: gray;
}

It doesn't work like any other text editor. Is there any other way to achieve this?

The background color is the same both when the editor is enabled and disabled

Answer 1

This works for me:

.ql-editor[contenteditable=false] {
    background-color: grey;
}