Add variables for the App Bar's font size and weight. (#1518)
Add variables for the App Bar's font size and weight and align the defaults to Google's Material Design specs, which say "Across form factors, text that appears in the app bar should use the Title style, Medium 20sp." (see https://material.io/guidelines/style/typography.html).old
parent
cd6a130bac
commit
f93040ee4d
|
@ -1,6 +1,8 @@
|
|||
:root {
|
||||
--appbar-color: var(--color-primary-dark);
|
||||
--appbar-contrast: var(--color-primary-contrast);
|
||||
--appbar-title-font-size: calc(2 * var(--unit));
|
||||
--appbar-title-font-weight: 500;
|
||||
--appbar-title-total-distance: calc(8 * var(--unit));
|
||||
--appbar-height: calc(6.4 * var(--unit));
|
||||
--appbar-height-m-portrait: calc(5.6 * var(--unit));
|
||||
|
|
|
@ -54,16 +54,11 @@
|
|||
|
||||
.title {
|
||||
flex-grow: 1;
|
||||
font-size: calc(1.8 * var(--unit));
|
||||
font-weight: bold;
|
||||
font-size: var(--appbar-title-font-size);
|
||||
font-weight: var(--appbar-title-font-weight);
|
||||
overflow-x: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
|
||||
& > small {
|
||||
font-size: calc(1.8 * var(--unit));
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.leftIcon {
|
||||
|
|
Loading…
Reference in New Issue