Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

Dark Mode Needs CSS Overrides for Handout Body Text

For handouts, I often use external editors for formatting and paste the entire text into the handouts. I find by doing so that the text is easier to read and I have more control over how it looks -- until now. Heretofore, with white backgrounds, this has never been an issue. With so many games, I now have a huge repo of handouts that cannot be read in dark mode. -- However, due to a different bug regarding character sheets, I am being forced to use Dark Mode for an upcoming game. I cannot see handout text pasted from an external editor due to the fact that the pasted text carries its own colour info, making dark text unreadable against a dark background. If you're going to introduce this feature, it needs some CSS instructions to enforce lighter colour text to prevent this issue by using stronger selector rules to force a default lighter colour.  Text directly entered into Roll20 works fine, but again, I don't typically use Roll20's editor for most handouts. Examples below (using Chrome):
1660290873

Edited 1660290915
I fear this is NOT going to change any time soon, even with the site overhaul that is currently in place... (they would have to reimplement the editor for that and I do not think this is going to happen!) A workaround would be: Write Text in another Program, make a SCREENSHOT of it and Upload said screenshot to the handout!
Well, I had to try. I still don't see why they can't have a strong CSS selector chain to force a default colour, but not so strong that it couldn't be overridden by the developers' CSS sheet. I didn't inspect the particulars. but I assume that Dark Mode is using something like #dark-mode on a parent tag, and then if so, then #light-mode label: black or charcoal or whatever. And I wouldn't even mind using !important at this point. Thanks for the suggestion. I do use images sometimes when the presentation is important (eg an ancient scroll or a data terminal). But mostly it's for legibility and font selection. But I appreciate the information. Sad to hear, but again, had to try. Cheers. TheMarkus1204 said: I fear this is NOT going to change any time soon, even with the site overhaul that is currently in place... (they would have to reimplement the editor for that and I do not think this is going to happen!) A workaround would be: Write Text in another Program, make a SCREENSHOT of it and Upload said screenshot to the handout!
1660325717
keithcurtis
Forum Champion
Marketplace Creator
API Scripter
The recommendation has always been to use clean text (at least in module preparation). There are so many editors out there that use global style sheets, local style sheets or in-line styling that it would be difficult if impossible to account for everything consistently and for all users who might be reading the content. Better by far to format within the handout using the built-in tools. Sometimes you can get lucky, and while there was only one mode, you could easily see when pasted text just wasn't going to work. Since you are a pro user, you do have another formatting option. Stephen W.'s Markdown script. This takes markdown text in the GM Notes field and formats the body of the handout according to a local style sheet handout that you write. This creates formatting that is generally bomb-proof and can duplicate the look of nearly whatever style you imagine. My larger, more permanent handouts all have a 5e styling for instance.
Thank you, Keith. I'll play around with it. Future-forward, I can account for the new reality. But this might be a way for me to progressively update my current content without having to try and reformat it all. Appreciate the pointer.
1662792231

Edited 1662800733
FYI - I figured out a simple workaround for this: Paste the formatted text into the handout in Light Mode as normal. The text will be visible only in Light mode. But by doing this, one has set the formatting as intended. Cut the text out and re-paste it using Shift + Cmd/Ctrl + V, which is the paste into command. This command pastes text but takes its appearance from the existing format. -- Text will appear just as it did before, but it will now appear correctly when switching to Dark Mode. The only change that you might need to make is to remove extra line breaks between paragraphs. If you have different formatting in the same block of text, you will need to paste once for each formatted type. But most handouts don't have this.