When making this website, i wanted a simple, reasonable way to make it look good on most displays. Not counting any minimization techniques, the following 58 bytes worked well for me:
main {
max-width: 38rem;
padding: 2rem;
margin: auto;
}
$.fn.wordify = function(){ | |
this.find(":not(iframe,textarea)").addBack().contents().filter(function() { | |
return this.nodeType === 3; | |
}).each(function() { | |
var textnode = $(this); | |
var text = textnode.text(); | |
text = text.replace(/([^\s-.,;:!?()[\]{}<>"]+)/g,'<span>$1</span>'); | |
textnode.replaceWith(text); | |
}); | |
return this; |
I've done the same process every couple years since 2013 (Mountain Lion, Mavericks, High Sierra, Catalina) and I updated the Gist each time I've done it.
I kinda regret for not using something like Boxen (or anything similar) to automate the process, but TBH I only actually needed to these steps once every couple years...
#!/bin/sh | |
### | |
# SOME COMMANDS WILL NOT WORK ON macOS (Sierra or newer) | |
# For Sierra or newer, see https://github.com/mathiasbynens/dotfiles/blob/master/.macos | |
### | |
# Alot of these configs have been taken from the various places | |
# on the web, most from here | |
# https://github.com/mathiasbynens/dotfiles/blob/5b3c8418ed42d93af2e647dc9d122f25cc034871/.osx |