Open neoshamangames opened 6 years ago
I also have this problem?
I have a somewhat related issue.
I noticed that to write in the editor, the user must click in ql-editor
element, which wraps the content and is very small in the beginning. I tried expanding it by applying styles to it but it seems like you can't access the rendered elements.
of course you can. example:
.quill-editor-normal {
.ql-container,
.ql-editor {
max-height: 250px;
}
.ql-toolbar {
line-height: 1.5;
}
}
.quill-editor-disabled {
img {
pointer-events: none;
}
.ql-toolbar {
display: none;
}
.ql-container {
border-top: 1px solid #ccc !important;
}
}
we expected the [data-vXXXX] attribute only applied to the first class.
but if scoped style apply to last class name(no effect), you should use deep selector, you can see vue-loader doc. this feature is valid after vue-loader V11.2.0
https://vue-loader.vuejs.org/guide/scoped-css.html#child-component-root-elements
vue@2.5.17 vue-quill-editor@3.0.6
Here is my .vue:
The expected result is that the toolbar be red and the container be purple. Instead I am seeing both as cyan. When I look in Chrome's Developer Console, I can see that my css is being applied to .quill-editor but not to .ql-container or .ql-toolbar.
Thanks for any and all help.