Posnet / xkcd-substitutions

xkcd substitutions chrome extension
MIT License
103 stars 64 forks source link

Highlight changed text so it is clear what has been changed #44

Open dzfranklin opened 8 years ago

dzfranklin commented 8 years ago

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?

piquan commented 8 years ago

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?