Fixing the colour accessibility for dark mode
4 votes c/freepost Posted by vaeringjar — 4 votes, 11 commentsSource


I wasn’t sure how you prefer patches/PRs/MRs and I was lazy and just wanted to send this over because I keep putting it off and getting distracted.

These changes should fix the colour accessibility for dark mode. I chose a slightly less extreme contrast for dark mode just in case I completely missed something. So if I did miss something, it should still be better than it was before.

There’s also still an existing issue with the monkey showing up extremely small when changing the view to 375x800 or smaller.

I hope all is well.

@media (prefers-color-scheme: dark) {
  html, body {
    background-color: #333;
    color: #ddd;
  a, a:hover, a:visited {
    color: #ff0; /* add this for better contrast against the background */

@media only screen and (min-width: 800px) {
  .menu > .flex-item {
    /* color: #000; */ /* remove this one line */

@media only screen and (max-width: 800px) {
  .menu.visible a {
    /* color: #000; */ /* and also remove this one line */


  1. About PRs and similar. The repo is at so you could just create fork at NotABug. I don’t know what zPlus prefers but it is what I did

  2. As I know freepost allows you not to fill link field. When you fill it, the post/link becomes “unique” so if someone else wants to use that link freepost won’t allow to make a post with a link that have been already used… Just a piece of info ¯\_(ツ)_/¯

Regarding point 2, here’s the explanation: in the past, different people used to submit the same link multiple times. Someone made a patch to prevent this, and it’s been like that since that patch.

Thank you vaeringjar :)

I’ll try to add these changes asap. If you have the repo anywhere (NAB?) I can pull from there otherwise I’ll just add them manually.

Okay cool. If you don’t get around to it before I do later, I’ll put in a PR on NAB.

There’s also the voting background when the user hasn’t voted yet. I forgot to check that one. I can probably fix that one too.

You don’t really need to open any PR on NAB, though. Have you got the repository uploaded there? I’ll just git pull from it.

Sorry, I haven’t been able to get stylus to work. I might be running a ~~python~~ npm/node version that’s too recent. I know I’ve run it before no problem.

Either way, I’m not entirely sure where it’s configuring the prefers-color-scheme from.

EDIT: I typed python when I meant npm. Anyway I’ll give this another try later.

I haven’t actually been using stylus for a while. I dropped it in favor of plain CSS (just to remove the extra dependency). I think you might still be using the “main” branch, but I actually created a new branch called “communities” when I added groups last year. This has the up to date files.

Thank you for the help. Still not perfect but I think I was able to make it readable at least.

Cool, sorry I have so much going on I totally spaced it out. And when I came back not too long ago tuxfamily was having an issue.

The highlighted post style probably needs a different background, but that’s so much better.

EDIT: It’s this rule:

.container > .content > .post > .comments > .comment:target {
  background-color: lightyellow;

oh thank you! I completely missed it. I’ve changed it. Don’t know if it looks good but at least it’s readable :)

Looks great! Thanks zPlus!