[editor] Do not use the page width for the TextEditor dialog

This may destroy alignment of inputs and produce unwanted scrollbars.

projects/editor/src/app/services/dialog.service.ts

@@ -49,24 +49,22 @@ export class DialogService {
     return dialogRef.afterClosed();
   }
 
-  showRichTextEditDialog(text: string, defaultFontSize: number, width: number): Observable<string> {
+  showRichTextEditDialog(text: string, defaultFontSize: number): Observable<string> {
     const dialogRef = this.dialog.open(RichTextEditDialogComponent, {
       data: {
         content: text,
         defaultFontSize,
         clozeMode: false
       },
-      autoFocus: false,
-      width: `${width}px`
+      autoFocus: false
     });
     return dialogRef.afterClosed();
   }
 
-  showClozeTextEditDialog(document: ClozeDocument, defaultFontSize: number, width: number): Observable<string> {
+  showClozeTextEditDialog(document: ClozeDocument, defaultFontSize: number): Observable<string> {
     const dialogRef = this.dialog.open(RichTextEditDialogComponent, {
       data: { content: document, defaultFontSize, clozeMode: true },
-      autoFocus: false,
-      width: `${Math.max(870, width)}px`
+      autoFocus: false
     });
     return dialogRef.afterClosed();
   }

projects/editor/src/app/services/unit.service.ts

@@ -415,9 +415,7 @@ export class UnitService {
       case 'text':
         this.dialogService.showRichTextEditDialog(
           (element as TextElement).text,
-          (element as TextElement).fontProps.fontSize as number,
-          this.unit.pages[this.selectionService.selectedPageIndex].maxWidth -
-            this.unit.pages[this.selectionService.selectedPageIndex].margin
+          (element as TextElement).fontProps.fontSize as number
         ).subscribe((result: string) => {
           if (result) {
             // TODO add proper sanitization
@@ -432,9 +430,7 @@ export class UnitService {
       case 'cloze':
         this.dialogService.showClozeTextEditDialog(
           element.document,
-          (element as ClozeElement).fontProps.fontSize as number,
-          this.unit.pages[this.selectionService.selectedPageIndex].maxWidth -
-            this.unit.pages[this.selectionService.selectedPageIndex].margin
+          (element as ClozeElement).fontProps.fontSize as number
         ).subscribe((result: string) => {
           if (result) {
             // TODO add proper sanitization

projects/editor/src/app/text-editor/rich-text-editor.component.css

 div.ProseMirror {
-  min-height: 250px;
+  min-height: 300px;
   border: 1px solid;
 }