Subroutine arrows (“↳”) in card page not copy-pasteable

[sboosali]

What looks like ↳ End the run. in html is subroutine End the run. in plaintext, and thus gets copied as the latter.

Suggestions (either):

1. Use ↳: That is, replace subroutine arrow images with the Unicode character Downwards Arrow with Tip Rightwards.
2. Use <abbr> tags (for unicode plaintext) with background-image:’d classes (for subroutine arrow images).

The latter is better (it works for all symbols, like credits), but the former seems easier (and may work for a few symbols, which have Unicode lookalikes).

For example, in Scryfall, the two symbols in Llanowar Elves’s text can be highlighted and copied as {T}: Add {G}., but is still rendered correctly. It does so with <abbr class="card-symbol card-symbol-T" title="tap this permanent">{T}</abbr> in source, where .card-symbol-T { background-image: url("data:image/svg+xml;base64, … ") } and .card-symbol { display: inline-block; overflow: hidden; width: 15px; height: 15px; cursor: help; … }.

[AlexRodwell]

This is actually quite an easy amendment (1st option), updating this line with the following code: '[subroutine]' => html_entity_decode('<span class="icon icon-subroutine" aria-hidden="true"></span><span class="icon-fallback">&#x21b3;</span>'), would solve this (html_entity_decode() function is required for the uni-code to print correctly, otherwise it prints as plain text).

The main issue I see, replacing 'subroutine' with a uni-code icon might not correctly print in some text editors (unlikely, but always an edge case), as well as not being as accessible as just the word itself. We could simply do both, by prefixing this uni code before the subroutine, i.e. '↳ subroutine'.

Note, I found the icon hex code from https://www.toptal.com/designers/htmlarrows/arrows/down-arrow-with-tip-right/

[sboosali]

For the compatibility issue, ASCII -> or => would work; but for the accessibility issue, [subroutine] or [sub] does work better. (My TTS reads "->" as "to" and reads "=>" as "equals greater than").

[AlexRodwell]

Agreed, wrapping the fallback/accessible text values in square brackets (similar to scryfall) would be a good compromise to the issue to ensure compatibility, and continued accessibility while making it clearer it's an action (in the rare case it might conflict with the wording of the card).

[sboosali]

Also, listening to the influence cost with my TTS, the faction symbol isn't used while the symbol names of all five pips are. For example, [jinteki] ●●○○○ is read as "filled circle filled circle hollow circle hollow circle hollow circle".

[AlexRodwell]

Influence cost is probably the more difficult one to resolve, as they currently use uni-code which can be read by TTS, but as you noted, it reads it as 'circle filled circle [...]'. I'd assume (without testing), that if we applied user-select: none; to a wrapper that had the pips in, the TTS would still read the plain text (unless said TTS accounts for aria-hidden labels), as if we applied either of those solutions, we could then have a hidden <span> with "Influence X" in, which would be read and copy/pasted as easily readable text.

To note, I did begin implementing the feature on my fork: https://github.com/AlexRodwell/netrunnerdb/commit/a311b20e4cb4577f07c11f4b346e5f059f0b733d

[AlexRodwell]

See my screenshots and example of copy/pasted text from a card page on how this would look: https://github.com/NetrunnerDB/netrunnerdb/pull/802#issuecomment-1883834046

Let me know if that appears inline with what you're expecting. Adding the <abbr> tags is a good shout for both players not completely familiar with all aspects of the game, and accessibility.