Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not compatible with Night Mode #8

Closed
Math3mat1x opened this issue Jun 8, 2019 · 4 comments
Closed

Not compatible with Night Mode #8

Math3mat1x opened this issue Jun 8, 2019 · 4 comments
Labels
question Further information is requested

Comments

@Math3mat1x
Copy link

Hello,
I'm a complete beginner in code and I'm going to learn it using Anki. I like dark themes.
So, I installed the addon Night Mode and I chose the monokai theme in Syntax Highlighting for Code.
One point that is very cool is that the color of the code remains the same on the web app..
The point is that the numeration is in white, and it doesn't look great on my screen, here's a screenshot (the code is not mine ^^):
Capture du 2019-06-08 17-47-26
... but I still want the numbering.
Is it possible to disable the background color of the numbering lines?

Thanks in advance.

NB: I'm French so it's possible that they may be spelling mistakes or non-sense in my text.

@Math3mat1x Math3mat1x added the bug Something isn't working label Jun 8, 2019
@glutanimate
Copy link
Owner

Hi PopCorne. Your English is fine, so no worries!

By default, Syntax Highlighting will use inline HTML style elements to apply its coloring. These do not support different styling depending on other factors such as whether Night Mode is active or not. And since users usually switch between NM on and off, I can't implement a switch that would simply hard-code the line color depending on which was active at code generation time.

However, you might have some success with using the CSS mode of the add-on instead and adding some custom classes that apply only when Night Mode is active. Please see Night Mode's README on how to do that: https://github.com/krassowski/Anki-Night-Mode#custom-css-in-night-mode

Hope that helps!

@glutanimate glutanimate added question Further information is requested and removed bug Something isn't working labels Jun 8, 2019
@Math3mat1x
Copy link
Author

Thank you for your answer!

I'm not sure I understood...

you might have some success with using the CSS mode of the add-on

So I did that in your add-on (or maybe should I had do this on the Night Light add-on?):
Capture du 2019-06-08 20-43-34

Custom CSS in night mode

You may use night_mode class, to overwrite some of the CSS rules; sometimes usage of important! directive or catch-all selector (*) will be needed to enforce you own styling. Example:

.night_mode *{
color: red;
}

So if I understand, I may apply this CSS in the NL add-on and put the monokai theme on it... but your theme is written in Python, so I can't import it...
I don't understand what I'm saying :)

Help !!! ;-)

@glutanimate
Copy link
Owner

With the "Use CSS classes" option active, styling is governed by your card templates. So you will have to copy and paste the pertinent CSS snippets into the styling section of your Anki card templates: https://www.youtube.com/watch?v=F1j1Zx0mXME

So to apply the default css linked before, for instance, you would copy the entire code block and paste it into the Styling section. If you look towards the top, the default css already comes with a night mode rule. I'm not sure how well it works, however, as I don't use Night Mode myself.

@Math3mat1x
Copy link
Author

I definitely don't understand all of this...
We use CSS because of the "rigidity" of the add-on...
When I first used your add-on, I didn't had to go to all of that... I just clicked the thunderbolt and tadam, I had a code that were compatible with the web version because it's HTML.
I've seen that the basic function (the thunderbolt one) uses HTML instead of CSS to be configuration-less.

So is it possible, in the Python code of the add-on at ~/.local/share/Anki2/addons21/1612375712, to modify the code so that it doesn't make anymore highlighting on the numbering?
Indeed, I've seen that their is lot of documentation on your code so that we can customize the add-on. Python is very cool because of that...
Another good point of that is that I could, with that method, still use the monokai theme!

Can you help me do that?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
question Further information is requested
Projects
None yet
Development

No branches or pull requests

2 participants