[demo] use Oswald web font on shields

[claysmalley]

PR for preview purposes only; see discussion here

[1ec5]

There seems to be a race condition in which the font loads after some of the shields have been rendered and cached in the sprite sheet. This randomly affects different shields each time I reload the page in Firefox:

Each browser engine has slightly different behavior around Web fonts. If I remember correctly, WebKit generally draws blank text until the font loads, which would be worse in a case like this.

We might want to listen for a font loading event and trash and repopulate the shields in the sprite sheet at that time.

[zekefarwell]

I think the issue may be that different font weights are being used randomly. Four weights are loaded from google fonts:
https://github.com/ZeLonewolf/openstreetmap-americana/blob/a70c4c7bb3564e3c79eabbb77ffebb333566cc74/src/index.html#L9
I'm not sure why this would be happening, but the number shapes all look the same to me just randomly varying by weight with each page load.

[zekefarwell]

the number shapes all look the same to me

Scratch that. After some testing I've seen varying number shapes too. Like these different 9s here: