Latest Roll20 update breaks roll20dark

[TuVieja64]

I guess you already noticed, but just to get it here so people can see it. Roll20 updated their sheets, breaking compatibility with roll20Dark, hope you can fix it soon!! thanks for your work, it makes the site look so much better, they really should add night mode in their website, because the default look is just too bright.

[bitfed]

I have dreaded this day for a very long time. I want the dev to know how much this work has really enhanced my time playing. Thank you.

[turtleheart]

Adding the following to the script seems to fix the issue (tested on chrome, firefox):

#background {
    background: #1a1a1a;
}

I'm not submitting a pull request for this as I'm not very familiar with css, or this script.

[sdlambert]

The above style was helpful, but there is still some remaining work to be done based on the screenshots in the repo. For instance, all of the places where the yellow accent colors need to appear seem to have been overwritten. Many of the inputs need the dark background as well (multi select inputs, token drag and drop area, etc.)

I made the following changes:

// replace white backgrounds on elements
#background, .sheet-vitals-stats, .defaulttoken.tokenslot {
    background-color: #1a1a1a;
}

// the attributes in the character sheets have a white border on a white background for whatever reason 
.attrib .divider {
    border-right: none;
}

// this was a bit too bright
.attributesabilities .abil {
    border-bottom: 1px solid #444;
}

// default was too dark for my preferences, you may omit this if you like a darker font
body {
    color: #999;
}
// NPC token attributes had a darkish gray background and more dark font
.sheet-row .sheet-display > span[name*="attr_"] {
    color: #999 !important;
    background-color: transparent !important;
}

// more dark fonts
.charsheet .sheet-npc .sheet-trait .sheet-display .sheet-description, .charsheet .sheet-npc .sheet-reaction .sheet-display .sheet-description, .charsheet .sheet-npc .sheet-action .sheet-display     .sheet-description { 
    color: #999 !important;
}
// Lighten up the color contrast on the creature type/alignment to a nice coral color
.sheet-display .sheet-row.sheet-subtitle span {
    color: rgb(247, 125, 125) !important;
}

I'm new to the theme so I don't know what it used to look like. Some other things that remain off the top of my head are the selectize elements.

I'm making edits to this as I find new stuff.

(As a side note, the number of important tags in the Roll20 native styles is shameful.)

[D4vv0]

Can we expect a complete fix (and maybe an update)?

[JohSchillerEmnify]

Can confirm this issue, unfortunately this seems relatively dead, i think we would need to look towards other maintainers maybe @zuzuvelas might be able to support, his seems to be the only fork that was updated in the last days, unfortunately they apparently since changed even more, which means even the version from 6 days ago isn't working. I would also try to help but I don't have any experience with javascript, css or anything related to web developement.

Meanwhile the Darkreader extension works okay-ish... some elements are still pretty shitty, but overall it's okay as a last resort.

[sdlambert]

@JohSchillerEmnify I've made some progress to try and clean things up a bit, but it's difficult to say if the changes are enough. You simply need to add the styles to your local script (just put the code above in the script after all the other styles.) I'd be happy to update my post above if you can point out what else needs fixing.

EDIT: I can say for sure that the dark theme tries to load some CSS from roll20 and I am getting a 404 for the following: https://app.roll20.net/css/licensed5ednd.css

It also looks like the changes to roll20 are currently a moving target, as additional regressions appeared when I went in this morning. It's not clear if this is some sort of A/B testing or permanent changes going forward.

[sdlambert]

I've gone ahead and forked this repository, you can find the changes here and install it the same way you used to.

NOTE: THIS IS A WORK IN PROGRESS!

https://github.com/sdlambert/Roll20-Dark-Theme https://openuserjs.org/src/scripts/sdlambert/Roll20_Dark.user.js

I make no promises about how far these changes will go or if I'll ever maintain them, and it seems that the Roll20 team is continuing to make changes to the sheets as we go.

[kookiekookie]

I've gone ahead and forked this repository, you can find the changes here and install it the same way you used to.

NOTE: THIS IS A WORK IN PROGRESS!

https://github.com/sdlambert/Roll20-Dark-Theme https://openuserjs.org/src/scripts/sdlambert/Roll20_Dark.user.js

I make no promises about how far these changes will go or if I'll ever maintain them, and it seems that the Roll20 team is continuing to make changes to the sheets as we go.

Thanks for your contribution. I took a look at your version, looks good. I also made an effort to fix it, though I don't know how to code in css so it might be janky code with redeclarations. Regardless, my version has better contrast in some areas. You can take a look, improve on it if you like. I'm currently stuck at making the inspiration image value invert by 80%. I kept trying at line 1489. I could give up and continue working on the other sections though. DarkMode.txt

[sdlambert]

It looks like another user has posted a more complete script, you can find it here:

https://openuserjs.org/scripts/Pharonix/Roll20_Dark

[lihuelworks]

It works better than the previous one, but still has some issues, e.g some white bar appears on top of the character sheet (although there has been several changes to the character sheets, probably because of the new Android app)