From 29aea1f97824acbe22f92d6cc322f96b837c8b3f Mon Sep 17 00:00:00 2001
From: Wojciech Duda <69160975+wojd0@users.noreply.github.com>
Date: Wed, 13 Dec 2023 17:35:55 +0100
Subject: [PATCH 1/8] [AAE-15295] added design tokens to PeopleCloudComponent

---
 .../src/lib/styles/_components-variables.scss |  7 +++++
 .../src/lib/styles/_reference-variables.scss  |  3 ++
 .../components/people-cloud.component.html    |  9 ++++--
 .../components/people-cloud.component.scss    | 29 ++++++++++++-------
 4 files changed, 35 insertions(+), 13 deletions(-)

diff --git a/lib/core/src/lib/styles/_components-variables.scss b/lib/core/src/lib/styles/_components-variables.scss
index 313b00eb76c..7849e29b45b 100644
--- a/lib/core/src/lib/styles/_components-variables.scss
+++ b/lib/core/src/lib/styles/_components-variables.scss
@@ -4,6 +4,7 @@
 @mixin adf-components-variables($theme) {
     $primary: map-get($theme, primary);
     $accent: map-get($theme, accent);
+    $warn: map-get($theme, warn);
 
     $defaults: (
         --adf-card-view-background: $adf-ref-card-background,
@@ -62,6 +63,12 @@
         --adf-info-drawer-tab-active-focused-background: mat.get-color-from-palette($primary),
         --adf-info-drawer-tab-active-focused-color:unset,
         --adf-info-drawer-tab-active-focused-bottom-line:unset,
+
+        --adf-people-cloud-input-label-default-color: $adf-ref-text-field-label-color,
+        --adf-people-cloud-input-label-focus-color: mat.get-color-from-palette($primary),
+        --adf-people-cloud-autosuggest-result-active-color: $adf-ref-autosuggest-result-active-color,
+        --adf-people-cloud-autosuggest-result-disabled-color: $adf-ref-autosuggest-result-disabled-color,
+        --adf-people-cloud-input-caption-error-color: mat.get-color-from-palette($warn)
     );
 
     // propagates SCSS variables into the CSS variables scope
diff --git a/lib/core/src/lib/styles/_reference-variables.scss b/lib/core/src/lib/styles/_reference-variables.scss
index d214c5fff04..9b375d76046 100644
--- a/lib/core/src/lib/styles/_reference-variables.scss
+++ b/lib/core/src/lib/styles/_reference-variables.scss
@@ -6,6 +6,7 @@ $adf-ref-height-48: 48px;
 $adf-ref-title-color: rgba(0, 0, 0, 0.87);
 $adf-ref-description-color: rgba(0, 0, 0, 0.54);
 $adf-ref-text-field-label-color: rgba(0, 0, 0, 0.54);
+$adf-ref-text-field-caption-error-color: #f44336;
 $adf-ref-select-field-label-color: rgba(0, 0, 0, 0.54);
 $adf-ref-card-color: rgba(0, 0, 0, 0.87);
 $adf-ref-card-padding: 16px;
@@ -27,3 +28,5 @@ $adf-ref-height: 40px;
 $adf-ref-width: 40px;
 $adf-ref-line-height: 40px;
 $adf-ref-margin-right: 8px;
+$adf-ref-autosuggest-result-active-color: rgba(0, 0, 0, 0.87);
+$adf-ref-autosuggest-result-disabled-color: rgba(0, 0, 0, 0.54);
diff --git a/lib/process-services-cloud/src/lib/people/components/people-cloud.component.html b/lib/process-services-cloud/src/lib/people/components/people-cloud.component.html
index 0a00b873523..29bee9e0c49 100644
--- a/lib/process-services-cloud/src/lib/people/components/people-cloud.component.html
+++ b/lib/process-services-cloud/src/lib/people/components/people-cloud.component.html
@@ -1,6 +1,7 @@
 <form>
-    <mat-form-field [floatLabel]="'auto'" class="adf-people-cloud" [class.adf-invalid]="hasError() && isDirty()">
-        <mat-label *ngIf="!isReadonly()" id="adf-people-cloud-title-id">{{ title | translate }}</mat-label>
+    <mat-form-field floatLabel="auto" class="adf-people-cloud" [class.adf-invalid]="hasError() && isDirty()">
+        <mat-label *ngIf="!isReadonly()" id="adf-people-cloud-title-id" class="adf-people-cloud-title"
+            [ngClass]="{'adf-people-cloud-title--focus': isFocused}">{{ title | translate }}</mat-label>
         <mat-chip-list #userMultipleChipList [disabled]="isReadonly() || isValidationLoading()" data-automation-id="adf-cloud-people-chip-list">
             <mat-chip
                 *ngFor="let user of selectedUsers"
@@ -17,6 +18,7 @@
                 </mat-icon>
             </mat-chip>
             <input *ngIf="!isReadonly()" matInput
+                   #chipInput
                    [formControl]="searchUserCtrl"
                    [matAutocomplete]="auto"
                    [matChipInputFor]="userMultipleChipList"
@@ -32,7 +34,8 @@
                           (optionSelected)="onSelect($event.option.value)"
                           [displayWith]="getDisplayName">
             <ng-container *ngIf="(searchUsers$ | async)?.length else noResults" >
-            <mat-option *ngFor="let user of searchUsers$ | async; let i = index" [value]="user">
+            <mat-option *ngFor="let user of searchUsers$ | async; let i = index" [value]="user"
+                class="adf-people-cloud-option-active">
                 <div class="adf-people-cloud-row" id="adf-people-cloud-user-{{user.username}}"
                      data-automation-id="adf-people-cloud-row">
                     <div [outerHTML]="user | usernameInitials:'adf-people-cloud-pic'"></div>
diff --git a/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss b/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss
index 4531a2ae6c2..06ce3685b0a 100644
--- a/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss
+++ b/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss
@@ -5,6 +5,14 @@
         &-option-not-active {
             background: inherit !important;
         }
+
+        &-title {
+            color: var(--adf-people-cloud-input-label-default-color);
+
+            &--focus {
+                color: var(--adf-people-cloud-input-label-focus-color);
+            }
+        }
     }
 
     &-people-cloud-list {
@@ -12,6 +20,14 @@
         padding: 10px 0;
     }
 
