Icons show up with just a border

[J-Cat]

I've started writing a custom app w/ react-ionic, and the icons all show up as just a "box". Also tested the kitchensink demo and had to update the app.scss as follows to get it to work at all.

@import "node_modules/reactionic/dist/scss/styles/reactionic";

Most styles etc seem to be working fine, but the icons just aren't working and I can't seem to figure out why.

I've also attached a screenshot of the issue.

Any help would be appreciated!

[ghost]

Copy node_modules/reactionic/src/fonts into /public. Because

node_modules/reactionic/src/styles/_reactionic.scss

is loading

$ionicons-font-path: "/fonts";

not $ionicons-font-path: "../fonts";

as it should.

[rbonslat]

I tried your solution but it still did not work. I copied the fonts folder and pasted it into the public folder under the app directory (reactionic-kitchensink-master\app\public\fonts). Did I miss something here? @alstephan

Thanks!

[ghost]

@rbonslat check what your $ionicons-font-path is set to then place the fonts folder in that path.

For me it was loading

$ionicons-font-path: "/fonts";

so looking for the fonts folder in /public. I am using reactionic with Meteor.