From cf8c5d134a31d12f040d8a658cab8591edae91f2 Mon Sep 17 00:00:00 2001
From: crisbeto <crisbeto@abv.bg>
Date: Thu, 22 Mar 2018 21:44:08 +0100
Subject: [PATCH] fix(bottom-sheet): handle overflowing content

Implements the `max-width` for the bottom sheet based on the spec and adds a `max-height`, in order for it to handle large amounts of content correctly.
---
 src/lib/bottom-sheet/bottom-sheet-container.scss | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/lib/bottom-sheet/bottom-sheet-container.scss b/src/lib/bottom-sheet/bottom-sheet-container.scss
index bcf86afabd79..9165eccde54a 100644
--- a/src/lib/bottom-sheet/bottom-sheet-container.scss
+++ b/src/lib/bottom-sheet/bottom-sheet-container.scss
@@ -17,6 +17,8 @@ $mat-bottom-sheet-container-horizontal-padding: 16px !default;
   box-sizing: border-box;
   display: block;
   outline: 0;
+  max-height: 80vh;
+  overflow: auto;
 
   @include cdk-high-contrast {
     outline: 1px solid;
@@ -25,12 +27,15 @@ $mat-bottom-sheet-container-horizontal-padding: 16px !default;
 
 .mat-bottom-sheet-container-medium {
   min-width: $_mat-bottom-sheet-width-increment * 6;
+  max-width: calc(100vw - #{$_mat-bottom-sheet-width-increment * 2});
 }
 
 .mat-bottom-sheet-container-large {
   min-width: $_mat-bottom-sheet-width-increment * 8;
+  max-width: calc(100vw - #{$_mat-bottom-sheet-width-increment * 4});
 }
 
 .mat-bottom-sheet-container-xlarge {
   min-width: $_mat-bottom-sheet-width-increment * 9;
+  max-width: calc(100vw - #{$_mat-bottom-sheet-width-increment * 6});
 }