components icon indicating copy to clipboard operation
components copied to clipboard

bug(core-theming): get-theme-color($theme, $role-color) returns incorrect shades for 4 colors

Open vulture9 opened this issue 1 year ago • 0 comments
trafficstars

Is this a regression?

  • [ ] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

For the given function get-theme-color($theme, $role-color) four of the shades are incorrectly mapped: Light mode:

  • surface . Current implementation is using n-98 , where should be mapped to n-99.

dark mode:

  • surface . Currently using n-10, where should be mapped to n-6.
  • on-surface-variant Currently using nv-80 , where should be mapped to nv-90
  • surface-container-highest Currently using n-22, where should be mapped to n-24.

reference to comparison material theme builder: https://material-foundation.github.io/material-theme-builder/ image image

Tested version: "@angular/material": "18.1.0",

Reproduction

Steps to reproduce:

  1. call get-theme-color($theme, role-color) for role colors 'surface', 'on-surface-variant', 'surface-container-highest'
  2. compare shades of colors from the pallet that are returned. wrong shades are used according to spec

Expected Behavior

correct shades are returned based on the specification. reproduction steps are very clear.

Actual Behavior

slightly wrong color shades are returned than on specification. just compare whatever is here for given mode light/dark mode and you can clearly see that wrong shades are used

Environment

  • Angular: 18.1.0
  • CDK/Material: 18.1.0
  • Browser(s): all, browser independent
  • Operating System (e.g. Windows, macOS, Ubuntu): Mac and Windows

vulture9 avatar Aug 14 '24 09:08 vulture9