mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
fix(expansion-panel): set up typography styles (#5739)
* Sets up the typography for the expansion panel module. * Starts using the appropriate typography styles from the config and fixes the panel not having a defined font family. * Fixes the panel content inheriting its font size from the body.
This commit is contained in:
committed by
Jeremy Elbourn
parent
5d5ce83882
commit
e21b64cb5d
@@ -8,6 +8,7 @@
|
||||
@import '../../table/table-theme';
|
||||
@import '../../datepicker/datepicker-theme';
|
||||
@import '../../dialog/dialog-theme';
|
||||
@import '../../expansion/expansion-theme';
|
||||
@import '../../grid-list/grid-list-theme';
|
||||
@import '../../icon/icon-theme';
|
||||
@import '../../input/input-theme';
|
||||
@@ -45,6 +46,7 @@
|
||||
@include mat-table-typography($config);
|
||||
@include mat-datepicker-typography($config);
|
||||
@include mat-dialog-typography($config);
|
||||
@include mat-expansion-panel-typography($config);
|
||||
@include mat-grid-list-typography($config);
|
||||
@include mat-icon-typography($config);
|
||||
@include mat-input-typography($config);
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
@import '../core/theming/palette';
|
||||
@import '../core/theming/theming';
|
||||
@import '../core/typography/typography-utils';
|
||||
|
||||
@mixin mat-expansion-panel-theme($theme) {
|
||||
$background: map-get($theme, background);
|
||||
@@ -31,3 +32,17 @@
|
||||
color: mat-color($foreground, secondary-text);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin mat-expansion-panel-typography($config) {
|
||||
.mat-expansion-panel-header {
|
||||
font: {
|
||||
family: mat-font-family($config);
|
||||
size: mat-font-size($config, subheading-1);
|
||||
weight: mat-font-weight($config, subheading-1);
|
||||
}
|
||||
}
|
||||
|
||||
.mat-expansion-panel-content {
|
||||
@include mat-typography-level-to-styles($config, body-1);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -35,14 +35,12 @@ $mat-expansion-panel-header-height-expanded: 64px;
|
||||
.mat-expansion-panel-header-title {
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
font-size: 15px;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
.mat-expansion-panel-header-description {
|
||||
display: flex;
|
||||
flex-grow: 2;
|
||||
font-size: 15px;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user