Skip to content

jduckles/pwdiff

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Pretty Word Diffs

GitHub has a nice way of showing word-based diffs on text and/or Markdown files. I needed a way to be able to create similar pretty diffs as standalone documents. This is what I came up with. Rather hacky, but functional when needed.

Requirements:

  • git
  • pandoc
git clone https://github.com/jduckles/pwdiff
cd pwdiff 
./pwdiff examples/file1.md examples/file2.md > out.html

Then have a look at out.html and you should see something like:

Pretty diffs

How does this work?

  1. Uses git's --word-diff option.
  2. This annotates/tags the text with {+ +} for additions and [- -] for removals
  3. Using sed (potentially fragile) we replace addition and removal tags {+ +} and [- -] with markdown tags __ and ~~ for underline and strikethrough Markdown styles respectively.
  4. We treat output as Markdown and pipe it to pandoc to convert to HTML.
  5. Applying the styles.css to that HTML we style underline to green and strikethrough to red to show additions (underline) and removals (strikethrough) in both colorsighted and colorblind accessible way.

Gotchas

  • We're using git diff's -U option to show so-many lines of context. I've set this very large for now. It should probably just be the larger of the total number lines of the two files input.
  • This is fragile to the tagging syntax used by git diff [- -], {+ +} as we're using sed to replace those. If your workflow or text contains those strings, ymmv.

About

Pretty diffs of markdown documents

Resources

License

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published