[Bug] Audio play button has different elements and styles than Anki Windows and cannot be styled

anewstheart commented 2 years ago

Reproduction Steps

Create audio element
Style audio element as defined in Anki documentation
View card with audio element

Expected Result

The audio element should be styled as defined in CSS

Actual Result

The audio element is styled with the default Ankidroid CSS styling.

Debug info

In Ankidroid the play button is defined as an SVG polygon with a parent HTML anchor. The parent anchor has CSS class "replaybutton".

https://github.com/ankidroid/Anki-Android/blob/51d948b2ebd950a0611c07345e4201d1e14fc593/AnkiDroid/src/main/java/com/ichi2/libanki/Sound.java#L250-L257

On Anki for Windows the play button is defined as an SVG circle with a parent HTML anchor. The parent anchor has CSS class "replay-button".

<a class="replay-button soundLink" href="#" onclick="pycmd('play:q:0'); return false;">
<svg class="playImage" viewBox="0 0 64 64" version="1.1">
<circle cx="32" cy="32" r="29"></circle>
<path d="M56.502,32.301l-37.502,20.101l0.329,-40.804l37.173,20.703Z">
</path>
</svg
</a>

Research

Enter an [x] character to confirm the points below:

[ x] I have read the support page and am reporting a bug or enhancement request specific to AnkiDroid
[ x] I have checked the manual and the FAQ and could not find a solution to my issue
[x ] I have searched for similar existing issues here and on the user forum
[ ] (Optional) I have confirmed the issue is not resolved in the latest alpha release (instructions)