Open jat255 opened 3 years ago
Turns out this is not so simple to fix (at least for me), because that text is loaded as a virtual element, so CSS selectors from the main application will not match on it:
<object _ngcontent-iac-c113="" type="text/plain" width="100%" class="preview-sticky" data="http://paperless.lan/api/documents/<doc_id>/preview/">
#document
<html>
<head></head>
<body>
<pre style="word-wrap: break-word; white-space: pre-wrap;">
text content
</pre>
</body>
</html>
</object>
Everything inside that virtual element is loaded from http://papelerless.lan/api/documents/_doc_id_/preview/ , which comes directly from src/documents/views.py
in the backend. Since this is supposed to return just the file content, it does not make sense to add front-end CSS here, so I'm at a bit of a loss on how to get this to show up correctly on the edit page preview. @jonaswinkler any ideas?
Yea a simple fix would be to have Angular add a class (eg the text-light
class) if it detects a plaintext document. Honestly Im gonna hold off on a PR until (hopefully) development starts up again but its a simple fix
I'm very much not an Angular expert, but would that work? I tried adding a class to the pre
element and then a new rule for that class in my devtools, but the browser (at least Chrome) will not apply rules from the root document inside of the #document
virtual element. The only other thing I can think of is some javascript that would apply the style after the preview is loaded.
Oh sorry, youre right its like an iframe. Adding a background color to the container element might make more sense anyway
Oh sorry, youre right its like an iframe. Adding a background color to the container element might make more sense anyway
Doh, you're right that's a smarter idea...
Added the 1 line PR =) Hopefully this project comes back to life soon...
Ah, you beat me to it: https://github.com/jat255/paperless-ng/commit/67464c810ae5ba669c7f818e4cb99293bb1e4044
Yes but your approach will affect all preview objects, we dont want that, just when its text/plain. Especially with angular we have to manage CSS cascading carefully. Also, probably cleaner to use an existing class (.bg-white
is in bootstrap) than a whole new rule, variable, etc.
👍
Describe the bug When dark mode is active, and previewing a .txt document, the text of the document is rendered in normal black color, which makes it illegible on the dark background.
To Reproduce Steps to reproduce the behavior:
Expected behavior
Font color should be light-colored, matching the rest of the application (looks like this is
#abb2bf
throughout the rest of dark mode)Screenshots
This was a private document, so many of the details are blurred/redacted, but the part outlined shows the problem well enough