diff options
Diffstat (limited to 'frontend/src/custom-theme.scss')
| -rw-r--r-- | frontend/src/custom-theme.scss | 35 |
1 files changed, 35 insertions, 0 deletions
diff --git a/frontend/src/custom-theme.scss b/frontend/src/custom-theme.scss new file mode 100644 index 00000000..a6538c37 --- /dev/null +++ b/frontend/src/custom-theme.scss @@ -0,0 +1,35 @@ + +// Custom Theming for Angular Material +// For more information: https://material.angular.io/guide/theming +@use '@angular/material' as mat; +// Plus imports for other components in your app. + +// 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(); + +// Define the palettes for your theme using the Material Design palettes available in palette.scss +// (imported above). For each palette, you can optionally specify a default, lighter, and darker +// hue. Available color palettes: https://material.io/design/color/ +$frontend-primary: mat.define-palette(mat.$indigo-palette); +$frontend-accent: mat.define-palette(mat.$pink-palette, A200, A100, A400); + +// The warn palette is optional (defaults to red). +$frontend-warn: mat.define-palette(mat.$red-palette); + +// Create the theme object. A theme consists of configurations for individual +// theming systems such as "color" or "typography". +$frontend-theme: mat.define-light-theme(( + color: ( + primary: $frontend-primary, + accent: $frontend-accent, + warn: $frontend-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($frontend-theme); + |