+    &-people-cloud-option-active:not(&:disabled){
+        color: var(--adf-people-cloud-autosuggest-result-active-color);
+    }
+
+    &-people-cloud-option-not-active:not(&:active) {
+        color: var(--adf-people-cloud-autosuggest-result-disabled-color);
+    }
+
     &-people-cloud-row {
         display: flex;
         align-items: center;
@@ -19,16 +35,12 @@
     }
 
     &-people-cloud-pic {
-        background: var(--theme-primary-color);
         display: flex;
         justify-content: center;
         align-items: center;
         width: 40px;
         height: 40px;
         border-radius: 100px;
-        color: var(--adf-theme-foreground-text-color);
-        font-weight: bolder;
-        font-size: var(--theme-adf-picture-1-font-size);
         text-transform: uppercase;
     }
 
@@ -40,15 +52,12 @@
         &-message {
             padding-right: 8px;
             height: 16px;
-            font-size: var(--theme-caption-font-size);
             line-height: 1.33;
-            color: var(--theme-warn-color);
             width: auto;
         }
+    }
 
-        &-icon {
-            font-size: var(--theme-adf-icon-1-font-size);
-            color: var(--theme-warn-color);
-        }
+    &-error, &-error-text, &-error-icon {
+        color: var(--adf-people-cloud-input-caption-error-color);
     }
 }

From 4081434c1f2f31a158d34e799bc9a118d91bdf1e Mon Sep 17 00:00:00 2001
From: Wojciech Duda <69160975+wojd0@users.noreply.github.com>
Date: Wed, 13 Dec 2023 17:55:16 +0100
Subject: [PATCH 2/8] [AAE-15295] fix linting

---
 .../src/lib/people/components/people-cloud.component.scss   | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss b/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss
