back button updates

ionic/components/icon/icon.ts

@@ -68,11 +68,13 @@ export class IconDirective {
   onInit() {
     if (this.name) {
       this.ele.classList.add(this.name);
-      this.label = this.name;
+      this.label = this.name.replace('ion-', '').replace('ios-', '').replace('md-', '').replace('-', '');
     }
   }
 }
 
+
+
 @IonicComponent({
   selector: 'ion-icon',
   properties: [

ionic/components/nav-bar/extensions/material.scss

@@ -9,8 +9,8 @@ $navbar-order-material: (
   secondary: 40
 );
 
-$navbar-material-height:                  6.4rem !default;
+$navbar-material-height:                  5.6rem !default;
-$navbar-material-background:              get-color(primary, base) !default;//#f7f7f8 !default;
+$navbar-material-background:              get-color(primary, base) !default;
 
 $navbar-material-title-font-size:         2rem !default;
 $navbar-material-button-font-size:        24px !default;
@@ -22,7 +22,7 @@ $navbar-material-button-text-color:       #fff !default; //#007aff !default;
   background: $navbar-material-background;
 
   .toolbar-inner-title {
-    padding: 0px 16px;
+    padding: 0;
   }
 
   .toolbar-inner {
@@ -57,7 +57,6 @@ $navbar-material-button-text-color:       #fff !default; //#007aff !default;
     border: none;
     box-shadow: none;
 
-
     padding: 0;
     margin: 0 10px;
 
@@ -65,4 +64,16 @@ $navbar-material-button-text-color:       #fff !default; //#007aff !default;
     min-width: 0;
   }
 
+  .back-button {
+    margin: 0;
+  }
+
+  .back-button-icon {
+    margin: 0;
+    font-weight: normal;
+    font-size: 24px;
+    min-width: 56px;
+    text-align: left;
+  }
+
 }

ionic/components/nav-bar/nav-bar.scss

@@ -43,15 +43,13 @@
 @each $color, $value in $colors {
 
   .navbar[#{$color}] {
-      background-color: get-color($color, base);
+    background-color: get-color($color, base);
 
-      ion-title {
+    ion-title,
-        color: white;
+    button,
-      }
+    [button] {
-      button,
+      color: get-color($color, inverse);
-      [button] {
+    }
-        color: white;
-      }
   }
 
 }

ionic/components/nav-bar/nav-bar.ts

@@ -15,8 +15,8 @@ import * as dom from '../../util/dom';
 @IonicView({
   template: `
     <div class="toolbar-inner">
-      <button class="back-button button">
+      <button class="back-button">
-        <icon class="back-button-icon ion-ios-arrow-back"></icon>
+        <icon class="back-button-icon" [name]="bbClass"></icon>
         <span class="back-button-text">
           <span class="back-default" [inner-text]="bbDefault"></span>
           <span class="back-title" [inner-text]="bbText"></span>
@@ -43,15 +43,16 @@ import * as dom from '../../util/dom';
   ]
 })
 export class Navbar extends Ion {
-  constructor(item: ViewItem, elementRef: ElementRef, ionicConfig: IonicConfig, app: IonicApp) {
+  constructor(item: ViewItem, elementRef: ElementRef, config: IonicConfig, app: IonicApp) {
-    super(elementRef, ionicConfig);
+    super(elementRef, config);
 
     this.app = app;
     this.eleRef = elementRef;
     this.itemEles = [];
     item.navbarView(this);
 
-    this.bbDefault = 'Back';
+    this.bbClass = config.setting('backButtonIcon');
+    this.bbDefault = config.setting('backButtonText');
     this.bbText = '';
   }
 

ionic/platform/registry.ts

@@ -4,6 +4,7 @@ import {Platform} from './platform';
 Platform.register({
   name: 'core',
   settings: {
+    backButtonText: 'Back',
     mode: 'ios',
     iconMode: 'ios',
     viewTransition: 'ios'
@@ -49,6 +50,8 @@ Platform.register({
     'tablet'
   ],
   settings: {
+    backButtonText: '',
+    backButtonIcon: 'ion-android-arrow-back',
     mode: 'md',
     iconMode: 'md',
     type: 'overlay',
@@ -74,6 +77,8 @@ Platform.register({
     'iphone'
   ],
   settings: {
+    backButtonText: 'Back',
+    backButtonIcon: 'ion-ios-arrow-back',
     mode: 'ios',
     iconMode: 'ios',
     tapPolyfill: true,