From 0bc45cab425ca27db028850645278de9715c4c54 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@users.noreply.github.com>
Date: Thu, 13 Jan 2022 16:31:35 +0100
Subject: [PATCH] fix(material/snack-bar): handle long single-line content
 (#24135)

Fixes that long strings without spaces were breaking the layout of the snack bar.

Fixes #21681.
---
 src/material/snack-bar/simple-snack-bar.html | 2 +-
 src/material/snack-bar/simple-snack-bar.scss | 5 +++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/material/snack-bar/simple-snack-bar.html b/src/material/snack-bar/simple-snack-bar.html
index a581b91d6dd4..c0326acdba11 100644
--- a/src/material/snack-bar/simple-snack-bar.html
+++ b/src/material/snack-bar/simple-snack-bar.html
@@ -1,4 +1,4 @@
-<span>{{data.message}}</span>
+<span class="mat-simple-snack-bar-content">{{data.message}}</span>
 <div class="mat-simple-snackbar-action"  *ngIf="hasAction">
   <button mat-button (click)="action()">{{data.action}}</button>
 </div>
diff --git a/src/material/snack-bar/simple-snack-bar.scss b/src/material/snack-bar/simple-snack-bar.scss
index 50188497237a..977dc8556ae2 100644
--- a/src/material/snack-bar/simple-snack-bar.scss
+++ b/src/material/snack-bar/simple-snack-bar.scss
@@ -30,3 +30,8 @@ $button-vertical-margin: -(math.div($button-height - $line-height, 2));
     margin-right: $button-horizontal-margin;
   }
 }
+
+.mat-simple-snack-bar-content {
+  overflow: hidden;
+  text-overflow: ellipsis;
+}