refactor(.hero-stats): restyle status meters

Add text to icons to clarify purpose of each bar
Tidy up tooltip behaviour
Aesthetic changes

views/shared/header/header.jade

@@ -5,31 +5,32 @@
     // avatar
     .herobox-wrap.main-herobox(ng-controller='UserCtrl')
       +herobox({main:1})
-
     // stat bars
     .hero-stats
-      .meter.health(title=env.t('health'))
+      .meter.health(tooltip=env.t('health'))
         .bar(style='width: {{Shared.percent(user.stats.hp, 50)}}%;')
-        span.meter-text
+        span.meter-text.title
           span.glyphicon.glyphicon-heart
-          |  
+          | HP
+        span.meter-text.value
           | {{Math.ceil(user.stats.hp)}} / 50
-      .meter.experience(title=env.t('experience'))
+      .meter.experience(tooltip=env.t('experience'))
         .bar(style='width: {{Shared.percent(user.stats.exp,Shared.tnl(user.stats.lvl))}}%;')
-        span.meter-text
+        span.meter-text.title
           span.glyphicon.glyphicon-star
-          |  
+          | XP 
+        span.meter-text.value
+          span(ng-show='user.history.exp', tooltip=env.t('progress'))
+            a(ng-click='toggleChart("exp")').glyphicon.glyphicon-signal 
+          span
           | {{Math.floor(user.stats.exp) | number:0}} / {{Shared.tnl(user.stats.lvl) | number:0}}
-          // FIXME doesn't look great here, but the "Experience" CSS title rollover covers it where it was before
-          span(ng-show='user.history.exp')
-            a(ng-click='toggleChart("exp")', tooltip=env.t('progress'))
-              |  
-              span.glyphicon.glyphicon-signal
-      .meter.mana(title='Mana', ng-if='user.flags.classSelected && !user.preferences.disableClasses')
+      .meter.mana(tooltip='Mana', ng-if='user.flags.classSelected && !user.preferences.disableClasses')
         .bar(style='width: {{user.stats.mp / user._statsComputed.maxMP * 100}}%;')
-        span.meter-text
+        span.meter-text.title
           span.glyphicon.glyphicon-fire
-          |  
+          | MP
+        span.meter-text.value
+          span
           | {{Math.floor(user.stats.mp)}} / {{user._statsComputed.maxMP}}
 
     // party