@elderbyte/ngx-starter 17.11.0-beta6 → 18.0.0-beta1

package/theming/_elder-mdc-support.scss

@@ -6,7 +6,7 @@
 
 
 @mixin mdc-theme-support($config-or-theme) {
-  $color: mat.get-color-config($config-or-theme);
+  $color: mat.m2-get-color-config($config-or-theme);
   $typography: elder-typography.get-typography-config($config-or-theme);
 
   @if $color != null {
@@ -32,8 +32,8 @@
   $config: $typography-config;
 
   // The unit-less line-height from the font config.
-  $line-height: mat.line-height($config, body-1);
-  $font-size: mat.font-size($config, body-1);
+  $line-height: mat.m2-line-height($config, body-1);
+  $font-size: mat.m2-font-size($config, body-1);
   $line-height-em: elder-typography.coerce-unitless-to-em($line-height);
 
 
@@ -114,39 +114,39 @@
   $warn: map.get($color-config, warn);
 
   .elder-mdc-control-icon {
-    color: mat.get-color-from-palette($foreground, secondary-text);
+    color: mat.m2-get-color-from-palette($foreground, secondary-text);
   }
 
   .mat-mdc-form-field {
     &.mat-focused {
       &.mat-primary {
         .elder-mdc-control-icon, .elder-control-icon-button {
-          color: mat.get-color-from-palette($primary, text);
+          color: mat.m2-get-color-from-palette($primary, text);
         }
       }
 
       &.mat-accent {
         .elder-mdc-control-icon, .elder-control-icon-button {
-          color: mat.get-color-from-palette($accent, text);
+          color: mat.m2-get-color-from-palette($accent, text);
         }
       }
 
       &.mat-warn {
         .elder-mdc-control-icon, .elder-control-icon-button {
-          color: mat.get-color-from-palette($warn, text);
+          color: mat.m2-get-color-from-palette($warn, text);
         }
       }
     }
 
     &.mat-form-field-invalid {
       .elder-mdc-control-icon, .elder-control-icon-button {
-        color: mat.get-color-from-palette($warn, text);
+        color: mat.m2-get-color-from-palette($warn, text);
       }
     }
 
     &.mat-form-field-disabled {
       .elder-mdc-control-icon, .elder-control-icon-button {
-        color: mat.get-color-from-palette($foreground, disabled-text);
+        color: mat.m2-get-color-from-palette($foreground, disabled-text);
       }
     }
   }
@@ -155,20 +155,20 @@
 
 @mixin _form-field-palette($palette) {
 
-  $contrast-color: mat.get-color-from-palette($palette, default-contrast);
+  $contrast-color: mat.m2-get-color-from-palette($palette, default-contrast);
   $contrast-color-inactive: rgba($contrast-color, .5);
 
   .mat-mdc-slide-toggle .mdc-form-field {
-    background: mat.get-color-from-palette($palette);
+    background: mat.m2-get-color-from-palette($palette);
     color: $contrast-color;
   }
 
   .mat-mdc-form-field.mat-form-field-appearance-outline {
-    background: mat.get-color-from-palette($palette);
+    background: mat.m2-get-color-from-palette($palette);
     color: $contrast-color;
 
     .mdc-text-field__input {
-      background: mat.get-color-from-palette($palette);
+      background: mat.m2-get-color-from-palette($palette);
       color: $contrast-color;
       caret-color: currentColor;
     }

package/theming/_elder-palettes.scss

@@ -91,7 +91,7 @@ $elder-gold: (
  *                                                                         *
  **************************************************************************/
 
-$grey-palette: mat.$grey-palette;
+$grey-palette: mat.$m2-grey-palette;
 $light-primary-text: rgba(white, 0.87);
 $light-secondary-text: rgba(white, 0.40);
 $light-disabled-text: rgba(white, 0.38);

package/theming/_elder-scrollbar-theme.scss

@@ -50,13 +50,13 @@
 
     /* Handle */
     ::-webkit-scrollbar-thumb {
-      background: mat.get-color-from-palette($primary);
+      background: mat.m2-get-color-from-palette($primary);
       border-radius: 5px;
     }
 
     /* Handle on hover */
     ::-webkit-scrollbar-thumb:hover {
-      background: mat.get-color-from-palette($primary, 300);
+      background: mat.m2-get-color-from-palette($primary, 300);
     }
   }
 }

package/theming/_elder-theme.scss

@@ -30,7 +30,7 @@
   @return (
     primary: $primary,
     accent: $accent,
-    warn: if($warn != null, $warn, mat.define-palette(mat.$red-palette)),
+    warn: if($warn != null, $warn, mat.m2-define-palette(mat.$m2-red-palette)),
     is-dark: true,
     foreground: palettes.$elder-dark-theme-foreground,
     background: palettes.$elder-dark-theme-background

package/theming/_elder-toast-theme.scss

@@ -34,15 +34,15 @@
   }*/
 
   .elder-primary-text {
-    color: mat.get-color-from-palette($primary);
+    color: mat.m2-get-color-from-palette($primary);
   }
 
   .elder-accent-text {
-    color: mat.get-color-from-palette($accent);
+    color: mat.m2-get-color-from-palette($accent);
   }
 
   .elder-warn-text {
-    color: mat.get-color-from-palette($warn);
+    color: mat.m2-get-color-from-palette($warn);
   }
 
 }

package/theming/_elder-typography-utils.scss

@@ -12,11 +12,11 @@
 }
 
 @function get-typography-config($config) {
-  $typography: mat.get-typography-config($config);
+  $typography: mat.m2-get-typography-config($config);
 
   // If no actual typography configuration has been specified, create a default one.
   @if not $typography {
-    $typography: mat.define-typography-config();
+    $typography: mat.m2-define-typography-config();
   }
 
   @return $typography;