Font Smoothing Fix

font-smoothing.js

/**
 * if you try to apply font smoothing
 * using css rules you'll notice that
 * Chrome ignores it
 * because antialiasing under Mac OSX
 * is deprecated (for good reasons).
 *
 * This workaround fixes this.
 * You should only use this if you
 * know what implications it has,
 * i.e. subpixel rendering vs this.
 *
 * one-liner (needs minimum one existing stylesheet):
 * document.styleSheets[0].insertRule('html {-webkit-font-smoothing: antialiased}', 0);
 **/

(function() {
    var sheet = function() {
        // https://davidwalsh.name/add-rules-stylesheets
        var style = document.createElement('style');
        style.appendChild(document.createTextNode(''));
        document.head.appendChild(style);
        return style.sheet;
    }

    var smooth = function() {
        var s = sheet(),
            // css selector
            c = '.font-smoothing',
            r = 'text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;';
        if (s.insertRule) {
            s.insertRule(c+' {'+ r +'}', 0);
        } else if (s.addRule) {
            s.addRule(c, r, 0);
        }
    }
    smooth();
})();