fix(icon): correct display issues

Author: Ryan A. Johnson

source/components/icon/HxIcon.less

@@ -1,18 +1,7 @@
-:host {
-  background-color: inherit;
-  color: inherit;
-  display: inline-block;
-  height: 1em;
-  width: 1em;
+@import (reference) './hx-icon';
 
-  /*
-    if the requested icon type is not valid (nothing injected),
-    make sure the element doesn't consume space on the page.
-  */
-  &:empty {
-    height: 0;
-    width: 0;
-  }
+:host {
+  &:extend(hx-icon);
 }
 
 ::slotted(svg) {

source/components/icon/hx-icon.less

@@ -0,0 +1,8 @@
+hx-icon {
+  background-color: inherit;
+  color: inherit;
+  display: inline-block;
+  flex-shrink: 0;
+  height: 1em;
+  width: 1em;
+}

source/helix-ui.less

@@ -19,6 +19,7 @@
 @import 'checkbox/checkbox';
 @import 'code/code';
 @import 'grid/grid';
+@import 'icon/hx-icon';
 @import 'navigation/navigation';
 @import 'reveal/reveal';
 @import 'table/table';