I have a problem trying to setup a custom Angular Material theme. I'm trying to follow the basic example given in the docs (https://material.angular.io/guide/theming) but keep hitting an error during startup of app : "SassError: Missing argument $accent".
This appears to be trying to highlight the mat-light-theme() call, but as far as I can see I'm following the example file given in docs.
Does this look about right... (I'm hoping to be confident the theme file is right so I can start tracking down issues introduced elsewhere)?
@import '~@angular/material/theming';
@import 'mixins/definitions'; // just another scss file
// Include the common styles for Angular Material. We include this here so that you only
// have to load a single css file for Angular Material in your app.
// Be sure that you only ever include this mixin once!
@include mat-core();
$my-app-primary: mat-palette($mat-indigo);
$my-app-accent: mat-palette($mat-pink, A200, A100, A400);
$my-app-warn: mat-palette($mat-red, A200, A100, A400);
// The warn palette is optional (defaults to red).
//$candy-app-warn: mat-palette($mat-red);
// Create the theme object. A theme consists of configurations for individual
// theming systems such as `color` or `typography`.
//$candy-app-theme: mat-light-theme((
$my-app-theme: mat-light-theme((
color: (
primary: $my-app-primary,
accent: $my-app-accent,
warn: $my-app-warn
)
));
@include angular-material-theme($my-app-theme);
@include mat-core-theme($my-app-theme);
@include mat-checkbox-theme($my-app-theme);
Some bits that may be relevant from my package.json:
"dependencies": {
...
"@angular/animations": "~9.1.9",
"@angular/cdk": "^9.2.4",
"@angular/common": "~9.1.9",
"@angular/compiler": "~9.1.9",
"@angular/core": "~9.1.9",
"@angular/material": "^9.2.4",
...
}
"devDependencies": {
"@angular-devkit/build-angular": "~0.901.7",
"@angular/cli": "~9.1.7",
"@angular/compiler-cli": "~9.1.9",
...
}