improve style of StatusBar & display pathname from StatusBar

Author: Rokt33r

browser/main/StatusBar/StatusBar.styl

@@ -1,9 +1,19 @@
 .root
   absolute bottom left right
-  height 24px
+  height $statusBar-height
   border-top $ui-border
   background-color $ui-backgroundColor
 
+.pathname
+  absolute left
+  height 24px
+  overflow ellipsis
+  width 350px
+  line-height 24px
+  font-size 12px
+  padding 0 15px
+  color $ui-inactive-text-color
+
 .zoom
   navButtonColor()
   absolute right
@@ -21,3 +31,8 @@
   border-width 0 0 0 1px
   border-style solid
   border-color $ui-borderColor
+  &:active .update-icon
+    color white
+
+.update-icon
+  color $brand-color

browser/main/StatusBar/index.js

@@ -49,14 +49,16 @@ class StatusBar extends React.Component {
   }
 
   render () {
-    let { config } = this.props
+    let { config, location } = this.props
+
     return (
       <div className='StatusBar'
         styleName='root'
       >
+        <div styleName='pathname'>{location.pathname}</div>
         {this.state.updateAvailable
           ? <button onClick={this.updateApp} styleName='update'>
-            <i className='fa fa-cloud-download'/> Update is available!
+            <i styleName='update-icon' className='fa fa-cloud-download'/> Update is available!
           </button>
           : null
         }