From 93937e606e848b08ba4662c4cab8a2cf8b735216 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@users.noreply.github.com>
Date: Thu, 9 Feb 2017 19:35:29 +0100
Subject: [PATCH] fix(snack-bar): improper button styling and improved handling
 of long text (#2991)

* Simplifies the snack bar styles, removing some redundancy.
* Fixes the snack bar using the `md-button` styles directly. This causes it to break if another `md-button` isn't on the page in order to import the styles. These changes switch to styling the snack bar button independently since it barely shares any styles with `md-button` anyway.
* Fixes a wrong selector that wasn't styling anything.
* Adds better handling for long text strings inside snack bars.

Fixes #2979.
---
 src/lib/snack-bar/simple-snack-bar.html |  3 +-
 src/lib/snack-bar/simple-snack-bar.scss | 41 ++++++++++++++-----------
 2 files changed, 24 insertions(+), 20 deletions(-)

diff --git a/src/lib/snack-bar/simple-snack-bar.html b/src/lib/snack-bar/simple-snack-bar.html
index 74df523640e..caf229d516c 100644
--- a/src/lib/snack-bar/simple-snack-bar.html
+++ b/src/lib/snack-bar/simple-snack-bar.html
@@ -1,3 +1,2 @@
 <span class="mat-simple-snackbar-message">{{message}}</span>
-<button md-button class="mat-simple-snackbar-action mat-button"
-        *ngIf="hasAction" (click)="dismiss()">{{action}}</button>
\ No newline at end of file
+<button class="mat-simple-snackbar-action" *ngIf="hasAction" (click)="dismiss()">{{action}}</button>
diff --git a/src/lib/snack-bar/simple-snack-bar.scss b/src/lib/snack-bar/simple-snack-bar.scss
index 27f6ebbd250..1610d7f6451 100644
--- a/src/lib/snack-bar/simple-snack-bar.scss
+++ b/src/lib/snack-bar/simple-snack-bar.scss
@@ -1,30 +1,35 @@
 @import '../core/style/variables';
+@import '../core/style/button-common';
+@import '../core/style/list-common';
 
-.mat-simple-snackbar {
+:host {
   display: flex;
   justify-content: space-between;
+  color: white;
+  line-height: 20px;
+  font: {
+    size: $mat-body-font-size-base;
+    family: $mat-font-family;
+  }
 }
 
 .mat-simple-snackbar-message {
-  box-sizing: border-box;
-  border: none;
-  color: white;
-  font-family: $mat-font-family;
-  font-size: 14px;
-  line-height: 20px;
-  outline: none;
-  text-decoration: none;
-  word-break: break-all;
+  @include mat-truncate-line;
 }
 
 .mat-simple-snackbar-action {
-  box-sizing: border-box;
-  color: white;
-  float: right;
-  font-weight: 600;
-  line-height: 20px;
-  margin: -5px 0 0 48px;
-  min-width: initial;
+  @include mat-button-reset;
+
+  background: none;
+  margin: -5px 0 0;
   padding: 5px;
   text-transform: uppercase;
-}
\ No newline at end of file
+  color: inherit;
+  line-height: inherit;
+  flex-shrink: 0;
+  font: {
+    family: inherit;
+    size: inherit;
+    weight: 600;
+  }
+}