Skip to content

Commit e7cabf1

Browse files
crisbetoannieyw
authored andcommitted
fix(material-experimental/mdc-paginator): buttons not visible in high contrast mode (#21096)
Fixes that the MDC paginator buttons weren't visible in high contrast mode. (cherry picked from commit 3bfad18)
1 parent ee78609 commit e7cabf1

File tree

1 file changed

+13
-0
lines changed

1 file changed

+13
-0
lines changed

src/material-experimental/mdc-paginator/paginator.scss

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
@import '../mdc-form-field/form-field-theme';
2+
@import '../../cdk/a11y/a11y';
23

34
$mat-mdc-paginator-padding: 0 8px;
45
$mat-mdc-paginator-page-size-margin-right: 8px;
@@ -81,3 +82,15 @@ $mat-mdc-paginator-button-icon-size: 28px;
8182
transform: rotate(180deg);
8283
}
8384
}
85+
86+
@include cdk-high-contrast(active, off) {
87+
// The disabled button icon has to be set explicitly since the selector is too specific.
88+
.mat-mdc-icon-button[disabled] .mat-mdc-paginator-icon,
89+
.mat-mdc-paginator-icon {
90+
fill: currentColor;
91+
}
92+
93+
.mat-mdc-paginator-range-actions .mat-mdc-icon-button {
94+
outline: solid 1px;
95+
}
96+
}

0 commit comments

Comments
 (0)