skills/angular__angular
1
0
Fork 0
mirror of https://github.com/angular/angular.git synced 2026-09-14 13:54:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(bottom-sheet): align with 2018 material design spec (#12625)

Browse Source 
Aligns the bottom sheet component with the most-recent Material Design spec.
This commit is contained in:
Kristiyan Kostadinov
2018-08-16 05:02:54 +02:00
committed by mmalerba
parent 009f211e47
commit ceb2051b85
2 changed files with 10 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/bottom-sheet/_bottom-sheet-theme.scss
+1 -4
View File
@@ -13,9 +13,6 @@
@mixin mat-bottom-sheet-typography($config) {
.mat-bottom-sheet-container {
// Note: we don't use the line-height, because it's way too big.
font-family: mat-font-family($config);
font-size: mat-font-size($config, subheading-2);
font-weight: mat-font-weight($config, subheading-2);
@include mat-typography-level-to-styles($config, body-1);
}
}
src/lib/bottom-sheet/bottom-sheet-container.scss
+9
View File
@@ -25,17 +25,26 @@ $mat-bottom-sheet-container-horizontal-padding: 16px !default;
}
}
// Applies a border radius to the bottom sheet. Should only be applied when it's not full-screen.
%_mat-bottom-sheet-container-border-radius {
border-top-left-radius: 4px;
border-top-right-radius: 4px;
}
.mat-bottom-sheet-container-medium {
@extend %_mat-bottom-sheet-container-border-radius;
min-width: $_mat-bottom-sheet-width-increment * 6;
max-width: calc(100vw - #{$_mat-bottom-sheet-width-increment * 2});
}
.mat-bottom-sheet-container-large {
@extend %_mat-bottom-sheet-container-border-radius;
min-width: $_mat-bottom-sheet-width-increment * 8;
max-width: calc(100vw - #{$_mat-bottom-sheet-width-increment * 4});
}
.mat-bottom-sheet-container-xlarge {
@extend %_mat-bottom-sheet-container-border-radius;
min-width: $_mat-bottom-sheet-width-increment * 9;
max-width: calc(100vw - #{$_mat-bottom-sheet-width-increment * 6});
}