Improve dark mode support for editor and preview#1413
Conversation
Make the ACE editor and file preview follow the current TinyFileManager theme. Dark mode now uses a matching ACE theme and a separate Highlight.js style for previews, while light mode keeps the existing behavior. Plain text previews without Highlight.js also receive dark mode styling.
prasathmani
left a comment
prasathmani
left a comment
There was a problem hiding this comment.
tinyfilemanager.php:4733 — Dead CSS selector: .file-preview-content does not exist, so the plain-text dark preview never applies.
The new rule is:
.theme-dark .file-preview-content pre {
background-color: #101518;
color: #CFD8DC;
padding: 1rem;
}There is no element with class file-preview-content anywhere in the file (or repo) — the preview content is rendered inside <div class="row"> → <div class="row mt-3"> (around tinyfilemanager.php:1796 and 1880), and the plain-text branch emits a bare <pre> at tinyfilemanager.php:1934. Since .theme-dark sits on <body> but .file-preview-content matches nothing, this selector is inert.
Failure scenario: With $highlightjs = false (Highlight.js disabled) in dark mode, viewing a plain text/config file — the PR's stated goal of "a dark background and light text color to plain text previews without Highlight.js" — leaves the preview with its default light appearance. The rule silently does nothing. Fix: target the actual wrapper (e.g. add a file-preview-content class to the preview <div>, or change the selector to match .theme-dark .row pre / the existing pre.with-hljs).
--
AI PR review
2 participants
Summary
This improves dark mode support for the ACE editor and the file preview.
Problem
The TinyFileManager dark mode is currently not fully reflected in editor and preview views:
TextMatetheme.$highlightjs_style.Changes
TextMateas the ACE theme in TinyFileManager light mode.Twilightas the ACE theme in TinyFileManager dark mode.$highlightjs_style_darksetting next to$highlightjs_style.$highlightjs_stylein light mode.$highlightjs_style_darkin dark mode.vs2015.Expected behavior