Re: Webfonts with ClientBundle, UiBinder

On Tuesday, September 23, 2014 11:36:59 PM UTC+2, Jens wrote:

You need to define the font using @font-face.

By default fontawesome.css contains

@font-face {

  font-family: 'FontAwesome';

  src: url('../fonts/fontawesome-webfont.eot?v=4.2.0');

  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg');

  font-weight: normal;

  font-style: normal;

}

at the very top of its CSS file which tells the browser about the font "FontAwesome". You need to adjust this block to make it work. 

Since you only want woff you can remove everything else:

@font-face {

  font-family: 'FontAwesome';

  src: url('../fonts/fontawesome-webfont.woff?v=4.2.0') format('woff');

  font-weight: normal;

  font-style: normal;

}

Next you have to decide if you want to embed the font into your GWT app as DataResource or if the browser should load the file normally like defined above. If you want to use DataResource you need to replace the url() part with the @url constant of GWT. If you want to leave it as is, I would create a public folder, place all fonts in "public/fonts" and then remove "../" from the url(). That way the font files will be copied to your war/app/fonts folder whenever you GWT compile your app and should be accessible by the browser. You might want to rename font files to contain ".cache." if you place them into the public folder so your web server sets correct caching headers.

I'd just use a DataResource in any case, and annotate it with @DoNotEmbed if I don't want the font embedded as a "data:" URL.

GWT will take care of the copying, renaming, etc.

Actually, if the font file is "big enough" (the data: URL would be longer than "(2 << 15) - 1" chars), it won't be embedded anyway, whether you use @DoNotEmbed or not.

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at http://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/d/optout.