While customizing the experience with Quill, you may need to add some HTML in the toolbar content. This is a behavior 100% supported by Quill and it's awesome!
What is not so awesome however is that the toolbar buttons are reset using selectors like .toolbar button. It means it will override entirely the CSS of your app... Even for the code you added! You will need to duplicate your CSS code, especially for Quill buttons.
Solution
The toolbar should add classes to its buttons so the themes do not target all buttons but only those managed by Quill!
Problem
While customizing the experience with Quill, you may need to add some HTML in the toolbar content. This is a behavior 100% supported by Quill and it's awesome!
What is not so awesome however is that the toolbar buttons are reset using selectors like
.toolbar button. It means it will override entirely the CSS of your app... Even for the code you added! You will need to duplicate your CSS code, especially for Quill buttons.Solution
The toolbar should add classes to its buttons so the themes do not target all buttons but only those managed by Quill!
Side information
Version: Quill v2. Browser(s): All. Code proposal: https://github.com/slab/quill/pull/4282