Как слить / перезаписать часть @mixin в материале angular тем? - PullRequest
Новая
       73

Как слить / перезаписать часть @mixin в материале angular тем?

0 голосов
/ 08 мая 2020

Предполагается, что в _theming.scss материала @angular/material/theming.scss есть только 1 строка, которую я хотел бы перезаписать. Например: 

//node_modules/@angular/material/theming.scss
@mixin mat-dialog-theme($theme) {
    $background: map-get($theme, background);
    $foreground: map-get($theme, foreground);

    .mat-dialog-container {
      @include _mat-theme-elevation(24, $theme);
      background: mat-color($primary, lighter);
      color: mat-color($foreground, text); //I WOULD LIKE TO CHANGE THIS
    }
    /* A LOT MORE GOING ON HERE */
}

На данный момент каждый раз, когда я хочу изменить часть этого миксина, мне нужно копировать весь раздел и просто редактировать необходимый элемент, чтобы перезаписать его (например, .mat-dialog-container { background } из приведенный выше код): 

//myCustomTheme.scss
@import '~@angular/material/theming';
@include mat-core();

//Define palettes
//mat-palette(color, default, lighter, darker)
$primary:          mat-palette($mat-blue-gray, 900);
$accent:           mat-palette($mat-orange, 500, 300, 700);
$warn:             mat-palette($mat-red, 500, 300, 700);

//Create the theme
$theme: mat-dark-theme($primary, $accent, $warn);

//START MODIFYING THE MIXING VARIABLES BY OVERWRITING THEM
@mixin mat-dialog-theme($theme) {
    $background: map-get($theme, background);
    $foreground: map-get($theme, foreground);

    .mat-dialog-container {
      @include _mat-theme-elevation(24, $theme);
      background: mat-color($primary, lighter);
      color: mat-color($primary, text); //I HAVE CHANGED THIS TO $primary
    }
    /* A LOT MORE GOING ON HERE */
}

@include angular-material-theme($theme);

Это определенно не похоже на правильный подход. Как правильно это сделать? Я считаю, что это очень временный подход и не рекомендуется.

...