Monospace font customization #3856

New Issue

OVERLORD · 2026-02-05T07:41:23+03:00

OVERLORD commented

2026-02-05 07:41:23 +03:00

Originally created by @wxrl on GitHub (Jun 15, 2023).

Describe the Bug

It seems changing the font family name monospace to other Monospace Font from Google in the following customization css code piece won't affect the display of code block. It only takes effect on the in-line code font display.

.CodeMirror, pre, #markdown-editor-input, .editor-toolbar, .code-base {
  font-family: monospace;
}

Steps to Reproduce

Go to Settings ---> Customization ---> Custom HTML Head Content
Add the link of certain monospace font (e.g. Red Hat Mono) as shown in https://www.bookstackapp.com/docs/admin/visual-customisation/ from Google Fonts.
Add the application-of-the-linked-font piece of css code as shown in https://www.bookstackapp.com/docs/admin/visual-customisation/ as below, and then save the settings.

.CodeMirror, pre, #markdown-editor-input, .editor-toolbar, .code-base {
  font-family: "Red Hat Mono";
}

Go to certain page including in-line code and

code-block

the in-line code part displays using the customized font (Red Hat Mono) but the code-block still uses the default monospace font set by the browser. (ACTUALLY when refreshing the page, you can see the code-block is using the customized font for about 0.1 second and then changed to the default monospace font set by the browser eventually)

Edit this page with Markdown Editor, and you can see ALL contents in the LEFT part (Editor) uses the default monospace font set by the browser, while in the RIGHT part (Preview), both the code block and in-line code display using the customized font as expected.

Latest Firefox and MS-Edge show the same behavior as described above.

Expected Behaviour

Both in-line code and

code block

use the customized mono font.

Screenshots or Additional Context

No response

Browser Details

No response

Exact BookStack Version

v23.05.2

PHP Version

8.2

Hosting Environment

Debian 12 + NGINX 1.22.1 + PHP 8.2 + MariaDB 10.11.3

Originally created by @wxrl on GitHub (Jun 15, 2023). ### Describe the Bug It seems changing the font family name `monospace` to other Monospace Font from Google in the following customization css code piece won't affect the display of `code block`. It only takes effect on the `in-line code` font display. ``` .CodeMirror, pre, #markdown-editor-input, .editor-toolbar, .code-base { font-family: monospace; } ``` ### Steps to Reproduce 1. Go to Settings ---> Customization ---> Custom HTML Head Content 2. Add the link of certain monospace font (e.g. Red Hat Mono) as shown in [https://www.bookstackapp.com/docs/admin/visual-customisation/](https://www.bookstackapp.com/docs/admin/visual-customisation/) from Google Fonts. 3. Add the application-of-the-linked-font piece of css code as shown in [https://www.bookstackapp.com/docs/admin/visual-customisation/](https://www.bookstackapp.com/docs/admin/visual-customisation/) as below, and then save the settings. ``` .CodeMirror, pre, #markdown-editor-input, .editor-toolbar, .code-base { font-family: "Red Hat Mono"; } ``` 4. Go to certain page including `in-line code` and ``` code-block ``` the `in-line code` part displays using the customized font (Red Hat Mono) but the `code-block` still uses the default monospace font set by the browser. (ACTUALLY when refreshing the page, you can see the `code-block` is using the customized font for about 0.1 second and then changed to the default monospace font set by the browser eventually) 5. Edit this page with Markdown Editor, and you can see ALL contents in the LEFT part (Editor) uses the default monospace font set by the browser, while in the RIGHT part (Preview), both the `code block` and `in-line code` display using the customized font as expected. Latest Firefox and MS-Edge show the same behavior as described above. ### Expected Behaviour Both `in-line code` and ``` code block ``` use the customized mono font. ### Screenshots or Additional Context _No response_ ### Browser Details _No response_ ### Exact BookStack Version v23.05.2 ### PHP Version 8.2 ### Hosting Environment Debian 12 + NGINX 1.22.1 + PHP 8.2 + MariaDB 10.11.3

OVERLORD added the 🐛 Bug label 2026-02-05 07:41:23 +03:00

OVERLORD closed this issue

2026-02-05 07:41:25 +03:00

OVERLORD commented

2026-02-05 07:41:29 +03:00

@ssddanbrown commented on GitHub (Jun 15, 2023):

Thanks for raising @wxrl. I specifically addressed this within 610ad0d613 yesterday, as part of #4302 which will change how custom fonts are defined. These will be part of the next feature release.

@ssddanbrown commented on GitHub (Jun 15, 2023): Thanks for raising @wxrl. I specifically addressed this within 610ad0d613513d8f83eb05a0ba099700846af7c6 yesterday, as part of #4302 which will change how custom fonts are defined. These will be part of the next feature release.

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: starred/BookStack#3856