infusion/src/framework/preferences/css/stylus/utils/Fonts.styl

Infusion is an application framework for developing flexible stuff with JavaScript

// Contains a utility function for changing font family
// !important is used for all styles to ensure that Preferences Framework's enactors are able to override the pages default styles.

fonts = {
    ".fl-font-arial": {
        fontFamily: "Arial"
    }
    ".fl-font-verdana": {
        fontFamily: "Verdana"
    }
    ".fl-font-times": {
        fontFamily: "Georgia, Times, Times New Roman, serif"
    }
    ".fl-font-comic-sans": {
        fontFamily: "Comic Sans MS, sans-serif"
    }
    ".fl-font-open-dyslexic": {
        fontFamily: "OpenDyslexic, sans-serif"
    }
}

// Defines any @font-face definitions needed by the enactors
fontFaces = {
    openDyslexic: {
        fontDirectory: "../../../lib/open-dyslexic/fonts/"
        fontFamily: "OpenDyslexic"
        definitions: {
            normal: {
                filename:"OpenDyslexic-Regular.woff"
                fontWeight: normal
                fontStyle: normal
                },
            bold: {
                filename:"OpenDyslexic-Bold.woff"
                fontWeight: 600
                fontStyle: normal
            },
            italic: {            
                filename:"OpenDyslexic-Italic.woff"
                fontWeight: normal
                fontStyle: italic
            },
            boldItalic: {
                filename:"OpenDyslexic-BoldItalic.woff"
                fontWeight: 600
                fontStyle: italic
            }
        }
    }
}

build-fonts-Enactors(textFont, textFontFaces) {

    // Build any necessary @font-face definitions
    for fontFamilyName in textFontFaces {
        fontDirectory = textFontFaces[fontFamilyName].fontDirectory
        fontFamily = textFontFaces[fontFamilyName].fontFamily
        fontFamilyDefs = textFontFaces[fontFamilyName].definitions;
        for def in fontFamilyDefs {                
                fontDef = textFontFaces[fontFamilyName][definitions][def]
                @font-face {
                    font-family: fontFamily;
                    src: url(fontDirectory + fontDef.filename);
                    font-weight: fontDef.fontWeight;
                    font-style: fontDef.fontStyle;
            }
            }
        }

    for fontName in textFont {
        font = textFont[fontName].fontFamily;
        
        {fontName},
        {fontName} * {
            &:not([class*='icon']) {
                font-family: unquote(font) !important;
            }
        }
    }    
}