Commit 97e7358
authored
fix: improve search input text contrast accessibility (#1974)
## Summary
- Fix search input text visibility by replacing hardcoded low-contrast
input text color with Primer foreground tokens and fallbacks in
src/components/text-input.js
- Ensure caret visibility by setting caret-color to the same accessible
foreground token
- Improve placeholder readability with muted foreground token fallback
and remove opacity fade
- Include required docs formatting update from CI in
content/cli/v11/commands/npm-stage.mdx (Prettier only)
## Why
- Typed text in the search box could be effectively invisible on light
backgrounds, causing an accessibility issue.
## Validation
- npx eslint src/components/text-input.js
- npx prettier --check content/cli/v11/commands/npm-stage.mdx1 parent 7e5f612 commit 97e7358
2 files changed
Lines changed: 18 additions & 17 deletions
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
77 | 77 | | |
78 | 78 | | |
79 | 79 | | |
80 | | - | |
81 | | - | |
82 | | - | |
83 | | - | |
84 | | - | |
85 | | - | |
86 | | - | |
87 | | - | |
| 80 | + | |
| 81 | + | |
| 82 | + | |
| 83 | + | |
| 84 | + | |
| 85 | + | |
| 86 | + | |
| 87 | + | |
88 | 88 | | |
89 | 89 | | |
90 | 90 | | |
| |||
96 | 96 | | |
97 | 97 | | |
98 | 98 | | |
99 | | - | |
100 | | - | |
101 | | - | |
102 | | - | |
103 | | - | |
104 | | - | |
| 99 | + | |
| 100 | + | |
| 101 | + | |
| 102 | + | |
| 103 | + | |
| 104 | + | |
105 | 105 | | |
106 | 106 | | |
107 | 107 | | |
| |||
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
8 | 8 | | |
9 | 9 | | |
10 | 10 | | |
11 | | - | |
| 11 | + | |
| 12 | + | |
12 | 13 | | |
13 | 14 | | |
14 | 15 | | |
15 | | - | |
16 | | - | |
| 16 | + | |
| 17 | + | |
17 | 18 | | |
18 | 19 | | |
19 | 20 | | |
0 commit comments