chore: run ng update

simeonoff · simeonoff · commit 6e03394660e8 · 2024-04-24T16:23:56.000+03:00
diff --git a/src/app/data-entries/buttons/buttons-sample-4/buttons-sample-4.component.html b/src/app/data-entries/buttons/buttons-sample-4/buttons-sample-4.component.html
@@ -1 +1 @@
-<span class="btn" igxButton="contained"  igxButtonColor="black" igxButtonBackground="#72da67" igxRipple="white">Span</span>
+<span class="btn" igxButton="contained" igxRipple="white">Span</span>
diff --git a/src/app/grid/grid-editing-style-sample/grid-editing-style-sample.component.scss b/src/app/grid/grid-editing-style-sample/grid-editing-style-sample.component.scss
@@ -19,7 +19,7 @@ $checkbox-theme: checkbox-theme(
 );
 
 $datepicker-theme: calendar-theme(
-    $date-selected-text-color: $white,
+    $date-selected-foreground: $white,
     $date-selected-background: $blue
 );
 
diff --git a/src/app/grid/grid-multi-row-layout-configuration/grid-multi-row-layout-configuration.component.html b/src/app/grid/grid-multi-row-layout-configuration/grid-multi-row-layout-configuration.component.html
@@ -115,9 +115,9 @@
             </igx-chips-area>
         </div>
         <div style="width: 100%; text-align: center; margin: 10px;">
-            <span igxButton="contained" class="bottomButton" (click)="resetCollections()" [igxButtonBackground]="'#ff134a'" [igxButtonColor]="'white'">Clear Layout</span>
-            <span igxButton="contained" class="bottomButton" (click)="getColumnLayoutTemplate()" [igxButtonBackground]="'#1377d5'" [igxButtonColor]="'white'">Template</span>
-            <span igxButton="contained" class="bottomButton" (click)="renderJson()" [igxButtonBackground]="'#1377d5'" [igxButtonColor]="'white'">JSON</span>
+            <span igxButton="contained" class="bottomButton" (click)="resetCollections()">Clear Layout</span>
+            <span igxButton="contained" class="bottomButton" (click)="getColumnLayoutTemplate()">Template</span>
+            <span igxButton="contained" class="bottomButton" (click)="renderJson()">JSON</span>
         </div>
 
         <igx-dialog #resultDialog title="Result"
diff --git a/src/app/grid/grid-save-state/about.component.html b/src/app/grid/grid-save-state/about.component.html
@@ -3,5 +3,5 @@
     <span>Navigating to the previous page, components will reinitialize as per their initial configuration, therefore the igxGrid will lose its state.</span>
     <br />
     <span>What our GridSaveStateComponent does is reading the state from the window.localStorage object and applying the corresponding state in the AfterViewInit lifecycle.</span><br />
-    <span igxButton="contained" igxButtonColor="white" igxButtonBackground="#e41c77" [routerLink]="['../grid-state']">Go Back</span>
+    <span igxButton="contained" [routerLink]="['../grid-state']">Go Back</span>
 </div>
diff --git a/src/app/hierarchical-grid/hierarchical-grid-editing-style/hierarchical-grid-editing-style.component.scss b/src/app/hierarchical-grid/hierarchical-grid-editing-style/hierarchical-grid-editing-style.component.scss
@@ -30,7 +30,7 @@ $checkbox-theme: checkbox-theme(
 );
 
 $datepicker-theme: calendar-theme(
-    $date-selected-text-color: $white,
+    $date-selected-foreground: $white,
     $date-selected-background: $blue
 );
 
diff --git a/src/app/hierarchical-grid/hierarchical-grid-save-state/about.component.html b/src/app/hierarchical-grid/hierarchical-grid-save-state/about.component.html
@@ -3,5 +3,5 @@
     <span>Navigating to the previous page, components will reinitialize as per their initial configuration, therefore the igxHierarchicalGrid will lose its state.</span>
     <br />
     <span>What our GridSaveStateComponent does is reading the state from the window.localStorage object and applying the corresponding state in the AfterViewInit lifecycle.</span><br />
-    <span igxButton="contained" igxButtonColor="white" igxButtonBackground="#e41c77" [routerLink]="['../hGrid-state']">Go Back</span>
+    <span igxButton="contained" [routerLink]="['../hGrid-state']">Go Back</span>
 </div>
