refactor(themes): update theme preset mixins (#15164)

* refactor(themes): update presets to only use the theme mixin * refactor(themes): add indigo light preset * refactor(themes): remove extra line from dark fluent preset
IgniteUI · Dec 12, 2024 · e372a9e · e372a9e
1 parent 217ea33
commit e372a9e
Show file tree

Hide file tree

Showing 13 changed files with 104 additions and 26 deletions.
diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-angular-dark.scss b/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-angular-dark.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $material-typeface, $type-scale: $material-type-scale);
-@include dark-theme($dark-material-palette);
+@include typography(
+    $font-family: $material-typeface,
+    $type-scale: $material-type-scale
+);
+@include theme(
+    $schema: $dark-material-schema,
+    $palette: $dark-material-palette,
+);
diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-angular.scss b/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-angular.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $material-typeface, $type-scale: $material-type-scale);
-@include theme($light-material-palette);
+@include typography(
+    $font-family: $material-typeface,
+    $type-scale: $material-type-scale
+);
+@include theme(
+    $schema: $light-material-schema,
+    $palette: $light-material-palette,
+);
diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-bootstrap-dark.scss b/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-bootstrap-dark.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $bootstrap-typeface, $type-scale: $bootstrap-type-scale);
-@include bootstrap-dark-theme($dark-bootstrap-palette);
+@include typography(
+    $font-family: $bootstrap-typeface,
+    $type-scale: $bootstrap-type-scale
+);
+@include theme(
+    $schema: $dark-bootstrap-schema,
+    $palette: $dark-bootstrap-palette,
+);
diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-bootstrap-light.scss b/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-bootstrap-light.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $bootstrap-typeface, $type-scale: $bootstrap-type-scale);
-@include bootstrap-light-theme($light-bootstrap-palette);
+@include typography(
+    $font-family: $bootstrap-typeface,
+    $type-scale: $bootstrap-type-scale
+);
+@include theme(
+    $schema: $light-bootstrap-schema,
+    $palette: $light-bootstrap-palette,
+);
diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-dark-green.scss b/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-dark-green.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $material-typeface, $type-scale: $material-type-scale);
-@include dark-theme($dark-green-palette);
+@include typography(
+    $font-family: $material-typeface,
+    $type-scale: $material-type-scale
+);
+@include theme(
+    $schema: $dark-material-schema,
+    $palette: $dark-green-palette,
+);
diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-fluent-dark-excel.scss b/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-fluent-dark-excel.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $fluent-typeface, $type-scale: $fluent-type-scale);
-@include fluent-dark-theme($dark-fluent-excel-palette);
+@include typography(
+    $font-family: $fluent-typeface,
+    $type-scale: $fluent-type-scale
+);
+@include theme(
+    $schema: $dark-fluent-schema,
+    $palette: $dark-fluent-excel-palette,
+);
diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-fluent-dark-word.scss b/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-fluent-dark-word.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $fluent-typeface, $type-scale: $fluent-type-scale);
-@include fluent-dark-theme($dark-fluent-word-palette);
+@include typography(
+    $font-family: $fluent-typeface,
+    $type-scale: $fluent-type-scale
+);
+@include theme(
+    $schema: $dark-fluent-schema,
+    $palette: $dark-fluent-word-palette,
+);
diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-fluent-dark.scss b/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-fluent-dark.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $fluent-typeface, $type-scale: $fluent-type-scale);
-@include fluent-dark-theme($dark-fluent-palette);
+@include typography(
+    $font-family: $fluent-typeface,
+    $type-scale: $fluent-type-scale
+);
+@include theme(
+    $schema: $dark-fluent-schema,
+    $palette: $dark-fluent-palette,
+);
diff --git a/...ects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-fluent-light-excel.scss b/...ects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-fluent-light-excel.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $fluent-typeface, $type-scale: $fluent-type-scale);
-@include fluent-light-theme($light-fluent-excel-palette);
+@include typography(
+    $font-family: $fluent-typeface,
+    $type-scale: $fluent-type-scale
+);
+@include theme(
+    $schema: $light-fluent-schema,
+    $palette: $light-fluent-excel-palette,
+);
diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-fluent-light-word.scss b/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-fluent-light-word.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $fluent-typeface, $type-scale: $fluent-type-scale);
-@include fluent-light-theme($light-fluent-word-palette);
+@include typography(
+    $font-family: $fluent-typeface,
+    $type-scale: $fluent-type-scale
+);
+@include theme(
+    $schema: $light-fluent-schema,
+    $palette: $light-fluent-word-palette,
+);
diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-fluent-light.scss b/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-fluent-light.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $fluent-typeface, $type-scale: $fluent-type-scale);
-@include fluent-light-theme($light-fluent-palette);
+@include typography(
+    $font-family: $fluent-typeface,
+    $type-scale: $fluent-type-scale
+);
+@include theme(
+    $schema: $light-fluent-schema,
+    $palette: $light-fluent-palette,
+);
diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-indigo-dark.scss b/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-indigo-dark.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $indigo-typeface, $type-scale: $indigo-type-scale);
-@include indigo-dark-theme($dark-indigo-palette);
+@include typography(
+    $font-family: $indigo-typeface,
+    $type-scale: $indigo-type-scale
+);
+@include theme(
+    $schema: $dark-indigo-schema,
+    $palette: $dark-indigo-palette,
+);
diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-indigo-light.scss b/projects/igniteui-angular/src/lib/core/styles/themes/presets/igniteui-indigo-light.scss
@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $indigo-typeface, $type-scale: $indigo-type-scale);
-@include indigo-light-theme($light-indigo-palette);
+@include typography(
+    $font-family: $indigo-typeface,
+    $type-scale: $indigo-type-scale
+);
+@include theme(
+    $schema: $light-indigo-schema,
+    $palette: $light-indigo-palette,
+);