Skip to content

Commit 885eb1d

Browse files
committed
fix(material/chip): remove button is too small
Fixes Angular Components Chip component where the touch target of the remove button of a chip is too small. Updates .mat-mdc-chip-remove to target more specific styles to override original style of padding: 8px so that the user has a larger touch target particularly on mobile devices. Fixes b/286959517
1 parent e0c9518 commit 885eb1d

File tree

1 file changed

+6
-0
lines changed

1 file changed

+6
-0
lines changed

src/material/chips/chip.scss

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -396,6 +396,12 @@
396396
font-size: mdc-chip-theme.$trailing-action-size;
397397
box-sizing: content-box;
398398
}
399+
/** Increases mdc-dhip-remove trailing icon action touch-target
400+
in order to fix b/286959517. */
401+
&.mat-mdc-chip-trailing-icon.mdc-evolution-chip__action--trailing,
402+
&.mat-mdc-chip-trailing-icon.mdc-evolution-chip__icon--trailing {
403+
padding: 24px 12px;
404+
}
399405
}
400406

401407
.mat-chip-edit-input {

0 commit comments

Comments
 (0)