feat(theming): Mixins for reading component style tokens
- 主要言語
- TypeScript
- スター
- 25k
- フォーク
- 6.8k
- 平均マージ
- 1日 8時間
- マージ済み PR(30日)
- 91
説明
### Feature Description
Mixins to get values from a component theme that takes a token as parameter, for example:
```
p {
color: @include mat.button-get(text-label-text-color);
}
```
it would generate:
```
p {
color: var(--mdc-outlined-button-label-text-color, var(--mat-sys-primary)); // <== Actual value used for text-button
}
```
Ideally, we would have as many mixins as there are components (+core) and we could use the same tokens as the `mat.-overrides` mixins.
> The `mat.-get` mixin name is a proposal, open to suggestions.
### Use Case
I have a custom component and I want to apply the same style as a material component. I also want to make sure that they are always in sync when I change my theme.
For example, I want to have a text `
` with the same font color as my `mat-button` next to it.
For now, I need to rely on private CSS variables to do that, which is not ideal for maintainability.
コントリビューションガイド
調査の方向性
この issue ではファイルやテストが指定されていません。まず既存の `mat.-overrides` mixin を読み、そこにあるトークンを提案されている `mat.-get` API と比較してください。目的の mixin の範囲と命名が定義され、ユーザーがカスタムスタイル用にコンポーネントのテーマトークンの値を読み取れるようになれば完了です。
索引モデルが issue の本文から書いたものです。
評価
- 技術スタック
- angular, sass, typescript
- 領域
- design, frontend
- issue の種類
- 機能追加
- 難易度
- 5/5
- 見積もり時間
- 1週間以上
- 活発さ
- 停滞
- 明瞭さ
- おおむね明確
- 初心者へのやさしさ
- 30/100