access $primary in library as set by custom theme

Viewed 350

I work with nrwl/nx and have independent libraries.

In my main app, i define a theme for material.

Now in my lib, i want to use the $primary color as set by this theme, without importing the theme. The lib should stay independen and work in other apps using other themes as well.

So what i want to do in a component in my library is i.e.:

libs/foo/.../bar.component/scss:
.header {
  background-color: $primary;
}

Using the theme defined in the app, in a custom theme like this:

apps/bar/custom-theme.scss
...
$my-app-primary: mat-palette($mat-red);
$my-app-accent:  mat-palette($mat-green);
$my-app-warn:    mat-palette($mat-amber);

$my-app-theme: mat-light-theme((
  color: (
    primary: $my-app-primary,
    accent: $my-app-accent,
    warn: $my-app-warn,
  )
));

I am using @angular/material@10.0.2

0 Answers
Related