From bd07165229d71e3402f3b7b35b7f5b8875d99c70 Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Thu, 29 Dec 2016 04:05:47 +0100 Subject: [PATCH 1/3] fix(toolbar): prevent content overflow and line-wrapping * No longer wraps lines inside of a `md-toolbar-row` * Overflow for X-axis and Y-Axis are now hidden. Developers should use multiple `md-toolbar-row` elements or can always overwrite the styles. Fixes #2451 --- src/lib/toolbar/toolbar.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/lib/toolbar/toolbar.scss b/src/lib/toolbar/toolbar.scss index 80b31dec4757..1657ee7fd011 100644 --- a/src/lib/toolbar/toolbar.scss +++ b/src/lib/toolbar/toolbar.scss @@ -41,6 +41,10 @@ md-toolbar { // Flexbox Vertical Alignment flex-direction: row; align-items: center; + + // Ensure toolbar content doesn't wrap and exceed the md-toolbar-row width. Ellipsis doesn't work on flex elements. + white-space: nowrap; + overflow: hidden; } } From 9adf9c1a18f258e95f88431381f7d0e49fe3ca50 Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Fri, 20 Jan 2017 21:27:31 +0100 Subject: [PATCH 2/3] Address comment --- src/lib/toolbar/toolbar.scss | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/lib/toolbar/toolbar.scss b/src/lib/toolbar/toolbar.scss index 1657ee7fd011..ecc71df738f3 100644 --- a/src/lib/toolbar/toolbar.scss +++ b/src/lib/toolbar/toolbar.scss @@ -42,9 +42,8 @@ md-toolbar { flex-direction: row; align-items: center; - // Ensure toolbar content doesn't wrap and exceed the md-toolbar-row width. Ellipsis doesn't work on flex elements. + // The toolbar should not wrap text by default. Developers can still overwrite it. white-space: nowrap; - overflow: hidden; } } From cb61763b5b58cfe2e1a63b1c0e06a5eadc058c96 Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Fri, 20 Jan 2017 21:30:08 +0100 Subject: [PATCH 3/3] Update comment --- src/lib/toolbar/toolbar.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/lib/toolbar/toolbar.scss b/src/lib/toolbar/toolbar.scss index ecc71df738f3..1f2e972bb2d0 100644 --- a/src/lib/toolbar/toolbar.scss +++ b/src/lib/toolbar/toolbar.scss @@ -42,7 +42,8 @@ md-toolbar { flex-direction: row; align-items: center; - // The toolbar should not wrap text by default. Developers can still overwrite it. + // Per Material specs a toolbar cannot have multiple lines inside of a single row. + // Disable text wrapping inside of the toolbar. Developers are still able to overwrite it. white-space: nowrap; } }