Merge branch 'master' into list-border-refactor

ionic/components/app/typography.scss

@@ -100,3 +100,22 @@ sup {
 sub {
   bottom: -0.25em;
 }
+
+@each $color, $value in $colors {
+  h1, h2, h3, h4, h5, h6,
+  p,
+  span,
+  a,
+  small,
+  b,
+  i,
+  u,
+  strong,
+  em,
+  sub,
+  sup {
+     &[#{$color}] {
+        color: $value !important;
+     }
+  }
+}

ionic/components/button/button-fab.scss

@@ -50,7 +50,6 @@ button,
     icon {
       flex: 1;
       font-size: 2.8rem;
-      min-width: 64px;
     }
 
   }

ionic/components/modal/test/basic/e2e.ts

@@ -1,8 +1,16 @@
 
-it('should open action sheet', function() {
+it('should open modal', function() {
   element(by.css('.e2eOpenModal')).click();
 });
 
 it('should close with close button click', function() {
   element(by.css('.e2eCloseMenu')).click();
 });
+
+it('should open toolbar modal', function() {
+  element(by.css('.e2eOpenToolbarModal')).click();
+});
+
+it('should close toolbar modal', function() {
+  element(by.css('.e2eCloseToolbarModal')).click();
+});

ionic/components/modal/test/basic/index.ts

@@ -33,6 +33,10 @@ class MyAppCmp {
     this.modal.open(PlainPage);
   }
 
+  openToolbarModal() {
+    this.modal.open(ToolbarModal);
+  }
+
   openModalChildNav() {
     this.modal.open(ContactModal, {
       handle: 'my-awesome-modal'
@@ -63,6 +67,32 @@ class PlainPage {
   }
 }
 
+@Page({
+  template: `
+    <ion-toolbar>
+      <ion-title>Modals</ion-title>
+    </ion-toolbar>
+    <ion-toolbar primary>
+      <ion-title>Another toolbar</ion-title>
+    </ion-toolbar>
+
+
+    <ion-content padding>
+        <button block danger (click)="closeModal()" class="e2eCloseToolbarModal">
+          <icon close></icon>
+          Close Modal
+        </button>
+    </ion-content>
+  `
+})
+class ToolbarModal {
+  constructor(private modal: Modal) {}
+
+  closeModal() {
+    this.modal.get().close();
+  }
+}
+
 
 @Page({
   template: '<ion-nav [root]="rootView"></ion-nav>'

ionic/components/modal/test/basic/main.html

@@ -6,6 +6,9 @@
   <p>
     <button (click)="openModal()">Open plain modal</button>
   </p>
+  <p>
+    <button class="e2eOpenToolbarModal" (click)="openToolbarModal()">Open modal w/ toolbar</button>
+  </p>
   <p>
     <button (click)="openModalCustomAnimation()">Modal: Custom Animation</button>
   </p>

ionic/platform/cordova-ios.scss

@@ -9,14 +9,20 @@ $cordova-ios-toolbar-padding:    2rem   !default;
 
   ion-navbar-section,
   ion-navbar,
-  ion-menu > ion-toolbar {
+  ion-menu > ion-toolbar:first-child,
+  ion-menu > ion-toolbar:first-child ion-title,
+  ion-page.modal > ion-toolbar:first-child,
+  ion-page.modal > ion-toolbar:first-child ion-title, {
     min-height: $toolbar-ios-height + $cordova-ios-toolbar-padding;
     height: $toolbar-ios-height + $cordova-ios-toolbar-padding;
   }
 
   ion-navbar,
   ion-navbar ion-title,
-  ion-menu > ion-toolbar {
+  ion-menu > ion-toolbar:first-child,
+  ion-menu > ion-toolbar:first-child ion-title,
+  ion-page.modal > ion-toolbar:first-child,
+  ion-page.modal > ion-toolbar:first-child ion-title, {
     padding-top: $cordova-ios-toolbar-padding;
   }