CODEWITHSUNDEEP
quill
JGRojo
JGRojo

Reputation: 11

QuillJS 2.0 font size customization

I've been using QuillJS 1 for a while now and have customised several toolbar controls, including the font size. Now I have migrated to QuillJS 2, but the custom font size control does not work. Checking the documentation and debugging the generated html code, I see that when selecting the default QuillJS sizes (normal, large, huge...) a stylo is applied on the selected text, ‘ql-size-large’. With my customisation of font size to numerical sizes, 10pt, 12pt.... no such stylo is applied. Moreover, when debugging the execution I notice that the corresponding delta arrives without the ‘size’ attribute.

This is my custom js and html

this.options = ['2pt', '3pt', '4pt', '10px', '12px', '14px', 'large', 'huge'];
    const Size = Quill.import('attributors/style/size');
    Size['whitelist'] = this.options;
    Quill.register('attributors/style/size', Size, true);

      <select class="ql-size">
        <option value="2pt">4 pt</option>
        <option value="3pt">3 pt</option>
        <option value="4pt">4 pt</option>
        <option value="10px">10px</option>
        <option value="12px">12px</option>
        <option value="14px">14px</option>
        <option value="large">large</option>
        <option value="huge">huge</option>
      </select>

With these options ‘large’ and ‘huge’ work well, but not the others.

Upvotes: 1

Views: 41

Answers (0)

Related Questions