From a98c02ebd6c4a44323eebd4d93e75b89302a1052 Mon Sep 17 00:00:00 2001
From: david <david.sautter@web.de>
Date: Thu, 17 Nov 2016 13:51:24 +0100
Subject: [PATCH] feat(tabs): md-stretch-tabs

Stretch tabs grow until they fill the tab group width.

Closes #1353
---
 src/demo-app/tabs/tabs-demo.html | 9 +++++++++
 src/lib/tabs/tab-group.scss      | 5 +++++
 2 files changed, 14 insertions(+)

diff --git a/src/demo-app/tabs/tabs-demo.html b/src/demo-app/tabs/tabs-demo.html
index 3d8943a29714..fe5deabe9a41 100644
--- a/src/demo-app/tabs/tabs-demo.html
+++ b/src/demo-app/tabs/tabs-demo.html
@@ -97,6 +97,15 @@ <h1>Tab Group Demo - Fixed Height</h1>
   </md-tab>
 </md-tab-group>
 
+<h1>Stretched Tabs</h1>
+
+<md-tab-group class="demo-tab-group" style="height: 200px" md-stretch-tabs>
+  <md-tab *ngFor="let tab of tabs" [disabled]="tab.disabled">
+    <template md-tab-label>{{tab.label}}</template>
+    {{tab.content}}
+  </md-tab>
+</md-tab-group>
+
 
 <h1>Async Tabs</h1>
 
diff --git a/src/lib/tabs/tab-group.scss b/src/lib/tabs/tab-group.scss
index 1b4dee349f51..ff7b36338f76 100644
--- a/src/lib/tabs/tab-group.scss
+++ b/src/lib/tabs/tab-group.scss
@@ -25,6 +25,11 @@
   }
 }
 
+:host[md-stretch-tabs] .md-tab-label {
+  flex-basis: 0;
+  flex-grow: 1;
+}
+
 // The ink bar that displays next to the active tab
 md-ink-bar {
   @include ink-bar;