fix: replace font-awesome icons with utf-8 symbols as a workaround to problem with fonts bundling

Author: rychkog

gulpfile.js

@@ -1,16 +1,21 @@
 'use strict';
 
 const gulp = require('gulp');
-const stylus = require('gulp-stylus');
-const gitignore = require('gulp-gitignore');
+const stylus = require('stylus');
 const ghPages = require('gulp-gh-pages');
+const gitignore = require('gulp-gitignore');
+const gulpStylus = require('gulp-stylus');
 
 const SAME_DIRECTORY = '.';
 
 gulp.task('stylus', () => {
   return gulp.src('**/*.styl')
     .pipe(gitignore())
-    .pipe(stylus())
+    .pipe(gulpStylus({
+      define: {
+        url: stylus.resolver()
+      }
+    }))
     .pipe(gulp.dest(SAME_DIRECTORY));
 });
 

index.ts

@@ -10,7 +10,7 @@ import {
   NodeDestructiveEvent
 } from './src/branchy.types';
 
-export * from './src/branchy.component';
+import {BranchyComponent} from './src/branchy.component'
 
 export {
   TreeModel,
@@ -21,5 +21,6 @@ export {
   NodeRenamedEvent,
   NodeMovedEvent,
   NodeSelectedEvent,
-  NodeDestructiveEvent
+  NodeDestructiveEvent,
+  BranchyComponent
 };

package.json

@@ -20,6 +20,7 @@
     "tree",
     "ng2",
     "angular2",
+    "ng2-tree",
     "branch",
     "tree-view",
     "branchy"
@@ -37,13 +38,12 @@
     "deploy:demo": "npm run build:demo && gulp deploy"
   },
   "dependencies": {
-    "@angular/common": "2.0.0-rc.3",
-    "@angular/compiler": "2.0.0-rc.3",
-    "@angular/core": "2.0.0-rc.3",
-    "@angular/platform-browser": "2.0.0-rc.3",
-    "@angular/platform-browser-dynamic": "2.0.0-rc.3",
+    "@angular/common": "2.0.0-rc.4",
+    "@angular/compiler": "2.0.0-rc.4",
+    "@angular/core": "2.0.0-rc.4",
+    "@angular/platform-browser": "2.0.0-rc.4",
+    "@angular/platform-browser-dynamic": "2.0.0-rc.4",
     "es6-shim": "0.35.1",
-    "font-awesome": "4.6.3",
     "lodash": "4.13.1",
     "reflect-metadata": "0.1.3",
     "rxjs": "5.0.0-beta.6",

src/branchy.component.styl

@@ -5,7 +5,6 @@
 node-folding(icon)
   content icon
   color color-dark-grey
-  font-family primary-icons-font-family
 
 // styles
 ul
@@ -57,6 +56,7 @@ li
   .folding
     width 25px
     display inline-block
+    line-height 1px
     padding 0 5px
     font-weight bold
 
@@ -72,7 +72,7 @@ li
 
     &.node-leaf
       color color-black
-      vertical-align top
-      font-size 13px
+      text-align center
+      font-size 0.89em
       &:before
         node-folding(tag-icon)

src/common/styles/fonts.styl

@@ -1,19 +1,7 @@
-@font-face
-  font-family: 'FontAwesome';
-  src: url(/node_modules/font-awesome/fonts/fontawesome-webfont.eot);
-  src: url(/node_modules/font-awesome/fonts/fontawesome-webfont.eot?#iefix) format('embedded-opentype'),
-    url(/node_modules/font-awesome/fonts/fontawesome-webfont.woff2) format('woff2'),
-    url(/node_modules/font-awesome/fonts/fontawesome-webfont.woff) format('woff'),
-    url(/node_modules/font-awesome/fonts/fontawesome-webfont.ttf) format('truetype'),
-    url(/node_modules/font-awesome/fonts/fontawesome-webfont.svg#bariolthin) format('svg')
-  font-weight normal
-  font-style normal
-
 primary-font-family = "Helvetica Neue", Helvetica, Arial, sans-serif
-primary-icons-font-family = 'FontAwesome'
 
-tag-icon = '\f02b'
-folder-icon = '\f114'
-folder-opened-icon = '\f115'
-rename-icon = '\f040'
-remove-icon = '\f00d'
+tag-icon = '\25CF'
+folder-icon = '\25B6'
+folder-opened-icon = '\25BC'
+rename-icon = '\270E'
+remove-icon = '\2716'