Better Web Styles

README.md

Better Web Styles

This is meant to be used as a bookmarklet, where you click it and it'll apply some basic styling rules to the page you're on.

Primarily, this is designed to be used on those old websites that don't have any styling rules, e.g. http://www.ics.uci.edu/~fielding/pubs/dissertation/rest_arch_style.htm

bookmarklet.js

// the long version
(function(doc, url){
	var css = doc.createElement('style');
	css.setAttribute('type', 'text/css');
	css.appendChild(doc.createTextNode('@import url(' + url + ')'));
	doc.getElementsByTagName('head')[0].appendChild(css);
}(document, 'http://site.com/style.css'))

// the short version (make sure to update the URL)
(function(doc, url){var css = doc.createElement('style');css.setAttribute('type', 'text/css');css.appendChild(doc.createTextNode('@import url(' + url + ')'));doc.getElementsByTagName('head')[0].appendChild(css);}(document, 'http://site.com/style.css'))

style.css

/*
You will need to host this file somewhere. Github serves this file
as `text/plain` so the browser won't interpret it correctly.
*/
body {
    max-width: 30em;
    margin: 0 auto;
    font-size: 1.3em;
    line-height: 1.4;
    font-family: Georgia, Cambria, "Times New Roman", Times, serif;
}