trouble with font-face in meteor based on Discover Meteor microscope app
- by charliemagee
I've gone through the Discover Meteor book and successfully created Microscope. Now I'm trying to build my own app based on what I've learned. I want to use @font-face for fonts and icon fonts. I can't get them to show up.
Here's my directory structure: client/stylesheets
I've got my fonts in the stylesheets folder. I'm using scss, by the way, and that's working fine with the scss package. Here's how I'm calling the fonts in the stylesheet:
@font-face {
font-family: 'AmaranthItalic';
src: url('Amaranth-Italic-webfont.eot');
src: url('Amaranth-Italic-webfont.eot?#iefix') format('embedded-opentype'),
url('Amaranth-Italic-webfont.woff') format('woff'),
url('Amaranth-Italic-webfont.ttf') format('truetype'),
url('Amaranth-Italic-webfont.svg#AmaranthItalic') format('svg');
font-weight: normal;
font-style: normal;
}
I've tried '/stylesheets/Amaranth etc. and all other combinations that I can think of and nothing is working. I've tried putting them in public. Nothing.
I know files like this are supposed to go in public folder but that seems to kill the stylesheets entirely. I'm not sure why the Microscope directory design would cause that to happen.
These question/answers didn't help:
using font-face in meteor?
Icon font from fontello not working with Meteor js
Thanks for any help.