Colour of tags unreadable · Issue #59 · krassowski/Anki-Night-Mode

Thank you for the details. So it seems that it happens specifically on Mac OS. I guess there might have been a Mac-specific change in Anki 2.1.8 – I will look into that.

It might help if you could provide your Qt version from “Help → About”.

Same thing. Sierra 10.12.6

Version 2.1.9 (ae67c976)

My friend uses windows and he has the same issue.

Here is my Qt 5.12.0 PyQt 5.11.3

It’s the same in 2.1.9 :

Version 2.1.9 (ae67c976)

Thank you all for reporting the details – this is really helpful. I will try to investigate the issue this weekend.

In the meantime, may I suggest you a workaround by manually overwriting text color of the tags entry box or by forcing black background color. It may or may not work, but please try and let me know of the result – it would help pinpointing the culprit:

use menu bar: Tools → Add-ons → select Night Mode → click on “View Files”, find

Anki-Night-Mode/night_mode/stylers.py

Lines 680 to 685 in c7bdbf6

Remember to restart Anki to see the results! Please, remember to let me know if the workaround (and which one) works for you.

Thank you again, and apologies for the delay – this was a busy month for me.

@Z1839 I am glad that it helped. Which one did you use (color or background-color)?

I used color. However, I have the same issue in the browser when trying to add tags. The text can’t be seen.

Any idea on how to fix the tag text in the browser when I click “add tags”

I have two Mac systems available to me. Yesterday, I’ve noticed that on my Macbook with El Capitan, tags are just fine (I will reply later with more details about config).

At the same time, Sierra messing it all up on a desktop.

If that can help you in any way. Thanks for provided work-around!

Alright, I figure this out. Got same problems @Gueazy experienced and fixed them. @krassowski

MAKE A BACKUP BEFORE EDITING.

You need to edit

First, look for this:

editor.tags.completer.popup().setStyleSheet(self.completer)

And change it to this:

editor.tags.completer.popup().setStyleSheet(self.popup)

Later in a code, add new definition –

@css def completer(self): return “”” background-color:black !important; border-color:#444; color:black; “”” @css def popup(self): return “”” background-color:black; border-color:#444; color:#eee; “””

Reload Anki and take a look:

Profit!

Hey man, i’m confused on the second step. You say to add – popup after completer, but then show a bunch of code after without explaining what it’s for. Do i need to add this code too?

Of course you do! Add everything starting from

This code is showing you WHERE to put

@css def completer(self): return “”” background-color:black !important; border-color:#444; color:black; “”” @css def popup(self): return “”” background-color:black; border-color:#444; color:#eee; “””

What in a hell

Why do we even need that? Those functions are CSS styles definitions. What they do is that they apply some styling with CSS to certain elements of Anki UI.

We change it to

Basically, all my code is doing:

Hope it helps.

Idk. I was not concern with fixing that. You may try to do it yourself – I’ve showed you a way.

Thank you. I want to make sure I got it right because things show up a bit different for me.

@css

that I changed to:

Also, I’m still having an issue with my tags in the browser:

You welcome!

Almost right, buddy. Just look at my file for reference – stylers.py.zip

You should have BOTH def completer and def popup in your code.

@css

I don’t have any issues, so I can’t help you with that. It’s a maintainer job to do that.

perfect. thanks makeagreatdish. 🙂 i followed your instructions and the first time it didn’t work for me, but i replaced your “background-color:black;” with “background-color:black !important;” in the popup(self) and then it worked. haha have a nice day.

Hi there! I was digging through the changeset of Anki trying to find out the potential culprit. This commit stands out: ankitects/[email protected]; it mentiones a QT bug and uses a workaround which sets the background color of a QT widget to

Another, recent change also mentiones a MacOS bug and hardcodes background to

As I cannot afford to get a Mac now*, would you be able to test if the following changes fix the issue?

Old code:

@css def completer(self): return “”” background-color:black; border-color:#444; color:#eee; “”” @css def qt_mid_buttons(self): return f””” QLineEdit {{ {self.completer} }} “””

New code (please replace the lines above with these below; spaces matter!):

@css def completer(self): return “”” background-color:black!important; border-color:#444; color:#eee; “”” @css def qt_mid_buttons(self): return f””” QLineEdit, QCompleter, QTreeWidget {{ {self.completer} }} “””

If this does not work, I would be willing to disable the styling of the tag box for MacOS (with a result similar to the changes sugested by @makeagreatdish).

*Fun fact: Mac users generate most the bug reports in each of my open source, non-for profit repositories. I wonder if it is because the system has more bugs, the users are more active or because it is relatively less popular among developers, thus we do not know the quirks of it. Likely all of the three.

Version 2.1.11 (3cf770c7)

@krassowski nope. didn’t work. i just switched over from 2.0, so not sure about 2.1.7. haha, it does sound annoying to troubleshoot a thing you don’t have. you’re right… the reason is probably all three.

I have been able to work around this bug by force enabling window-level Dark Mode for Anki on my Mac OS 10.14.5 Mojave system. First I quit Anki, then I paste this command in Terminal:

When Anki is restarted, the entire app including title bar have Dark Mode enabled and the tags box no longer displays a white background.

This obviously won’t work on non-Mojave (or later) systems that don’t have native OS level dark mode enabled. I have not yet encountered any bugs doing this. It overall just looks better.

@teedoff087 This completely fixes the issue! Maybe this needs to be a changed in Anki itself to support the system dark mode? @krassowski, maybe you could let @dae know?

I am happy that this solves the problem! I will include this in the README file and on the add-on page to inform other Mac OS users. @keirwilliams I do not have means to test any potential changes to Anki in this respect, but I will be happy to review and merge pull-requests if the changes were to be included in the add-ons code.

Thank you! This fixed my issue with the browser. However, in the card editor my tag entry background is still all black, so i’m getting black on black text. Could this be from the changes I made to the code in the addon, as recommended above?

Yes, it could be. I didn’t make any changes to the add-on source code on my installation.

@krassowski I should note this does seem to mess with the styling of some UI elements if you disable Night Mode. It’s kind of an all in for dark mode solution. Might be worth adding a comment about this to the note you added in 66ec1b9.

@krassowski

edit: I’m on the lastest uptdate: === 2.3.1 – January 17, 2020

Close Anki and run this command:

This will remove that preference key. When you relaunch Anki, the behavior should revert to how it was before you entered the original Terminal command.

It worked! Thank you for your reply. Any idea how to fix the add cards window that behaves like night mode is disabled? I checked on “choose what to style” and and the “Add Cards” is rightly enabled.

I don’t have a solution for that. I’ve learned to deal with it. I think it looks better like that than it does for the main window to be dark mode and the add window solid white. My guess is an add-on (perhaps a few together) are causing the add window fields to behave like that. It happens on my system too. I tried disabling Frozen Fields and a few others and I couldn’t resolve it. Let me know if you discover if an add-on is causing the problem and we can put in an issue with the add-on developer.

Sounds good, I’ll look into it.

edit: I disabled every addon except night mode but no luck

I know this works (defaults write net.ankiweb.dtop NSRequiresAquaSystemAppearance false ) for regular Anki.

What can I type into terminal to get it working with the Alternate Anki install?