From 2b9c470b1c555210c7a4b25c57cce6ddb53a3732 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@users.noreply.github.com>
Date: Fri, 6 Oct 2017 22:25:08 +0200
Subject: [PATCH] fix(snack-bar): add content fade in animation (#7504)

---
 src/lib/snack-bar/simple-snack-bar.scss |  1 +
 src/lib/snack-bar/simple-snack-bar.ts   | 11 +++++++++++
 2 files changed, 12 insertions(+)

diff --git a/src/lib/snack-bar/simple-snack-bar.scss b/src/lib/snack-bar/simple-snack-bar.scss
index f052fe4d29f3..dc25b4c8fc21 100644
--- a/src/lib/snack-bar/simple-snack-bar.scss
+++ b/src/lib/snack-bar/simple-snack-bar.scss
@@ -8,6 +8,7 @@ $mat-snack-bar-button-margin: 48px !default;
   display: flex;
   justify-content: space-between;
   line-height: 20px;
+  opacity: 1;
 }
 
 .mat-simple-snackbar-action {
diff --git a/src/lib/snack-bar/simple-snack-bar.ts b/src/lib/snack-bar/simple-snack-bar.ts
index 982e7269f93a..1433adbc3717 100644
--- a/src/lib/snack-bar/simple-snack-bar.ts
+++ b/src/lib/snack-bar/simple-snack-bar.ts
@@ -7,6 +7,8 @@
  */
 
 import {Component, ViewEncapsulation, Inject, ChangeDetectionStrategy} from '@angular/core';
+import {trigger, style, transition, animate} from '@angular/animations';
+import {AnimationCurves, AnimationDurations} from '@angular/material/core';
 import {MatSnackBarRef} from './snack-bar-ref';
 import {MAT_SNACK_BAR_DATA} from './snack-bar-config';
 
@@ -23,7 +25,16 @@ import {MAT_SNACK_BAR_DATA} from './snack-bar-config';
   encapsulation: ViewEncapsulation.None,
   preserveWhitespaces: false,
   changeDetection: ChangeDetectionStrategy.OnPush,
+  animations: [
+    trigger('contentFade', [
+      transition(':enter', [
+        style({opacity: '0'}),
+        animate(`${AnimationDurations.COMPLEX} ${AnimationCurves.STANDARD_CURVE}`)
+      ])
+    ])
+  ],
   host: {
+    '[@contentFade]': '',
     'class': 'mat-simple-snackbar',
   }
 })