Skip to content

Instantly share code, notes, and snippets.

@nbogie

nbogie/rough-notation-bookmarklet.js

Last active May 28, 2020 13:07
Show Gist options
  • Save nbogie/4de5f8ef33853e7be305bdc776abce4c to your computer and use it in GitHub Desktop.
Save nbogie/4de5f8ef33853e7be305bdc776abce4c to your computer and use it in GitHub Desktop.
Download ZIP
bookmarklet demoing "hand-drawn" annotations with rough-notation library. Will highlight p and a tags.
Raw
rough-notation-bookmarklet.js
javascript: (async () => { const RoughNotation = await import('https://unpkg.com/rough-notation?module'); const pick = (arr) => arr[Math.floor(Math.random() * arr.length)]; const colorNames = "#66FF66 #FD5B78 #FF9966 #FFFF66 #50BFE6 #FF00CC".split(" "); document.querySelectorAll('p').forEach(elem => { RoughNotation.annotate(elem, { type: 'box', color: 'black', strokeWidth: pick([1, 2, 5]) }).show(); }); document.querySelectorAll('a').forEach(elem => { RoughNotation.annotate(elem, { type: 'highlight', color: pick(colorNames) }).show(); elem.style.color = 'black'; }); })()
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment