|
1 | 1 | @use 'sass:map';
|
2 | 2 | @use '../core/theming/theming';
|
3 | 3 | @use '../core/theming/inspection';
|
| 4 | +@use '../core/tokens/m2-utils'; |
| 5 | +@use '../core/tokens/m3-utils'; |
4 | 6 |
|
5 | 7 | // Tokens that can't be configured through Angular Material's current theming API,
|
6 | 8 | // but may be in a future version of the theming API.
|
|
13 | 15 |
|
14 | 16 | // Tokens that can be configured through Angular Material's color theming API.
|
15 | 17 | @function get-color-tokens($theme) {
|
| 18 | + $system: m2-utils.get-system($theme); |
| 19 | + |
16 | 20 | @return map.merge(private-get-color-palette-color-tokens($theme, primary), (
|
17 | 21 | stepper-container-color: inspection.get-theme-color($theme, system, surface),
|
18 | 22 | stepper-line-color: inspection.get-theme-color($theme, system, outline),
|
19 |
| - stepper-header-hover-state-layer-color: inspection.get-theme-color($theme, background, hover), |
20 |
| - stepper-header-focus-state-layer-color: inspection.get-theme-color($theme, background, hover), |
| 23 | + stepper-header-hover-state-layer-color: m3-utils.color-with-opacity( |
| 24 | + map.get($system, on-surface), map.get($system, hover-state-layer-opacity)), |
| 25 | + stepper-header-focus-state-layer-color: m3-utils.color-with-opacity( |
| 26 | + map.get($system, on-surface), map.get($system, focus-state-layer-opacity)), |
21 | 27 | stepper-header-label-text-color: inspection.get-theme-color($theme, foreground, secondary-text),
|
22 | 28 | stepper-header-optional-label-text-color: inspection.get-theme-color(
|
23 | 29 | $theme, foreground, secondary-text),
|
|
0 commit comments