diff --git a/src/app/lists/list/list-chat-sample/list-chat-sample.component.html b/src/app/lists/list/list-chat-sample/list-chat-sample.component.html
@@ -44,7 +44,7 @@
                 <input class="input-round-box" placeholder="Send message" autocomplete="off" igxInput #newMessage name="newMessage"
                     [(ngModel)]="message" (keypress)="onMessageKeypress($event)" />
             </igx-input-group>
-            <button class="send-message-button" igxIconButton="flat" igxButtonColor="#09f" igxButtonBackground="#fff"
+            <button class="send-message-button" igxIconButton="flat"
                 igxRipple="#09f" [igxRippleCentered]="true" (click)="onSendButtonClick()">
                 <igx-icon family="material">send</igx-icon>
             </button>
diff --git a/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.html b/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.html
@@ -7,8 +7,8 @@ <h6>Snackbar Component that uses Content projection</h6>
 
     <span>
         <h6>Snackbar Component which dynamically changes the message text</h6>
-        <button igxButton="outlined" igxButtonColor="blue" (click)="snackbar1.open('Hi! This is info message.')">Info Message</button>
-        <button igxButton="outlined" igxButtonColor="green" (click)="snackbar1.open('Hi! This is success message.')">Success Message</button>
+        <button igxButton="outlined" (click)="snackbar1.open('Hi! This is info message.')">Info Message</button>
+        <button igxButton="outlined" (click)="snackbar1.open('Hi! This is success message.')">Success Message</button>
         <igx-snackbar #snackbar1 [autoHide]="true" actionText="CLOSE" (clicked)="close(snackbar1)"></igx-snackbar>
     </span>
     <span>
diff --git a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html
@@ -7,10 +7,10 @@ <h6>Toast that uses content projection</h6>
     </span>
     <span>
         <h6>Toast which dynamically changes the message text</h6>
-        <button igxButton="outlined" igxButtonColor="blue" (click)="toast1.open('Hi! This is info message.')">Info Message</button>
-        <button igxButton="outlined" igxButtonColor="green" (click)="toast1.open('Hi! This is success message.')">Success Message</button>
-        <button igxButton="outlined" igxButtonColor="orange" (click)="toast1.open('Hi! This is warning message.')">Warning Message</button>
-        <button igxButton="outlined" igxButtonColor="red" (click)="toast1.open('Hi! This is error message.')">Error Message</button>
+        <button igxButton="outlined" (click)="toast1.open('Hi! This is info message.')">Info Message</button>
+        <button igxButton="outlined" (click)="toast1.open('Hi! This is success message.')">Success Message</button>
+        <button igxButton="outlined" (click)="toast1.open('Hi! This is warning message.')">Warning Message</button>
+        <button igxButton="outlined" (click)="toast1.open('Hi! This is error message.')">Error Message</button>
         <igx-toast #toast1 [autoHide]="true"></igx-toast>
     </span>
     <span>
diff --git a/src/app/pivot-grid/pivot-state-persistence/about.component.html b/src/app/pivot-grid/pivot-state-persistence/about.component.html
@@ -3,5 +3,5 @@
     <span>Navigating to the previous page, components will reinitialize as per their initial configuration, therefore the igxPivotGrid will lose its state.</span>
     <br />
     <span>What our PivotGridStatePersistanceSampleComponent does is reading the state from the window.localStorage object and applying the corresponding state in the AfterViewInit lifecycle.</span><br />
-    <span igxButton="contained" igxButtonColor="white" igxButtonBackground="#e41c77" [routerLink]="['../pivot-grid-state-persistence']">Go Back</span>
+    <span igxButton="contained" [routerLink]="['../pivot-grid-state-persistence']">Go Back</span>
 </div>