index 06ce3685b0a..60bfb27e114 100644
--- a/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss
+++ b/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss
@@ -20,7 +20,7 @@
         padding: 10px 0;
     }
 
-    &-people-cloud-option-active:not(&:disabled){
+    &-people-cloud-option-active:not(&:disabled) {
         color: var(--adf-people-cloud-autosuggest-result-active-color);
     }
 
@@ -57,7 +57,9 @@
         }
     }
 
-    &-error, &-error-text, &-error-icon {
+    &-error,
+    &-error-text,
+    &-error-icon {
         color: var(--adf-people-cloud-input-caption-error-color);
     }
 }

From 759a16da0a2e820a5ef735754e2d356f20023457 Mon Sep 17 00:00:00 2001
From: Wojciech Duda <69160975+wojd0@users.noreply.github.com>
Date: Thu, 14 Dec 2023 09:44:01 +0100
Subject: [PATCH 3/8] [AAE-15295] re-add initials picture background

---
 .../src/lib/people/components/people-cloud.component.scss        | 1 +
 1 file changed, 1 insertion(+)

diff --git a/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss b/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss
index 60bfb27e114..8d153117753 100644
--- a/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss
+++ b/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss
@@ -35,6 +35,7 @@
     }
 
     &-people-cloud-pic {
+        background: var(--theme-primary-color);
         display: flex;
         justify-content: center;
         align-items: center;

From bea426d35c4c01fbc4997c083a62823df374aa3c Mon Sep 17 00:00:00 2001
From: Wojciech Duda <69160975+wojd0@users.noreply.github.com>
Date: Fri, 15 Dec 2023 15:22:04 +0100
Subject: [PATCH 4/8] [AAE-15295] add reference variables

---
 .../src/lib/styles/_components-variables.scss    | 16 ++++++++--------
 .../src/lib/styles/_reference-variables.scss     |  5 +++++
 2 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/lib/core/src/lib/styles/_components-variables.scss b/lib/core/src/lib/styles/_components-variables.scss
index 7849e29b45b..3209db57cac 100644
--- a/lib/core/src/lib/styles/_components-variables.scss
+++ b/lib/core/src/lib/styles/_components-variables.scss
@@ -52,17 +52,17 @@
         --adf-user-info-container-margin-right: $adf-ref-margin-right,
 
         --adf-info-drawer-tab-default-color: mat.get-color-from-palette($accent),
-        --adf-info-drawer-tab-default-background:unset,
-        --adf-info-drawer-tab-default-bottom-line:unset,
+        --adf-info-drawer-tab-default-background: $adf-ref-tab-default-background,
+        --adf-info-drawer-tab-default-bottom-line:$adf-ref-tab-bottom-line-default,
         --adf-info-drawer-tab-hover-color:mat.get-color-from-palette($accent),
-        --adf-info-drawer-tab-hover-background:unset,
-        --adf-info-drawer-tab-hover-bottom-line:unset,
+        --adf-info-drawer-tab-hover-background: $adf-ref-tab-default-background,
+        --adf-info-drawer-tab-hover-bottom-line:$adf-ref-tab-bottom-line-default,
         --adf-info-drawer-tab-active-unfocused-color: mat.get-color-from-palette($primary),
-        --adf-info-drawer-tab-active-unfocused-background:unset,
-        --adf-info-drawer-tab-active-unfocused-bottom-line:unset,
+        --adf-info-drawer-tab-active-unfocused-background: $adf-ref-tab-default-background,
+        --adf-info-drawer-tab-active-unfocused-bottom-line: $adf-ref-tab-bottom-line-default,
         --adf-info-drawer-tab-active-focused-background: mat.get-color-from-palette($primary),
-        --adf-info-drawer-tab-active-focused-color:unset,
-        --adf-info-drawer-tab-active-focused-bottom-line:unset,
+        --adf-info-drawer-tab-active-focused-color: $adf-ref-tab-color-active,
+        --adf-info-drawer-tab-active-focused-bottom-line: $adf-ref-tab-bottom-line-active,
 
         --adf-people-cloud-input-label-default-color: $adf-ref-text-field-label-color,
         --adf-people-cloud-input-label-focus-color: mat.get-color-from-palette($primary),
diff --git a/lib/core/src/lib/styles/_reference-variables.scss b/lib/core/src/lib/styles/_reference-variables.scss
index 9b375d76046..64fcb3476c3 100644
--- a/lib/core/src/lib/styles/_reference-variables.scss
+++ b/lib/core/src/lib/styles/_reference-variables.scss
@@ -30,3 +30,8 @@ $adf-ref-line-height: 40px;
 $adf-ref-margin-right: 8px;
 $adf-ref-autosuggest-result-active-color: rgba(0, 0, 0, 0.87);
 $adf-ref-autosuggest-result-disabled-color: rgba(0, 0, 0, 0.54);
+$adf-ref-tab-default-background: white;
+$adf-ref-tab-hover-background: white;
+$adf-ref-tab-bottom-line-default: unset;
+$adf-ref-tab-bottom-line-active: unset;
+$adf-ref-tab-color-active: black;

From 15bbcd82000465dbc7571eb049068ad2ac3465c2 Mon Sep 17 00:00:00 2001
From: Wojciech Duda <69160975+wojd0@users.noreply.github.com>
Date: Fri, 15 Dec 2023 17:28:17 +0100
Subject: [PATCH 5/8] [AAE-15295] replaced reference variables with theme

---
 .../src/lib/styles/_components-variables.scss | 56 +++++++++----------
 .../src/lib/styles/_reference-variables.scss  | 18 ------
 2 files changed, 28 insertions(+), 46 deletions(-)

diff --git a/lib/core/src/lib/styles/_components-variables.scss b/lib/core/src/lib/styles/_components-variables.scss
index 3209db57cac..9294157f60e 100644
--- a/lib/core/src/lib/styles/_components-variables.scss
+++ b/lib/core/src/lib/styles/_components-variables.scss
@@ -7,43 +7,43 @@
     $warn: map-get($theme, warn);
 
     $defaults: (
-        --adf-card-view-background: $adf-ref-card-background,
+        --adf-card-view-background: mat.get-color-from-palette($background, card),
         --adf-card-view-border: $adf-ref-card-border,
-        --adf-card-view-border-color: $adf-ref-card-border-color,
+        --adf-card-view-border-color: mat.get-color-from-palette($foreground, divider),
         --adf-card-view-border-radius: $adf-ref-card-border-radius-slim,
-        --adf-card-view-array-item-background: $adf-ref-card-background,
+        --adf-card-view-array-item-background: mat.get-color-from-palette($background, card),
         --adf-card-view-array-item-border: $adf-ref-card-border,
-        --adf-card-view-array-item-border-color: $adf-ref-card-border-color,
+        --adf-card-view-array-item-border-color: mat.get-color-from-palette($foreground, divider),
         --adf-card-view-array-item-border-radius: $adf-ref-card-border-radius-slim,
-        --adf-edit-task-and-service-filter-header-title-color: $adf-ref-title-color,
-        --adf-edit-task-and-service-filter-header-description-color: $adf-ref-description-color,
-        --adf-edit-task-and-service-filter-content-text-label-color: $adf-ref-text-field-label-color,
-        --adf-edit-task-and-service-filter-content-select-label-color: $adf-ref-select-field-label-color,
+        --adf-edit-task-and-service-filter-header-title-color: mat.get-color-from-palette($foreground, text),
+        --adf-edit-task-and-service-filter-header-description-color: mat.get-color-from-palette($foreground, secondary-text),
+        --adf-edit-task-and-service-filter-content-text-label-color: mat.get-color-from-palette($foreground, secondary-text),
+        --adf-edit-task-and-service-filter-content-select-label-color: mat.get-color-from-palette($foreground, secondary-text),
         --adf-edit-task-and-service-filter-header-height: $adf-ref-height-48,
         --adf-about-panel-header-height: $adf-ref-height-48,
-        --adf-about-panel-header-title-color: $adf-ref-title-color,
+        --adf-about-panel-header-title-color: mat.get-color-from-palette($foreground, text),
         --adf-edit-process-filter-header-height: $adf-ref-height-48,
-        --adf-edit-process-filter-header-title-color: $adf-ref-title-color,
-        --adf-edit-process-filter-header-description-color: $adf-ref-description-color,
-        --adf-edit-process-filter-content-text-label-color: $adf-ref-text-field-label-color,
-        --adf-edit-process-filter-content-select-label-color: $adf-ref-select-field-label-color,
-        --adf-about-server-settings-background: $adf-ref-card-background,
-        --adf-about-server-settings-color: $adf-ref-card-color,
+        --adf-edit-process-filter-header-title-color: mat.get-color-from-palette($foreground, text),
+        --adf-edit-process-filter-header-description-color: mat.get-color-from-palette($foreground, secondary-text),
+        --adf-edit-process-filter-content-text-label-color: mat.get-color-from-palette($foreground, secondary-text),
+        --adf-edit-process-filter-content-select-label-color: mat.get-color-from-palette($foreground, secondary-text),
+        --adf-about-server-settings-background: mat.get-color-from-palette($background, card),
+        --adf-about-server-settings-color: mat.get-color-from-palette($foreground, text),
         --adf-about-server-settings-border-radius: $adf-ref-card-border-radius-normal,
         --adf-about-server-settings-padding: $adf-ref-card-padding,
-        --adf-package-list-table-background: $adf-ref-table-background,
-        --adf-package-list-table-header-border-bottom-color: $adf-ref-table-header-border-bottom-color,
+        --adf-package-list-table-background: mat.get-color-from-palette($background, card),
+        --adf-package-list-table-header-border-bottom-color: mat.get-color-from-palette($foreground, divider),
         --adf-package-list-table-header-border-style: $adf-ref-table-header-border-style,
         --adf-package-list-table-header-border-bottom-width: $adf-ref-table-header-border-bottom-width,
         --adf-package-list-table-header-border-width: $adf-ref-table-header-border-width,
         --adf-package-list-table-header-min-height: $adf-ref-table-header-min-height,
-        --adf-package-list-table-header-cell-color: $adf-ref-table-header-cell-color,
-        --adf-package-list-table-row-border-bottom-color: $adf-ref-table-row-border-bottom-color,
+        --adf-package-list-table-header-cell-color: mat.get-color-from-palette($foreground, secondary-text),
+        --adf-package-list-table-row-border-bottom-color: mat.get-color-from-palette($foreground, dividers),
         --adf-package-list-table-row-border-style: $adf-ref-table-row-border-style,
         --adf-package-list-table-row-border-bottom-width: $adf-ref-table-row-border-bottom-width,
         --adf-package-list-table-row-border-width: $adf-ref-table-row-border-width,
         --adf-package-list-table-row-min-height: $adf-ref-table-row-min-height,
-        --adf-package-list-table-row-cell-color: $adf-ref-table-row-cell-color,
+        --adf-package-list-table-row-cell-color: mat.get-color-from-palette($foreground, text),
         --adf-identity-user-info-background: var(--adf-theme-primary-300),
         --adf-identity-user-info-height: $adf-ref-height,
         --adf-identity-user-info-width: $adf-ref-width,
@@ -52,23 +52,23 @@
         --adf-user-info-container-margin-right: $adf-ref-margin-right,
 
         --adf-info-drawer-tab-default-color: mat.get-color-from-palette($accent),
-        --adf-info-drawer-tab-default-background: $adf-ref-tab-default-background,
+        --adf-info-drawer-tab-default-background: mat.get-color-from-palette($background, card),
         --adf-info-drawer-tab-default-bottom-line:$adf-ref-tab-bottom-line-default,
         --adf-info-drawer-tab-hover-color:mat.get-color-from-palette($accent),
-        --adf-info-drawer-tab-hover-background: $adf-ref-tab-default-background,
+        --adf-info-drawer-tab-hover-background: mat.get-color-from-palette($background, card),
         --adf-info-drawer-tab-hover-bottom-line:$adf-ref-tab-bottom-line-default,
         --adf-info-drawer-tab-active-unfocused-color: mat.get-color-from-palette($primary),
-        --adf-info-drawer-tab-active-unfocused-background: $adf-ref-tab-default-background,
+        --adf-info-drawer-tab-active-unfocused-background: mat.get-color-from-palette($background, card),
         --adf-info-drawer-tab-active-unfocused-bottom-line: $adf-ref-tab-bottom-line-default,
+        --adf-info-drawer-tab-active-focused-color: mat.get-color-from-palette($foreground, text),
         --adf-info-drawer-tab-active-focused-background: mat.get-color-from-palette($primary),
-        --adf-info-drawer-tab-active-focused-color: $adf-ref-tab-color-active,
         --adf-info-drawer-tab-active-focused-bottom-line: $adf-ref-tab-bottom-line-active,
 
-        --adf-people-cloud-input-label-default-color: $adf-ref-text-field-label-color,
+        --adf-people-cloud-input-label-default-color: mat.get-color-from-palette($foreground, secondary-text),
         --adf-people-cloud-input-label-focus-color: mat.get-color-from-palette($primary),
-        --adf-people-cloud-autosuggest-result-active-color: $adf-ref-autosuggest-result-active-color,
-        --adf-people-cloud-autosuggest-result-disabled-color: $adf-ref-autosuggest-result-disabled-color,
-        --adf-people-cloud-input-caption-error-color: mat.get-color-from-palette($warn)
+        --adf-people-cloud-autosuggest-result-active-color: mat.get-color-from-palette($foreground, text),
+        --adf-people-cloud-autosuggest-result-disabled-color: mat.get-color-from-palette($foreground, secondary-text),
+        --adf-people-cloud-input-caption-error-color: mat.get-color-from-palette($warn),
     );
 
     // propagates SCSS variables into the CSS variables scope
diff --git a/lib/core/src/lib/styles/_reference-variables.scss b/lib/core/src/lib/styles/_reference-variables.scss
index 64fcb3476c3..36de914b001 100644
--- a/lib/core/src/lib/styles/_reference-variables.scss
+++ b/lib/core/src/lib/styles/_reference-variables.scss
@@ -1,37 +1,19 @@
-$adf-ref-card-background: white;
 $adf-ref-card-border: unset;
-$adf-ref-card-border-color: unset;
 $adf-ref-card-border-radius-slim: 0;
 $adf-ref-height-48: 48px;
-$adf-ref-title-color: rgba(0, 0, 0, 0.87);
-$adf-ref-description-color: rgba(0, 0, 0, 0.54);
-$adf-ref-text-field-label-color: rgba(0, 0, 0, 0.54);
-$adf-ref-text-field-caption-error-color: #f44336;
-$adf-ref-select-field-label-color: rgba(0, 0, 0, 0.54);
-$adf-ref-card-color: rgba(0, 0, 0, 0.87);
 $adf-ref-card-padding: 16px;
 $adf-ref-card-border-radius-normal: 4px;
-$adf-ref-table-background: white;
-$adf-ref-table-header-border-bottom-color: rgba(0, 0, 0, 0.12);
 $adf-ref-table-header-border-style: solid;
 $adf-ref-table-header-border-bottom-width: 1px;
 $adf-ref-table-header-border-width: 0;
 $adf-ref-table-header-min-height: 56px;
-$adf-ref-table-header-cell-color: rgba(0, 0, 0, 0.54);
-$adf-ref-table-row-border-bottom-color: rgba(0, 0, 0, 0.12);
 $adf-ref-table-row-border-style: solid;
 $adf-ref-table-row-border-bottom-width: 1px;
 $adf-ref-table-row-border-width: 0;
 $adf-ref-table-row-min-height: 48px;
-$adf-ref-table-row-cell-color: rgba(0, 0, 0, 0.87);
 $adf-ref-height: 40px;
 $adf-ref-width: 40px;
 $adf-ref-line-height: 40px;
 $adf-ref-margin-right: 8px;
-$adf-ref-autosuggest-result-active-color: rgba(0, 0, 0, 0.87);
-$adf-ref-autosuggest-result-disabled-color: rgba(0, 0, 0, 0.54);
-$adf-ref-tab-default-background: white;
-$adf-ref-tab-hover-background: white;
 $adf-ref-tab-bottom-line-default: unset;
 $adf-ref-tab-bottom-line-active: unset;
-$adf-ref-tab-color-active: black;

From 4c23055f19ff30e4eae6d7e3a6156d102e7d18d7 Mon Sep 17 00:00:00 2001
From: Wojciech Duda <69160975+wojd0@users.noreply.github.com>
Date: Fri, 15 Dec 2023 17:30:58 +0100
Subject: [PATCH 6/8] [AAE-15295] removed comma

---
 lib/core/src/lib/styles/_components-variables.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/lib/core/src/lib/styles/_components-variables.scss b/lib/core/src/lib/styles/_components-variables.scss
index 9294157f60e..faf8ff5317d 100644
--- a/lib/core/src/lib/styles/_components-variables.scss
+++ b/lib/core/src/lib/styles/_components-variables.scss
@@ -69,6 +69,7 @@
         --adf-people-cloud-autosuggest-result-active-color: mat.get-color-from-palette($foreground, text),
         --adf-people-cloud-autosuggest-result-disabled-color: mat.get-color-from-palette($foreground, secondary-text),
         --adf-people-cloud-input-caption-error-color: mat.get-color-from-palette($warn),
+        
     );
 
     // propagates SCSS variables into the CSS variables scope

