CODEWITHSUNDEEP
quill
vgbcell
vgbcell

Reputation: 199

How to remove black background color for Quill codeblocks

When you enter a code block in the Quill editor, you get white text on a black background for that code block. How do you remove this styling? I'd rather have my normal black font color with a lighter background color.

Upvotes: 3

Views: 2679

Answers (2)

Lutz Büch
Lutz Büch

Reputation: 363

Depending on the theme you use, you will find the settings in the according CSS file, e.g., quill.snow.css or quill.bubble.css:

.ql-snow .ql-editor pre.ql-syntax {
  background-color: #23241f; /* <== change this color */ 
  color: #f8f8f2;
  overflow: visible;
}

Upvotes: 2

jhchen
jhchen

Reputation: 14767

Quill's syntax highlighting is using highlight.js so you can just use a different theme that is more to your liking. If you would like to disable syntax highlighting altogether then you should omit the syntax module on initialization:

new Quill(container, {
  modules: {
    // syntax: true    Don't add me
  }
});

Upvotes: 1

Related Questions