diff --git a/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.scss b/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.scss
@@ -13,18 +13,18 @@
 $custom-calendar-theme: calendar-theme(
     $header-background: #345779,
     $content-background: #fdfdfd,
-    $header-text-color: #ffffff,
-    $date-current-text-color: #2dabe8,
-    $picker-arrow-color: #2dabe8,
-    $date-selected-text-color: #fdfdfd,
-    $date-current-bg-color: #fdfdfd,
-    $picker-arrow-hover-color: #345779,
-    $year-current-text-color: #2dabe8,
-    $year-hover-text-color: #2dabe8,
-    $month-current-text-color: #2dabe8,
-    $month-hover-text-color: #2dabe8,
-    $picker-text-color: #2dabe8,
-    $picker-text-hover-color: #345779,
+    $header-foreground: #ffffff,
+    $date-current-foreground: #2dabe8,
+    $navigation-color: #2dabe8,
+    $date-selected-foreground: #fdfdfd,
+    $date-current-background: #fdfdfd,
+    $navigation-hover-color: #345779,
+    $year-current-foreground: #2dabe8,
+    $year-hover-foreground: #2dabe8,
+    $month-current-foreground: #2dabe8,
+    $month-hover-foreground: #2dabe8,
+    $picker-foreground: #2dabe8,
+    $picker-hover-foreground: #345779,
 );
 
 :host {
diff --git a/src/app/scheduling/calendar/themes/google.scss b/src/app/scheduling/calendar/themes/google.scss
@@ -11,11 +11,11 @@ $google-dark: calendar-theme(
     $header-background: $dark-gray,
     $content-background: $charcoal,
     $date-selected-background: $monte-carlo,
-    $date-current-text-color: $monte-carlo,
-    $picker-arrow-hover-color: $monte-carlo,
-    $picker-text-hover-color: $monte-carlo,
-    $year-current-text-color: $monte-carlo,
-    $year-hover-text-color: $monte-carlo,
-    $month-current-text-color: $monte-carlo,
-    $month-hover-text-color: $monte-carlo
+    $date-current-foreground: $monte-carlo,
+    $navigation-hover-color: $monte-carlo,
+    $picker-hover-foreground: $monte-carlo,
+    $year-current-foreground: $monte-carlo,
+    $year-hover-foreground: $monte-carlo,
+    $month-current-foreground: $monte-carlo,
+    $month-hover-foreground: $monte-carlo
 );
diff --git a/src/app/scheduling/datepicker/datepicker-styling-sample/datepicker-styling-sample.component.scss b/src/app/scheduling/datepicker/datepicker-styling-sample/datepicker-styling-sample.component.scss
@@ -8,18 +8,18 @@
 $custom-datepicker-theme: calendar-theme(
     $header-background: #345779,
     $content-background: #fdfdfd,
-    $header-text-color: #ffffff,
-    $date-current-text-color: #2dabe8,
-    $picker-arrow-color: #2dabe8,
-    $date-selected-text-color: #fdfdfd,
-    $date-current-bg-color: #fdfdfd,
-    $picker-arrow-hover-color: #345779,
-    $year-current-text-color: #2dabe8,
-    $year-hover-text-color: #2dabe8,
-    $month-current-text-color: #2dabe8,
-    $month-hover-text-color: #2dabe8,
-    $picker-text-color: #2dabe8,
-    $picker-text-hover-color: #345779,
+    $header-foreground: #ffffff,
+    $date-current-foreground: #2dabe8,
+    $navigation-color: #2dabe8,
+    $date-selected-foreground: #fdfdfd,
+    $date-current-background: #fdfdfd,
+    $navigation-hover-color: #345779,
+    $year-current-foreground: #2dabe8,
+    $year-hover-foreground: #2dabe8,
+    $month-current-foreground: #2dabe8,
+    $month-hover-foreground: #2dabe8,
+    $picker-foreground: #2dabe8,
+    $picker-hover-foreground: #345779,
 );
 
 :host {
diff --git a/src/app/scheduling/daterangepicker/daterangepicker-styling/daterangepicker-styling.scss b/src/app/scheduling/daterangepicker/daterangepicker-styling/daterangepicker-styling.scss
@@ -32,7 +32,7 @@ $custom-input-group-theme: input-group-theme(
 
 // CALENDAR styling specific overlay component requires outlet -> [overlaySettings]="{ outlet: element }"
 $custom-calendar-theme: calendar-theme(
-    $date-current-text-color: $today-text,
+    $date-current-foreground: $today-text,
     $border-radius: 0.5,
     $date-border-radius: 0.5
 );
diff --git a/src/app/scheduling/monthpicker/monthpicker-styling/monthpicker-styling.component.scss b/src/app/scheduling/monthpicker/monthpicker-styling/monthpicker-styling.component.scss
@@ -8,15 +8,15 @@ igx-month-picker {
 $my-calendar-theme: calendar-theme(
   $border-radius: 15px,
   $content-background: #011627,
-  $picker-background-color: #011627,
-  $month-current-text-color: #ECAA53,
+  $picker-background: #011627,
+  $month-current-foreground: #ECAA53,
   $month-hover-background: #ECAA53,
-  $year-current-text-color: #ECAA53,
-  $year-hover-text-color: #D37B08,
-  $picker-arrow-color: #ECAA53,
-  $picker-text-hover-color: #D37B08,
-  $picker-arrow-hover-color: #D37B08,
-  $picker-text-color: #ECAA53
+  $year-current-foreground: #ECAA53,
+  $year-hover-foreground: #D37B08,
+  $navigation-color: #ECAA53,
+  $picker-hover-foreground: #D37B08,
+  $navigation-hover-color: #D37B08,
+  $picker-foreground: #ECAA53
 );
 
 :host ::ng-deep {
diff --git a/src/app/theming/styles/themes.scss b/src/app/theming/styles/themes.scss
@@ -221,25 +221,25 @@ $black-paginator-theme: paginator-theme(
 
 $light-calendar-theme: calendar-theme(
     $content-background: color($light-theme-palette, "primary", 500),
-    $content-text-color: color($light-theme-palette, "secondary", 600),
+    $content-foreground: color($light-theme-palette, "secondary", 600),
     $header-background: color($light-theme-palette, "secondary", 500),
-    $header-text-color: color($light-theme-palette, "primary", 500),
-    $picker-arrow-hover-color: color($light-theme-palette, "secondary", 100),
-    $inactive-text-color: color($light-theme-palette, "secondary", 200),
-    $picker-text-hover-color: color($light-theme-palette, "secondary", 100),
-    $year-current-text-color: color($light-theme-palette, "secondary", 500),
-    $weekend-text-color: color($light-theme-palette, "secondary", 500)
+    $header-foreground: color($light-theme-palette, "primary", 500),
+    $navigation-hover-color: color($light-theme-palette, "secondary", 100),
+    $inactive-color: color($light-theme-palette, "secondary", 200),
+    $picker-hover-foreground: color($light-theme-palette, "secondary", 100),
+    $year-current-foreground: color($light-theme-palette, "secondary", 500),
+    $weekend-color: color($light-theme-palette, "secondary", 500)
 
 );
 
 $dark-calendar-theme: calendar-theme(
     $content-background: color($dark-theme-palette, "primary", 100),
-    $content-text-color: color($dark-theme-palette, "secondary", 500),
-    $inactive-text-color: color($dark-theme-palette, "primary", 700),
-    $picker-arrow-color: color($dark-theme-palette, "primary", 700),
-    $picker-arrow-hover-color: color($dark-theme-palette, "secondary", 500),
-    $picker-text-color: color($dark-theme-palette, "primary", 700),
-    $picker-text-hover-color:color($dark-theme-palette, "secondary", 500)
+    $content-foreground: color($dark-theme-palette, "secondary", 500),
+    $inactive-color: color($dark-theme-palette, "primary", 700),
+    $navigation-color: color($dark-theme-palette, "primary", 700),
+    $navigation-hover-color: color($dark-theme-palette, "secondary", 500),
+    $picker-foreground: color($dark-theme-palette, "primary", 700),
+    $picker-hover-foreground:color($dark-theme-palette, "secondary", 500)
 
 );
 
diff --git a/src/app/tree-grid/tree-grid-editing-style/tree-grid-editing-sample.component.scss b/src/app/tree-grid/tree-grid-editing-style/tree-grid-editing-sample.component.scss
@@ -19,7 +19,7 @@ $checkbox-theme: checkbox-theme(
 );
 
 $datepicker-theme: calendar-theme(
-    $date-selected-text-color: $white,
+    $date-selected-foreground: $white,
     $date-selected-background: $blue
 );
 
diff --git a/src/app/tree-grid/tree-grid-save-state/about.component.html b/src/app/tree-grid/tree-grid-save-state/about.component.html
@@ -3,5 +3,5 @@
     <span>Navigating to the previous page, components will reinitialize as per their initial configuration, therefore the igxTreeGrid will lose its state.</span>
     <br />
     <span>What our GridSaveStateComponent does is reading the state from the window.localStorage object and applying the corresponding state in the AfterViewInit lifecycle.</span><br />
-    <span igxButton="contained" igxButtonColor="white" igxButtonBackground="#e41c77" [routerLink]="['../grid-state']">Go Back</span>
+    <span igxButton="contained" [routerLink]="['../grid-state']">Go Back</span>
 </div>

Original file line number	Diff line number	Diff line change
`@@ -1 +1 @@`
`1`		`-<span class="btn" igxButton="contained" igxButtonColor="black" igxButtonBackground="#72da67" igxRipple="white">Span</span>`
	`1`	`+<span class="btn" igxButton="contained" igxRipple="white">Span</span>`