Skip to content

Commit 301f6b0

Browse files
committed
fix(multiple): touch targets not excluded in densities lower than -2 (#25108)
Fixes that touch targets were being removed only on `-2` or `minimum` densities, but not anything lower. Also moves the check into a common mixin so we only have one place where it needs to be changed. (cherry picked from commit 6369204)
1 parent a1f6f66 commit 301f6b0

File tree

4 files changed

+12
-3
lines changed

4 files changed

+12
-3
lines changed

src/material-experimental/mdc-button/_button-theme-private.scss

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
@use 'sass:map';
22
@use '@material/ripple/ripple-theme' as mdc-ripple-theme;
33
@use '@material/theme/theme-color' as mdc-theme-color;
4+
@use '../mdc-core/mdc-helpers/mdc-helpers';
45

56
@mixin _ripple-color($color) {
67
--mat-mdc-button-persistent-ripple-color: #{$color};
@@ -53,7 +54,7 @@
5354

5455
// Hides the touch target on lower densities.
5556
@mixin touch-target-density($scale) {
56-
@if ($scale == -2 or $scale == 'minimum') {
57+
@include mdc-helpers.if-touch-targets-unsupported($scale) {
5758
.mat-mdc-button-touch-target {
5859
display: none;
5960
}

src/material-experimental/mdc-checkbox/_checkbox-theme.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@
8888
);
8989
}
9090

91-
@if ($density-scale == -2 or $density-scale == 'minimum') {
91+
@include mdc-helpers.if-touch-targets-unsupported($density-scale) {
9292
.mat-mdc-checkbox-touch-target {
9393
display: none;
9494
}

src/material-experimental/mdc-core/mdc-helpers/_mdc-helpers.scss

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
@use '@material/theme/theme-color' as mdc-theme-color;
88
@use '@material/theme/css' as mdc-theme-css;
99
@use 'sass:map';
10+
@use 'sass:meta';
1011

1112
// A set of standard queries to use with MDC's queryable mixins.
1213
$mat-base-styles-query: mdc-feature-targeting.without(mdc-feature-targeting.any(color, typography));
@@ -211,3 +212,10 @@ $mat-typography-mdc-level-mappings: (
211212
@content;
212213
mdc-theme-css.$enable-fallback-declarations: $previous-value;
213214
}
215+
216+
// Excludes the passed-in CSS content if the layout is too dense to supports touch targets.
217+
@mixin if-touch-targets-unsupported($scale) {
218+
@if ($scale == 'minimum' or (meta.type-of($scale) == 'number' and $scale < -1)) {
219+
@content;
220+
}
221+
}

src/material-experimental/mdc-radio/_radio-theme.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@
7777
@include mdc-radio-theme.density($density-scale, $query: mdc-helpers.$mat-base-styles-query);
7878
}
7979

80-
@if ($density-scale == -2 or $density-scale == 'minimum') {
80+
@include mdc-helpers.if-touch-targets-unsupported($density-scale) {
8181
.mat-mdc-radio-touch-target {
8282
display: none;
8383
}

0 commit comments

Comments
 (0)