material-components/material-web
1
1
Fork 0
mirror of https://github.com/material-components/material-web.git synced 2024-09-19 17:47:46 +03:00
Code Issues Projects Releases Wiki Activity

fix(navigation,badge)!: migrate to -text-type tokens

Browse Source 
PiperOrigin-RevId: 510540741
This commit is contained in:
Daniel Freedman 2023-02-17 15:51:47 -08:00 committed by Copybara-Service
parent f0f5ae57ab
commit 7b8667711a
2 changed files with 17 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
badge/lib/_badge.scss
View File

@ -6,27 +6,26 @@
// stylelint-disable selector-class-pattern --
// Selector '.md3-*' should only be used in this project.
// go/keep-sorted start
@use 'sass:map';
// go/keep-sorted end
// go/keep-sorted start
@use '../../sass/theme';
@use '../../sass/typography';
@use '../../tokens';
// go/keep-sorted end
$_custom-property-prefix: 'badge';
@mixin theme($tokens) {
$tokens: theme.validate-theme(tokens.md-comp-badge-values(), $tokens);
$tokens: _resolve-tokens($tokens);
$tokens: theme.validate-theme(
_resolve-tokens(tokens.md-comp-badge-values()),
_resolve-tokens($tokens)
);
$tokens: theme.create-theme-vars($tokens, $_custom-property-prefix);
@include theme.emit-theme-vars($tokens);
}
@mixin styles() {
$tokens: tokens.md-comp-badge-values();
$tokens: _resolve-tokens($tokens);
$tokens: _resolve-tokens(tokens.md-comp-badge-values());
$tokens: theme.create-theme-vars($tokens, $_custom-property-prefix);
:host {
@ -69,16 +68,10 @@ $_custom-property-prefix: 'badge';
}
.md3-badge__value {
font-family: var(--_large-label-text-font);
font-size: var(--_large-label-text-size);
letter-spacing: var(--_large-label-text-tracking);
line-height: var(--_large-label-text-line-height);
font-weight: var(--_large-label-text-weight);
font: var(--_large-label-text-type);
}
}
@function _resolve-tokens($tokens) {
// Remove unsupported tokens
$tokens: map.remove($tokens, large-label-text-type);
@return $tokens;
@return typography.resolve-tokens($tokens, 'large-label-text');
}

17
navigationtab/lib/_navigation-tab.scss
View File

@ -15,6 +15,7 @@
@use '../../motion/animation';
@use '../../ripple/ripple';
@use '../../sass/theme';
@use '../../sass/typography';
@use '../../tokens';
// go/keep-sorted end
@ -23,8 +24,8 @@ $_custom-property-prefix: 'navigation-bar';
@mixin theme($tokens) {
$tokens: theme.validate-theme(
tokens.md-comp-navigation-bar-values(),
$tokens
_resolve-tokens(tokens.md-comp-navigation-bar-values()),
_resolve-tokens($tokens)
);
$tokens: theme.create-theme-vars($tokens, $_custom-property-prefix);
@ -33,7 +34,7 @@ $_custom-property-prefix: 'navigation-bar';
}
@mixin styles() {
$tokens: tokens.md-comp-navigation-bar-values();
$tokens: _resolve-tokens(tokens.md-comp-navigation-bar-values());
$tokens: theme.create-theme-vars($tokens, $_custom-property-prefix);
:host {
@ -71,11 +72,7 @@ $_custom-property-prefix: 'navigation-bar';
position: relative;
text-align: center;
width: 100%;
font-family: var(--_label-text-font);
font-size: var(--_label-text-size);
letter-spacing: var(--_label-text-tracking);
font-weight: var(--_label-text-weight);
line-height: var(--_label-text-line-height);
font: var(--_label-text-type);
// Firefox draws a dotted border around focused buttons unless specifically overridden.
&::-moz-focus-inner {
@ -264,3 +261,7 @@ $_custom-property-prefix: 'navigation-bar';
);
}
}
@function _resolve-tokens($tokens) {
@return typography.resolve-tokens($tokens, 'label-text');
}