DEV/material-components_material-web
1
0
Fork 0
mirror of https://github.com/material-components/material-web.git synced 2026-01-09 07:21:09 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(dialogs): remove font shorthand tokens

Browse Source 
BREAKING CHANGE: replace `headline-text-type` and `supporting-text-type` tokens with `-font`, `-size`, `-line-height`, and `-weight`

PiperOrigin-RevId: 563160825
This commit is contained in:
Elizabeth Mitchell 2023-09-06 11:16:25 -07:00 committed by Copybara-Service
parent 8894c20c6b
commit 81e11e09fa
3 changed files with 20 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
dialog/internal/_dialog.scss
View File

@ -126,7 +126,10 @@
color: var(--_headline-color);
display: flex;
flex-direction: column;
font: var(--_headline-type);
font-family: var(--_headline-font);
font-size: var(--_headline-size);
line-height: var(--_headline-line-height);
font-weight: var(--_headline-weight);
position: relative;
}
@ -205,7 +208,10 @@
.content {
color: var(--_supporting-text-color);
font: var(--_supporting-text-type);
font-family: var(--_supporting-text-font);
font-size: var(--_supporting-text-size);
line-height: var(--_supporting-text-line-height);
font-weight: var(--_supporting-text-weight);
height: min-content; // Needed for Safari
position: relative;
}

4
docs/components/dialog.md
View File

@ -190,9 +190,9 @@ Token | Default value
----------------------------------- | ---------------------------------------
`--md-dialog-container-color` | `--md-sys-color-surface-container-high`
`--md-dialog-headline-color` | `--md-sys-color-on-surface`
`--md-dialog-headline-type` | `--md-sys-typescale-headline-small`
`--md-dialog-headline-font` | `--md-sys-typescale-headline-small-font`
`--md-dialog-supporting-text-color` | `--md-sys-color-on-surface-variant`
`--md-dialog-supporting-text-type` | `--md-sys-typescale-body-medium`
`--md-dialog-supporting-text-font` | `--md-sys-typescale-body-medium-font`
* [All tokens](https://github.com/material-components/material-web/blob/main/tokens/_md-comp-dialog.scss)
<!-- {.external} -->

27
tokens/_md-comp-dialog.scss
View File

@ -21,11 +21,17 @@ $supported-tokens: (
'container-color',
'container-shape',
'headline-color',
'headline-type',
'headline-font',
'headline-line-height',
'headline-size',
'headline-weight',
'icon-color',
'icon-size',
'supporting-text-color',
'supporting-text-type',
'supporting-text-font',
'supporting-text-line-height',
'supporting-text-size',
'supporting-text-weight',
// go/keep-sorted end
);
@ -59,16 +65,10 @@ $unsupported-tokens: (
'action-pressed-state-layer-opacity',
'container-elevation',
// Unused without a shadow color
'headline-font',
'headline-line-height',
'headline-size',
'headline-tracking',
'headline-weight',
'supporting-text-font',
'supporting-text-line-height',
'supporting-text-size',
'headline-type',
'supporting-text-tracking',
'supporting-text-weight',
'supporting-text-type',
// go/keep-sorted end
);
@ -84,12 +84,5 @@ $unsupported-tokens: (
)
);
// TODO(b/271876162): remove when tokens compiler emits typescale tokens
$tokens: map.merge(
$tokens,
(
'headline-type': map.get($deps, 'md-sys-typescale', 'headline-small'),
)
);
@return $tokens;
}