Description
Feature Description
It would be really cool to have an easy way to configure the foreground and background palette and pass them into the theming like:
$my-light-theme-foreground-palette: (
base: black,
divider: $my-dark-dividers,
dividers: $my-dark-dividers,
disabled: $my-dark-disabled-text,
disabled-button: rgba(black, 0.26),
disabled-text: $my-dark-disabled-text,
elevation: black,
hint-text: $my-dark-disabled-text,
secondary-text: $my-dark-secondary-text,
icon: rgba(black, 0.54),
icons: rgba(black, 0.54),
text: rgba(black, 0.87),
slider-min: rgba(black, 0.87),
slider-off: rgba(black, 0.26),
slider-off-active: rgba(black, 0.38),
);
$my-light-theme-background-palette: (
status-bar: map-get(mat.$grey-palette, 300),
app-bar: map-get(mat.$grey-palette, 100),
background: map-get(mat.$grey-palette, 50),
hover: rgba(black, 0.04),
card: white,
dialog: white,
disabled-button: rgba(black, 0.12),
raised-button: white,
focused-button: $my-dark-focused,
selected-button: map-get(mat.$grey-palette, 300),
selected-disabled-button: map-get(mat.$grey-palette, 400),
disabled-button-toggle: map-get(mat.$grey-palette, 200),
unselected-chip: map-get(mat.$grey-palette, 300),
disabled-list-option: map-get(mat.$grey-palette, 200),
tooltip: map-get(mat.$grey-palette, 700),
);
$light-theme: mat.define-light-theme(
$primary-palette,
$accent-palette,
$warn-palette,
$my-light-theme-foreground-palette,
$my-light-theme-background-palette
);
Actually I have to override the properties of the theme after creating them, like:
$light-theme: mat.define-light-theme(
$primary-palette,
$accent-palette,
$warn-palette
);
$light-theme: map_merge($light-theme, (background: $my-light-theme-background-palette));
$light-theme: map_merge($light-theme, (foreground: $my-light-theme-foreground-palette));
This seems a little bit ugly to me. I think it would be cleaner to pass the background and foreground palettes into the define-light-theme and define-dark-theme methods.