feat(button): add filled/tonal matIconButton
Nessuno ha ancora preso questa issue.
Valutazione
- Difficoltà
- 4/5
- Tempo stimato
- 3-5 giorni
- Idoneità per principianti
- 52/100
- Tipo di issue
- Funzionalità
- Chiarezza
- Specificata chiaramente
- Stato di attività
- Tranquilla
- Stack tecnologico
- angular, typescript
- Ambito
- frontend
Direzione di ricerca
Inizia confrontando le opzioni di aspetto esistenti di matButton con matIconButton, quindi esamina le varianti dei pulsanti icona di Material Design 3 collegate nell’issue. Il lavoro è completato quando matIconButton può eseguire il rendering di aspetti filled e tonal come pulsanti icona circolari, distinti dai FABs e dai pulsanti icona standard.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Descrizione
Feature Description
Currently, matButton supports multiple appearances (text, filled, tonal, outlined, elevated) via the matButton attribute, but matIconButton does not accept any appearance input — it always renders as a transparent circular button.
Material Design 3 specifies filled and tonal icon button variants as distinct components alongside the standard and outlined icon buttons. There is currently no straightforward way to create these in Angular Material without using matFab/matMiniFab (which have different sizing, elevation, and semantics) or matButton="filled" with an icon (which doesn't produce a circular icon button).
Use Case
Developers building M3-compliant UIs need filled and tonal icon buttons for actions that require more visual emphasis than a standard icon button, but don't carry the semantic meaning of a FAB (floating action button). For example, a filled icon button for a primary action like "play" or "add to cart" in a toolbar, or a tonal icon button for a medium-emphasis toggle like "bookmark" or "favorite."
- Lingua principale
- TypeScript
- Stelle
- 25k
- Fork
- 6.8k
- Merge medio
- 1g 1h
- PR unite (30g)
- 84
Guida per i contributori
Apri la guida per i contributori
Come iniziare
- Leggi tutta la issue e poi la guida ai contributi del progetto.
- Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
- Fai un fork del repository e lavora su un branch.
- Apri una pull request che faccia riferimento al numero della issue.
Altre issue di angular/components
-
area: material/tree docs gemini-triaged needs triage
Difficoltà 2/5 1-3 ore Idoneità per principianti 68/100
angular/components#33832 ·
-
area: material/datepicker gemini-triaged P4
Difficoltà 2/5 1-3 ore Idoneità per principianti 72/100
angular/components#33763 · 2 commenti · 3 reazioni ·
-
area: material/table gemini-triaged P4
Difficoltà 1/5 Meno di un'ora Idoneità per principianti 88/100
angular/components#33709 · 1 commento ·
-
area: material/table docs gemini-triaged P4
Difficoltà 2/5 1-3 ore Idoneità per principianti 72/100
angular/components#33455 ·
-
area: material/core gemini-triaged P3
Difficoltà 1/5 Meno di un'ora Idoneità per principianti 78/100
angular/components#33059 · 2 commenti ·
Tutte le issue di angular/components
Issue simili
-
Difficoltà 2/5 1-3 ore Idoneità per principianti 84/100
bcgov/bc-wallet-mobile#4761 · 1 commento ·
-
external-issue to-triage
Difficoltà 2/5 1-3 ore Idoneità per principianti 88/100
-
area-deployment area-integrations triage:bot-seen
Difficoltà 2/5 Mezza giornata Idoneità per principianti 86/100
-
Difficoltà 2/5 1-3 ore Idoneità per principianti 82/100
-
refactor
Difficoltà 2/5 1-3 ore Idoneità per principianti 84/100