Skip to content

Instantly share code, notes, and snippets.

@eddieantonio

eddieantonio/install.sh

Last active January 26, 2016 08:53
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save eddieantonio/6803686 to your computer and use it in GitHub Desktop.
Save eddieantonio/6803686 to your computer and use it in GitHub Desktop.
Download ZIP
marginalize.js: Intended to be a bookmarklet that gives unstyled pages margins and a somewhat more readable font.
Raw
install.sh
#!/bin/sh
# If you have OS X and have UglifyJS installed, this uglifies Marginalize and
# puts the `javascript:` URL into the clipbord. Hoorah!
uglifyjs -c -m -o marginalize.min.js marginalize.js
printf 'javascript:' | cat - marginalize.min.js | pbcopy
Raw
marginalize.js
// Do you hate those pages that have no (or poor) styling attached to them and
// therefore use use up the entire width of your monitor, and choose an awful
// sans-serif font for reading on the screen? No? Is that just me? Well.
// This little piece of JavaScript **Marginalizes** the content, giving it a
// tight, readable margin, and better font for reading on an LCD screen.
//
// Written by eddieantonio.
//
(function() {
var css, style;
// Here's the style sheet!
css = 'body {' +
'margin: auto;' +
'max-width: 540px;' +
'font-family: "Helvetica Neue", Helvetica, sans-serif;' +
'}';
// Create a new style element.
style = document.createElement('style');
style.type = 'text/css';
// And place dat CSS in there.
style.appendChild(document.createTextNode(css));
// Now add that child block to the head! AW YEAH.
document.getElementsByTagName('head')[0].appendChild(style);
}());
Raw
marginalize.min.js
!function(){var e,t;e='body {margin: auto;max-width: 540px;font-family: "Helvetica Neue", Helvetica, sans-serif;}',t=document.createElement("style"),t.type="text/css",t.appendChild(document.createTextNode(e)),document.getElementsByTagName("head")[0].appendChild(t)}();
Raw
test.html
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8' />
<title>Page</title>
</head>
<body>
<h1> Hello, I'm a title! </h1>
<p>It's like a bowtie-wearing fuddy-duddy from 1997 made this attrocity.
<p><i>Marginalize</i> it, and it gets better!
</body>
</html>
@dimitriye98
Copy link

I made a toggleable version with margins responsive to screen size if you're interested:
https://gist.github.com/dimitriye98/2600188a418a729e371d

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment