Pitch accent plugin: wrap to new line

[sammclennan]

Hi,

I'm a huge fan of your plugin. I've used it on thousands of cards and it's been an extreme help! I have one question. I mainly use AnkiDroid and the screen is rather small. For longer words the pitch accent nodes often extend off the page and it requires that I scroll right to see them. I was wondering if it is possible with your plugin to wrap the text (and nodes) to a new line for longer words instead of allowing overflow? This would dramatically improve my revising experience! Please let me know if you have a solution.

Kind Regards,

Sam

[IllDepence]

Hi Sam,

glad to hear you like the plugin.

Line wrapping is unfortunately not possible with the way characters are positioned within the SVG. (It would also raise the question of how to handle the lines connecting the dots across a line break.)

What you could do alternatively, is scale the pitch illustration using CSS rules.

In the Anki desktop version, you can find that option in Tools → Manage Note Types → (select type from list) → Cards → Styling. Below are a few examples of what you can do:

• Set a fixed width for all pitch illustrations: svg.pitch { width: 300px; height: auto; }
• Set a maximum width: svg.pitch { max-width: 300px; height: auto; }
• Set a maximum width if the displaying screen is of a certain size or smaller (e.g. a mobile device in portrait mode) — not sure if this one will work with AnkiDroid or the iOS app

@media (max-width: 480px) {
   svg.pitch { max-width: 300px; height: auto; }
}

Hope this helps. :)