fix: Working of theme selector (#2285)

src/theme/deeppurple-amber.scss

@@ -0,0 +1,15 @@
+@use '@angular/material' as mat;
+
+$deeppurple-amber-primary: mat.define-palette(mat.$deep-purple-palette, 500, 300, 700);
+$deeppurple-amber-accent: mat.define-palette(mat.$amber-palette, 400, 200, 600);
+$deeppurple-amber-warn: mat.define-palette(mat.$red-palette);
+
+$deeppurple-amber-theme: mat.define-light-theme(
+  $deeppurple-amber-primary,
+  $deeppurple-amber-accent,
+  $deeppurple-amber-warn
+);
+
+.deeppurple-amber-theme {
+  @include mat.all-component-themes($deeppurple-amber-theme);
+}

src/theme/indigo-pink.scss

@@ -0,0 +1,11 @@
+@use '@angular/material' as mat;
+
+$indigo-pink-primary: mat.define-palette(mat.$indigo-palette, 500, 300, 700);
+$indigo-pink-accent: mat.define-palette(mat.$pink-palette, 400, 200, 600);
+$indigo-pink-warn: mat.define-palette(mat.$red-palette);
+
+$indigo-pink-theme: mat.define-light-theme($indigo-pink-primary, $indigo-pink-accent, $indigo-pink-warn);
+
+.indigo-pink-theme {
+  @include mat.all-component-themes($indigo-pink-theme);
+}

src/theme/mifosx-theme.scss

@@ -10,6 +10,7 @@
 @use '../app/shares/shares-account-view/shares-account-view.component-theme.scss' as *;
 @use 'content' as *;
 @use 'dark_content' as *;
+@use 'pictonblue-yellowgreen' as *;
 
 // 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.

src/theme/pictonblue-yellowgreen.scss

@@ -0,0 +1,17 @@
+@use '@angular/material' as mat;
+
+$pictonblue-yellowgreen-primary: mat.define-palette(mat.$blue-palette, 400, 200, 600);
+
+$pictonblue-yellowgreen-accent: mat.define-palette(mat.$light-green-palette, 400, 200, 600);
+
+$pictonblue-yellowgreen-warn: mat.define-palette(mat.$red-palette);
+
+$pictonblue-yellowgreen-theme: mat.define-light-theme(
+  $pictonblue-yellowgreen-primary,
+  $pictonblue-yellowgreen-accent,
+  $pictonblue-yellowgreen-warn
+);
+
+.pictonblue-yellowgreen-theme {
+  @include mat.all-component-themes($pictonblue-yellowgreen-theme);
+}

src/theme/pink-bluegrey.scss

@@ -0,0 +1,11 @@
+@use '@angular/material' as mat;
+
+$pink-bluegrey-primary: mat.define-palette(mat.$pink-palette, 500, 300, 700);
+$pink-bluegrey-accent: mat.define-palette(mat.$blue-grey-palette, 400, 200, 600);
+$pink-bluegrey-warn: mat.define-palette(mat.$red-palette);
+
+$pink-bluegrey-theme: mat.define-light-theme($pink-bluegrey-primary, $pink-bluegrey-accent, $pink-bluegrey-warn);
+
+.pink-bluegrey-theme {
+  @include mat.all-component-themes($pink-bluegrey-theme);
+}

src/theme/purple-green.scss

@@ -0,0 +1,11 @@
+@use '@angular/material' as mat;
+
+$purple-green-primary: mat.define-palette(mat.$purple-palette, 500, 300, 700);
+$purple-green-accent: mat.define-palette(mat.$green-palette, 400, 200, 600);
+$purple-green-warn: mat.define-palette(mat.$red-palette);
+
+$purple-green-theme: mat.define-light-theme($purple-green-primary, $purple-green-accent, $purple-green-warn);
+
+.purple-green-theme {
+  @include mat.all-component-themes($purple-green-theme);
+}