From 04310a1b62e6f120415f4fb506e18eb5a95f0b79 Mon Sep 17 00:00:00 2001
From: jacekpluta <73617938+jacekpluta@users.noreply.github.com>
Date: Thu, 21 Mar 2024 12:46:43 +0100
Subject: [PATCH] [ACS-7285] - [ACA] Angular 15 - Left sidebar + table (#3719)

---
 .../components/sidenav/sidenav.component.html    |  2 +-
 .../components/sidenav/sidenav.component.scss    | 16 ++++++++++++++--
 .../aca-content/src/lib/ui/overrides/ay11.scss   |  2 +-
 projects/aca-content/src/lib/ui/theme.scss       | 16 ++++++++++++++++
 4 files changed, 32 insertions(+), 4 deletions(-)

diff --git a/projects/aca-content/src/lib/components/sidenav/sidenav.component.html b/projects/aca-content/src/lib/components/sidenav/sidenav.component.html
index b9ff2c612d..2b9ee9bdd5 100644
--- a/projects/aca-content/src/lib/components/sidenav/sidenav.component.html
+++ b/projects/aca-content/src/lib/components/sidenav/sidenav.component.html
@@ -3,7 +3,7 @@
 
     <div class="aca-sidenav__section">
       <div *ngFor="let group of groups; trackBy: trackByGroupId" class="aca-sidenav__section__actions">
-          <mat-list-item *ngFor="let item of group.items; trackBy: trackByLinkId">
+          <mat-list-item class="aca-sidenav__section__actions__item" *ngFor="let item of group.items; trackBy: trackByLinkId">
             <ng-container *ngIf="!item.component">
               <app-expand-menu [item]="item"></app-expand-menu>
             </ng-container>
diff --git a/projects/aca-content/src/lib/components/sidenav/sidenav.component.scss b/projects/aca-content/src/lib/components/sidenav/sidenav.component.scss
index 56a70eeefb..ae0a53254d 100644
--- a/projects/aca-content/src/lib/components/sidenav/sidenav.component.scss
+++ b/projects/aca-content/src/lib/components/sidenav/sidenav.component.scss
@@ -96,11 +96,13 @@
     }
 
     .aca-action-button {
+      cursor: pointer;
       color: var(--theme-action-button-text-color);
       height: 32px;
       padding: 0 24px;
       border-radius: 0;
       line-height: 32px;
+      justify-content: start;
 
       &--active {
         color: var(--theme-sidenav-active-text-color);
@@ -113,8 +115,18 @@
       width: 100%;
     }
 
-    &__actions:last-child {
-      border-bottom: 0;
+    &__actions {
+      &__item:has(span) {
+        padding: 0;
+
+        span {
+          pointer-events: auto;
+        }
+      }
+
+      &:last-child {
+        border-bottom: 0;
+      }
     }
   }
 }
diff --git a/projects/aca-content/src/lib/ui/overrides/ay11.scss b/projects/aca-content/src/lib/ui/overrides/ay11.scss
index c23dbc1376..d36173d400 100644
--- a/projects/aca-content/src/lib/ui/overrides/ay11.scss
+++ b/projects/aca-content/src/lib/ui/overrides/ay11.scss
@@ -8,7 +8,7 @@
       @include rounded-outline;
     }
 
-    .mat-ripple {
+    .mat-ripple, .mdc-icon-button__ripple {
       display: none;
     }
 
diff --git a/projects/aca-content/src/lib/ui/theme.scss b/projects/aca-content/src/lib/ui/theme.scss
index 33840c63f9..1e0212306d 100644
--- a/projects/aca-content/src/lib/ui/theme.scss
+++ b/projects/aca-content/src/lib/ui/theme.scss
@@ -10,6 +10,10 @@ mat-toolbar {
   color: var(--theme-text-color, rgba(0, 0, 0, 0.54));
 }
 
+mat-icon {
+  vertical-align: middle;
+}
+
 .adf-name-location-cell-location.adf-datatable-cell-value {
   color: var(--theme-secondary-text);
 }
@@ -22,6 +26,18 @@ mat-toolbar {
   }
 }
 
+.mat-mdc-button:is(button),
+.mat-mdc-icon-button:is(button),
+.mat-mdc-icon-button.mat-mdc-button-base:is(button) {
+  padding: 0;
+  height: 40px;
+  width: 40px;
+
+  .mat-mdc-button-touch-target {
+    display: none;
+  }
+}
+
 .mdc-floating-label,
 .mat-mdc-tab-list .mat-mdc-tab-labels .mdc-tab,
 .mat-mdc-checkbox label,