Skip to content

Commit d1abc9e

Browse files
devversionkara
authored andcommitted
fix(toolbar): incorrect height for soft-keyboards (#3312)
Fixes #3233
1 parent cbd1ff9 commit d1abc9e

File tree

1 file changed

+5
-7
lines changed

1 file changed

+5
-7
lines changed

src/lib/toolbar/toolbar.scss

+5-7
Original file line numberDiff line numberDiff line change
@@ -51,12 +51,10 @@ $mat-toolbar-padding: 16px !default;
5151
// Set the default height for the toolbar.
5252
@include mat-toolbar-height($mat-toolbar-height-desktop);
5353

54-
// Specific height for mobile devices in portrait mode.
55-
@media ($mat-xsmall) and (orientation: portrait) {
54+
// As per specs, mobile devices will use a different height for toolbars than for desktop.
55+
// The height for mobile landscape devices has been ignored since relying on `@media orientation`
56+
// is causing issues on devices with a soft-keyboard.
57+
// See: https://material.io/guidelines/layout/structure.html#structure-app-bar
58+
@media ($mat-xsmall) {
5659
@include mat-toolbar-height($mat-toolbar-height-mobile-portrait);
5760
}
58-
59-
// Specific height for mobile devices in landscape mode.
60-
@media ($mat-small) and (orientation: landscape) {
61-
@include mat-toolbar-height($mat-toolbar-height-mobile-landscape);
62-
}

0 commit comments

Comments
 (0)