[Bug 19475] New: Italic variants of both webfonts not being loaded

https://www.w3.org/Bugs/Public/show_bug.cgi?id=19475

          Priority: P2
            Bug ID: 19475
          Assignee: schepers@w3.org
           Summary: Italic variants of both webfonts not being loaded
        QA Contact: public-webplatform-bugs@w3.org
          Severity: normal
    Classification: Unclassified
                OS: All
          Reporter: scott@scottcranfill.com
          Hardware: All
            Status: NEW
           Version: unspecified
         Component: skin
           Product: webplatform.org

Both webfont families in use on the site, Bitter and Gudea, have true italic
variants that are not being loaded. In Safari, the browser simply shows the
upright regular style, but Firefox and Chrome fake the italic style by slanting
the text, which looks terrible. (IE still not displaying any webfonts, but I'll
file a separate bug for that.)

A little poking around in Firebug's Net panel shows that the .woff files are
being loaded from these location:

http://docs.webplatform.org/w/skins/webplatform/fonts/gudea-regular-webfont.woff
http://docs.webplatform.org/w/skins/webplatform/fonts/gudea-bold-webfont.woff
http://docs.webplatform.org/w/skins/webplatform/fonts/bitter-regular-webfont.woff
http://docs.webplatform.org/w/skins/webplatform/fonts/bitter-bold-webfont.woff

By simply changing the style in the filename to italic, I was able to download
both gudea-italic-webfont.woff and bitter-italic-webfont.woff, so the files are
present; it seems they just aren't being correctly called by the CSS.

Firebug's CSS panel shows that only the four regular and bold variants are
being called. So, all we need to do is add in the calls for the italic
variants:

@font-face {
    font-family: "Gudea";
    font-weight: italic;
    src: url("skins/webplatform/fonts/gudea-italic-webfont.eot?#iefix")
format("embedded-opentype"),
url("skins/webplatform/fonts/gudea-italic-webfont.woff") format("woff"),
url("skins/webplatform/fonts/gudea-italic-webfont.ttf") format("truetype"),
url("skins/webplatform/fonts/gudea-italic-webfont.svg#GudeaItalic")
format("svg");
}
@font-face {
    font-family: "Bitter";
    font-weight: italic;
    src: url("skins/webplatform/fonts/bitter-italic-webfont.eot?#iefix")
format("embedded-opentype"),
url("skins/webplatform/fonts/bitter-italic-webfont.woff") format("woff"),
url("skins/webplatform/fonts/bitter-italic-webfont.ttf") format("truetype"),
url("skins/webplatform/fonts/bitter-italic-webfont.svg#BitterItalic")
format("svg");
}

Thanks!

-- 
You are receiving this mail because:
You are the QA Contact for the bug.