Using external stylesheets in dart's polymer with polymer 0.9.5

Question

I am trying to do this:

<polymer-element name="my-element">
  <meta charset="utf-8">
  <template>
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
    Test...
    "<i class="fa fa-anchor"></i>"
  </template>
  <script type="application/dart" src="my-element.dart"></script>
</polymer-element>

I simply want a custom element with an external use of fontawesome. But the problem is that it loads the .css file but not the font. In the 0.10-dev version it seems to be working. Does someone maybe know if that is not supported int the 0.9.5-release?

Regards and Thanks Robert

Answer 1

It looks like @font-face is broken in Version 1.3.3/1.3.4 of Dart and in polmyer versions 0.9.5 and 0.10.0*. The solution was to globally put the @font-face code and then use the .css file and applyAuthorStyles on each element that requires the fonts. NOTE that applyAuthorStyles might be removed any time soon. So this will not be an all-time solution.

Bug report: https://code.google.com/p/dart/issues/detail?id=18581