angularprimengquillng-style

PrimeNg Editor doesn't resize (angular 2)


I currently working on an Editor for an Angular 2 app and I'm having issues resizing it. In my code I alter the width property however it only reduces the body of the editor and not the toolbar, is there any way this can be altered as well?

<p-editor [(ngModel)]='text' [style]="{'height':'320px', 'width': '200px'}">

enter image description here


Solution

  • The PrimeNG editor wraps Quill. Documentation for the PrimeNG element.

    The style attribute is only applied to the container. So the height in your example won't affect the toolbar.

    The PrimeNG docs says that you can use the ui-editor-toolbar class to style the toolbar. You can probably use the Quill class ql-toolbar as well.

    You can change the style of the toolbar with CSS. For example, change the padding of the toolbar from 8px to 2px. You can't just automatically change the height of the toolbar.