Closed yuswritescode closed 7 months ago
Any custom CSS that you can use in Yomitan can also be used in Anki. I'm planning to add another wiki page soon with the instructions. Here's a youtube video with some examples.
I think I might replace the red font with emphasis marks (black circles or sesame dots). This is traditionally how emphasis is added in Japanese typography.
Black Circles | Sesame Dots |
---|---|
Turns out there's actually a dedicated CSS style (text-emphasis) for producing these emphasis marks. It's not supported by Yomitan at the moment but I can get the same effect by using ruby text.
At the moment I like the way that red dots look.
Turns out there's actually a dedicated CSS style (text-emphasis) for producing these emphasis marks. It's not supported by Yomitan at the moment but I can get the same effect by using ruby text.
At the moment I like the way that red dots look.
Hi Stephen, thank you for your reply and ideas! Imho, the one with the red dots looks the most convenient; the red dots allow us to quickly locate the target word (whether we are using dark or light mode) while the target word remains in the same font color as the rest of the sentence, which shouldn't cause inconvience whether we are reading in dark or light mode. Personally, I like it as a default option.
Thank you for the Youtube video and the wiki page, I will keep playing around with the settings.
Have a nice day.
Hi Stephen, I got a question out of curiosity regarding the Custom CSS. I have tried to change the font color of the target word in Jitendex through the Custom CSS screen. When the popup shows up, the target word in the example sentence is indeed shown with an orange font color. However, when I create an Anki card through that popup, the font color reverts back to the default red one in the Anki card (the sentence with the target word in orange below, is the sentence that I have mined). The removed source links also appear in the Anki card. Have I missed a step, or is this working as intended?
I just published a new version of Jitendex which uses those red dots instead of red fonts to highlight the example sentence keywords.
To customize styles in Anki, you first need to open the card browser. There should be a button on this screen labeled "Cards...".
When you click on the "Cards..." button, it will open a new window. You need to click the "Styling" button in this window. Then you can paste the custom styles into the textbox below it.
Sorry for my very late reply. Thank you so much for taking your time and effort to write a clear and kind explanation, really appreciated. It is working as you have explained. Btw, thank you for the update with the red dots as well!
No problem. I'm glad to hear that you got it working.
The current default red font is difficult to look at when used in combination with dark mode. I created a custom CSS style through the wiki page (only changed font color to orange and removed the source links), but I noticed that my custom CSS style is only applied to the popup, whereas I was hoping that these changes would also apply to the created Anki card, which turns out with the uncomfortable default red font and also with the source links.
Is there a way to apply the custom CSS style also to an Anki card? If not, what about using a simple black/white (depending on whether the user is using dark/light mode) underline while keeping the target word in the same font color as the rest of the sentence? Imo, using a certain color as the default color has a higher risk to make people uncomfortable.