Webfonts with ClientBundle, UiBinder

I'd like to try out webfonts with my app. I can use the *.woff file from Font Awesome (http://fontawesome.io/) by adding it to my WAR directory and a link to a modified version of their CSS in my module's welcome-file (I'd like to go with just *.woff, since it's small and works across browsers). I would like to do things more the GWT way--UiBinder, ClientBundle, etc. I feel I'm close, but it's not coming together.

I've tried it first in UiBinder. I just tried adding the FontAwesome CSS:

<ui:style field="fonts" src="../../fonts/fontAwesome.css" />

...

<i class="{fonts.fa} {fonts.fa-camera-retro} {fonts.fa-x3}"></i>

I see nothing. Of course, this misses the *.woff. I can add that with 

  

<ui:data field='woff' src='../../fonts/fonts/fontawesome-webfont.woff' />

but where and how to I reference it? I can add a style such as

@url fawoff woff;

.face {

 font-family: fawoff;

}

but adding that style to the class attribute doesn't work.

Furthermore, I'd like to wrap things a ClientBundle. I'd like my app to match file icons with file type from a document repository, and Font Awesome has a nice selection of file icons. I've created a ClientBundle but I don't know how to get make the CssResource and DataResource work together:

public interface FontAwesomeBundle extends ClientBundle {

  

  FontAwesomeBundle INSTANCE = GWT.create(FontAwesomeBundle.class);

  

  @NotStrict

  @Source("./fonts/fontAwesome.css")

  FontAwesome fa();

  

  @Source("./fonts/fontawesome-webfont.woff")

  DataResource woff();

  

  public interface FontAwesome extends CssResource {

    String fa();

    

    @ClassName("fa-lg")

    String large();

    

    @ClassName("fa-3x")

    String scale3();

    

    @ClassName("fa-camera-retro")

    String cameraRetro();

    ...

  }

}

What am I missing?

--
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.