From cf316eb31ccac7e79d3a457f43741de15a5905ac Mon Sep 17 00:00:00 2001
From: Wojciech Duda <69160975+wojd0@users.noreply.github.com>
Date: Fri, 15 Dec 2023 17:31:14 +0100
Subject: [PATCH 7/8] [AAE-15295] removed comma

---
 lib/core/src/lib/styles/_components-variables.scss | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/lib/core/src/lib/styles/_components-variables.scss b/lib/core/src/lib/styles/_components-variables.scss
index faf8ff5317d..0fa7e7050a8 100644
--- a/lib/core/src/lib/styles/_components-variables.scss
+++ b/lib/core/src/lib/styles/_components-variables.scss
@@ -68,8 +68,8 @@
         --adf-people-cloud-input-label-focus-color: mat.get-color-from-palette($primary),
         --adf-people-cloud-autosuggest-result-active-color: mat.get-color-from-palette($foreground, text),
         --adf-people-cloud-autosuggest-result-disabled-color: mat.get-color-from-palette($foreground, secondary-text),
-        --adf-people-cloud-input-caption-error-color: mat.get-color-from-palette($warn),
-        
+        --adf-people-cloud-input-caption-error-color: mat.get-color-from-palette($warn)
+
     );
 
     // propagates SCSS variables into the CSS variables scope

From 9d19ffb2bf5a3cfe13df1ec90263153b03bb34f3 Mon Sep 17 00:00:00 2001
From: Wojciech Duda <69160975+wojd0@users.noreply.github.com>
Date: Mon, 18 Dec 2023 12:54:23 +0100
Subject: [PATCH 8/8] [AAE-15295] fix demoshell not building

---
 lib/core/src/lib/styles/_components-variables.scss | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/lib/core/src/lib/styles/_components-variables.scss b/lib/core/src/lib/styles/_components-variables.scss
index 0fa7e7050a8..11f24ab28c8 100644
--- a/lib/core/src/lib/styles/_components-variables.scss
+++ b/lib/core/src/lib/styles/_components-variables.scss
@@ -5,6 +5,8 @@
     $primary: map-get($theme, primary);
     $accent: map-get($theme, accent);
     $warn: map-get($theme, warn);
+    $foreground: map-get($theme, foreground);
+    $background: map-get($theme, background);
 
     $defaults: (
         --adf-card-view-background: mat.get-color-from-palette($background, card),