From 8565461e3dc28e17589f3c79947485e5f4a7752a Mon Sep 17 00:00:00 2001
From: dominikiwanekhyland
 <141320833+dominikiwanekhyland@users.noreply.github.com>
Date: Fri, 7 Jun 2024 10:31:53 +0200
Subject: [PATCH] [ACS-8092] [ACA] testing angular 15 notifications bell is
 much smaller and is further from the profile page 2 (#9786)

---
 .../notification-history.component.html       |  6 ++++--
 .../notification-history.component.scss       | 20 ++++++++++++++++++-
 lib/core/src/lib/styles/_mat-selectors.scss   |  2 ++
 3 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/lib/core/src/lib/notifications/components/notification-history.component.html b/lib/core/src/lib/notifications/components/notification-history.component.html
index a762f10612d..34c029864fa 100644
--- a/lib/core/src/lib/notifications/components/notification-history.component.html
+++ b/lib/core/src/lib/notifications/components/notification-history.component.html
@@ -8,6 +8,7 @@
             (menuOpened)="onMenuOpened()">
         <mat-icon matBadge="&#8288;"
                   [matBadgeHidden]="!notifications.length"
+                  class="adf-notification-history-menu_button-icon"
                   matBadgeColor="accent"
                   matBadgeSize="small">notifications
         </mat-icon>
@@ -16,16 +17,17 @@
               [xPosition]="menuPositionX"
               [yPosition]="menuPositionY"
               id="adf-notification-history-menu"
-              class="adf-notification-history-menu">
+              class="adf-notification-history-menu adf-notification-history-menu-panel">
         <div class="adf-notification-history-list"
              role="button"
              tabindex="0"
              (keyup.enter)="$event.stopPropagation()"
              (click)="$event.stopPropagation()">
             <div mat-subheader role="menuitem">
-                <span>{{ 'NOTIFICATIONS.TITLE' | translate }}</span>
+                <span class="adf-notification-history-menu-title">{{ 'NOTIFICATIONS.TITLE' | translate }}</span>
                 <button *ngIf="notifications.length"
                         id="adf-notification-history-mark-as-read"
+                        class="adf-notification-history-mark-as-read"
                         mat-icon-button
                         title="{{ 'NOTIFICATIONS.MARK_AS_READ' | translate }}"
                         (click)="markAsRead()">
diff --git a/lib/core/src/lib/notifications/components/notification-history.component.scss b/lib/core/src/lib/notifications/components/notification-history.component.scss
index 0bff6da6f98..f5a9e792fa9 100644
--- a/lib/core/src/lib/notifications/components/notification-history.component.scss
+++ b/lib/core/src/lib/notifications/components/notification-history.component.scss
@@ -36,10 +36,10 @@ $notification-item-height: 72px;
 
     &-notification-history-menu-title {
         font-size: 14px;
+        -webkit-font-smoothing: subpixel-antialiased;
     }
 
     &-notification-history-menu_button#{$mat-button} {
-        margin-right: 10px;
         border-radius: 90%;
         padding: 0;
         min-width: 40px;
@@ -83,6 +83,7 @@ $notification-item-height: 72px;
             font-size: 16px;
             color: var(--theme-sidenav-user-menu-color);
             margin-bottom: 0;
+            -webkit-font-smoothing: subpixel-antialiased;
         }
 
         .adf-notification-history-menu-date.adf-notification-history-menu-text:is(p) {
@@ -118,6 +119,10 @@ $notification-item-height: 72px;
             width: 100%;
         }
     }
+
+    &-notification-history-mark-as-read {
+        margin: 4px 0;
+    }
 }
 
 #{$mat-menu-panel}.adf-notification-history-menu.adf-notification-history-menu-panel {
@@ -126,5 +131,18 @@ $notification-item-height: 72px;
 
     #{$mat-menu-content} {
         padding: 0;
+
+        #{$mat-list} {
+            padding: 8px 0 0;
+
+            #{$mat-list-item-unscoped-content} {
+                display: flex;
+            }
+
+            #{$mat-list-item-content} {
+                display: flex;
+                align-items: center;
+            }
+        }
     }
 }
diff --git a/lib/core/src/lib/styles/_mat-selectors.scss b/lib/core/src/lib/styles/_mat-selectors.scss
index 67bc9630122..6415cf4c6eb 100644
--- a/lib/core/src/lib/styles/_mat-selectors.scss
+++ b/lib/core/src/lib/styles/_mat-selectors.scss
@@ -95,6 +95,8 @@ $mat-calendar-table-header: '.mat-calendar-table-header';
 $mat-calendar-body-disabled: '.mat-calendar-body-disabled';
 $mat-toolbar: '.mat-toolbar';
 $mat-slide-toggle: '.mat-mdc-slide-toggle';
+$mat-list: '.mat-mdc-list';
+$mat-list-item-content: '.mdc-list-item__content';
 $mat-list-item-unscoped-content: '.mat-mdc-list-item-unscoped-content';
 $mat-text-field--no-label: '.mdc-text-field--no-label';
 $mat-form-field-infix: '.mat-mdc-form-field-infix';