This has been incorporated in a small library.
function smartypants(str) { | |
/* | |
Rules adapted from: | |
http://www.leancrew.com/all-this/2010/11/smart-quotes-in-javascript/ | |
*/ | |
return [ | |
[/(^|[-\u2014\s(\["])'/g, "$1\u2018"], // opening single quote | |
[/'/g, "\u2019"], // closing single quote, apostrophe | |
[/(^|[-\u2014/\[(\u2018\s])"/g, "$1\u201c"], // opening double quote | |
[/"/g, "\u201d"], // closing double quote |
Can you draw every emoji by hand? An art assigment generated in five minutes. (And probably fever-induced)
Data extracted from here: http://www.unicode.org/emoji/charts/emoji-list.html
copy(
'\n' +
Facebook does not provide an easy way to get your saved links out of its system. Here's a quick script that does that for you.
Go to your Saved links page and make sure you scroll way down to the bottom so that all your saved items are loaded. This script will generate a simple HTML page with your links, along with an Add to Pinboard action.
Drag this to your bookmarks toolbar:
function _match(str, regex) { | |
var matches = []; | |
str.replace(regex, function() { | |
matches.push(Array.prototype.slice.call(arguments)); | |
}); | |
return matches; | |
} | |
function _unique(item, idx, arr) { | |
return arr.indexOf(item) === idx; |
/* | |
Get your Youtube favorite videos | |
-------------------------------- | |
1. Navigate to your Favorites page | |
2. Scroll the list all the way down such that all videos are loaded into the browser. | |
3. Copy the JavaScript code below and run it in your console; a JSON of your videos | |
will be loaded into your clipboard. | |
4. Paste into a file on your computer. | |
const normalize_offsets = offsets => { | |
let arr = offsets.slice(); | |
if (arr[0] === undefined) arr[0] = 0; | |
if (arr[arr.length - 1] === undefined) arr[arr.length - 1] = 1; | |
let i = 0, j, start, start_offset, increment; | |
while (i < arr.length) { | |
if (arr[i] === undefined) { | |
start = i; | |
start_offset = arr[i - 1]; | |
j = i; |
/* | |
Hue rotaton based on the DOM element depth. | |
*/ | |
* { --hue: 0; } | |
* * { --hue: 60; } | |
* * * { --hue: 120; } | |
* * * * { --hue: 180; } | |
* * * * * { --hue: 240; } | |
* * * * * * { --hue: 300; } | |
* * * * * * * { --hue: 0; } |
This has been incorporated in a small library.
Highlight the CSS stacking contexts on a page.
This has been incorporated in a small library.
Paste the content of the stacking-contexts.js
file into the browser's dev tools. Elements that (at least in theory) are stacking contexts will be highlighted with a red border / overlay. The elements' title
attribute will reflect the reason and the z-index.
Note: in a browser that does not support a certain CSS property — e.g. Safari with contain
— the property will not show up in the element's computed styles, so running this code in Safari will not highlight an object with contain: content
as a stacking context. Make sure to test in a variety of browsers to track down differences.