i updated my Angular application on version 17, before updating i got rid of legacy components, i am also using angular material. But after updating the angular material on 17, i have problem that components like selects, dialogs etc. are not working, lets say i click on some mat-select, nothing happened, in DOM i can see that element is there, but as if he lost all default css properties from angular material and he is not displaying in app. I suspect it has something to do with the overlay because it mainly concerns components that appear on top as dialogs and have selects when clicked. One thing what i set up in material.scss is this : // hue. Available color palettes: https://material.io/design/color/ $rds-npm-ng-service-advisor-primary: mat.define-palette($sun-yellow); // $rds-npm-ng-service-advisor-secondary: mat-palette($warranty-pro); $rds-npm-ng-service-advisor-accent: mat.define-palette($green); // The warn palette is optional (defaults to red). $rds-npm-ng-service-advisor-warn: mat.define-palette(mat.$red-palette); $rds-npm-ng-service-advisor-warn: mat.define-palette(mat.$red-palette); // Create the theme object (a Sass map containing all of the palettes). $rds-npm-ng-service-advisor-theme: mat.define-light-theme($rds-npm-ng-service-advisor-primary, $rds-npm-ng-service-advisor-accent, $rds-npm-ng-service-advisor-warn); // Include theme styles for core and each component used in your app. // Alternatively, you can import and @include the theme mixins for each component // that you are using. @include mat.all-component-themes($rds-npm-ng-service-advisor-theme); Continue reading...
