feat(theming): Mixins for reading component style tokens
- Lingua principale
- TypeScript
- Stelle
- 25k
- Fork
- 6.8k
- Merge medio
- 1g 8h
- PR unite (30g)
- 91
Descrizione
### 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.
Guida per i contributori
Apri la guida per i contributori
Direzione di ricerca
La issue non indica file o test. Inizia leggendo i mixin `mat.-overrides` esistenti e confrontando i relativi token con l’API `mat.-get` proposta. Il lavoro sarà completo quando saranno definiti l’ambito desiderato del mixin e la relativa denominazione, e gli utenti potranno leggere i valori dei token del tema dei componenti per gli stili personalizzati.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Valutazione
- Stack tecnologico
- angular, sass, typescript
- Ambito
- design, frontend
- Tipo di issue
- Funzionalità
- Difficoltà
- 5/5
- Tempo stimato
- Più di una settimana
- Stato di attività
- Ferma
- Chiarezza
- Abbastanza chiara
- Idoneità per principianti
- 30/100