From e8f5bc8f2c0716cd20beb9315b67807157c6c9cc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adina=20=C8=9Aeudan?= <adina.teudan.ext@knecon.com>
Date: Wed, 22 May 2024 14:37:08 +0300
Subject: [PATCH 1/2] RED-6959: Added selected items count to table header

---
 src/lib/listing/table-header/table-header.component.html | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/lib/listing/table-header/table-header.component.html b/src/lib/listing/table-header/table-header.component.html
index 527378c..3ca9bd8 100644
--- a/src/lib/listing/table-header/table-header.component.html
+++ b/src/lib/listing/table-header/table-header.component.html
@@ -1,15 +1,18 @@
 <div [class.selection-enabled]="selectionEnabled" class="header-item">
     <div [attr.help-mode-key]="helpModeKey" class="header-title">
         <iqser-round-checkbox
-            id="select-all-entities-toggle"
             (click)="listingService.selectAll()"
             *ngIf="selectionEnabled"
             [active]="listingService.areAllSelected$ | async"
             [indeterminate]="listingService.notAllSelected$ | async"
+            id="select-all-entities-toggle"
         ></iqser-round-checkbox>
 
         <span class="all-caps-label">
             {{ tableHeaderLabel | translate: { length: totalSize || (listingService.displayedLength$ | async) } }}
+            <span *ngIf="listingService.selectedLength$ | async as selectedItems">
+                ({{ 'table-header.selected-count' | translate: { count: selectedItems } }})
+            </span>
         </span>
     </div>
 
@@ -33,12 +36,12 @@
     <iqser-table-column-name
         *ngFor="let config of tableColumnConfigs"
         [class]="config.class"
+        [id]="config.id"
         [label]="config.notTranslatable ? config.label : (config.label | translate)"
         [leftIcon]="config.leftIcon"
         [rightIconTooltip]="config.rightIconTooltip"
         [rightIcon]="config.rightIcon"
         [sortByKey]="config.sortByKey"
-        [id]="config.id"
     ></iqser-table-column-name>
 
     <div *ngIf="hasEmptyColumn"></div>

From e7fca876bb0064ebceb6d18d721260c078a9a556 Mon Sep 17 00:00:00 2001
From: Valentin Mihai <Valentin-Gabriel.Mihai.ext@knecon.com>
Date: Wed, 22 May 2024 21:31:22 +0300
Subject: [PATCH 2/2] RED-8882 - made help button smaller

---
 src/assets/styles/common-base-screen.scss         |  1 +
 .../help-button/help-button.component.scss        | 15 ++++++++-------
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/assets/styles/common-base-screen.scss b/src/assets/styles/common-base-screen.scss
index 764101c..874f031 100644
--- a/src/assets/styles/common-base-screen.scss
+++ b/src/assets/styles/common-base-screen.scss
@@ -32,6 +32,7 @@
     .buttons {
         display: flex;
         margin-right: 8px;
+        align-items: center;
 
         > *:not(:last-child) {
             margin-right: 14px;
diff --git a/src/lib/help-mode/help-button/help-button.component.scss b/src/lib/help-mode/help-button/help-button.component.scss
index fad7ffe..1d5c87c 100644
--- a/src/lib/help-mode/help-button/help-button.component.scss
+++ b/src/lib/help-mode/help-button/help-button.component.scss
@@ -1,14 +1,15 @@
 :host {
     display: flex;
     align-items: center;
-    width: 60px;
+    width: 40px;
+    height: 24px;
 }
 
 .help-mode-slide-toggle {
     display: inline-block;
     position: relative;
-    width: 60px;
-    height: 34px;
+    width: 40px;
+    height: 24px;
     cursor: pointer;
 
     &.active,
@@ -25,7 +26,7 @@
         top: 50%;
         left: 0;
         width: 100%;
-        height: 34px;
+        height: 25px;
         background-color: var(--iqser-grey-4);
         border-radius: 20px;
         transform: translateY(-50%);
@@ -35,8 +36,8 @@
         position: absolute;
         top: 50%;
         left: 4px;
-        width: 25px;
-        height: 25px;
+        width: 20px;
+        height: 20px;
         background-color: #fff;
         border-radius: 50%;
         box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
@@ -60,6 +61,6 @@
     }
 
     .toggle-input:checked + .toggle-track + .toggle-thumb {
-        left: calc(100% - 30px);
+        left: calc(100% - 22px);
     }
 }