From e9f5ca817b053589acdbb4977f3fa4ca95752e1f Mon Sep 17 00:00:00 2001 From: Laurent Cozic Date: Wed, 23 Jun 2021 12:35:00 +0100 Subject: [PATCH] Desktop: Resolves #4905: Apply monospace font to code dialog in Rich Text editor --- .../gui/NoteEditor/NoteBody/TinyMCE/TinyMCE.tsx | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/packages/app-desktop/gui/NoteEditor/NoteBody/TinyMCE/TinyMCE.tsx b/packages/app-desktop/gui/NoteEditor/NoteBody/TinyMCE/TinyMCE.tsx index 8a350fd74..8349b0586 100644 --- a/packages/app-desktop/gui/NoteEditor/NoteBody/TinyMCE/TinyMCE.tsx +++ b/packages/app-desktop/gui/NoteEditor/NoteBody/TinyMCE/TinyMCE.tsx @@ -442,6 +442,16 @@ const TinyMCE = (props: NoteBodyEditorProps, ref: any) => { background-color: ${theme.backgroundColor} !important; } + /* + When creating dialogs, TinyMCE doesn't seem to offer a way to style the components or to assign classes to them. + We want the code dialog box text area to be monospace, and since we can't target this precisely, we apply the style + to all textareas of all dialogs. As I think only the code dialog displays a textarea that should be fine. + */ + + .tox .tox-dialog textarea { + font-family: Menlo, Monaco, Consolas, "Courier New", monospace; + } + .tox .tox-editor-header { border: none; }