xkcd-substitutions icon indicating copy to clipboard operation
xkcd-substitutions copied to clipboard

Highlight changed text so it is clear what has been changed

Open dzfranklin opened this issue 10 years ago • 1 comments

Showing the original on hover would be great. For example with the injected css of

.xkcd-substitutions-substitution {
   background-color: yellow;
}

instead of directly replacing the text you could insert

<span class="xkcd-substitutions-substitution" title="${sanitize_attribute_val(origional_text)}">
    ${replacement_text}
</span>

where sanitize_attribute_val is something like

function sanitize_attribute_val(unsanitized){
    return unsanitized.replace(/([^A-z0-9])/g, function(symbol){
        return "&#" + symbol.charCodeAt() + ";"
    });

Would you accept a pull request?

dzfranklin avatar Mar 15 '16 07:03 dzfranklin

There's an open issue #27 for changing the font. I wrote an implementation for that in pull request #48 which works similarly to what you suggested, by putting replacements in a span with a class. That means you could use something like the Stylish extension to add your own CSS and attach it to that class. If Posnet accepts my pull request, would that do what you want?

piquan avatar May 20 '16 01:05 piquan