From 01802f6ae585a43893022049c40fdb7d000a89c6 Mon Sep 17 00:00:00 2001 From: Shashiranjan singh Date: Wed, 11 Mar 2026 18:35:07 +0000 Subject: [PATCH] dashboard: align 'no notifications available' icon in notifications page The icon displayed when there are no notifications available in the notifications page was slightly misaligned with the message text. This change adjusts the layout to properly align the icon with the message using flexbox and removes unnecessary spacing. Fixes: https://tracker.ceph.com/issues/74598 Signed-off-by: Shashiranjan Singh Signed-off-by: Shashiranjan singh --- .../notifications-page/notifications-page.component.scss | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/notification-panel/notifications-page/notifications-page.component.scss b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/notification-panel/notifications-page/notifications-page.component.scss index 2cd8e7112773..c3f066ba42b2 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/notification-panel/notifications-page/notifications-page.component.scss +++ b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/notification-panel/notifications-page/notifications-page.component.scss @@ -51,12 +51,14 @@ // Empty state .empty-state { - text-align: center; + display: flex; + align-items: center; + justify-content: center; color: var(--cds-text-secondary); margin-top: var(--cds-spacing-05); p { - margin: var(--cds-spacing-03) 0 0 0; + margin: 0; font-size: var(--cds-body-01-font-size); line-height: var(--cds-body-01-line-height); } @@ -133,6 +135,9 @@ .empty-icon, .no-selection-icon { fill: var(--cds-icon-secondary); +} + +.no-selection-icon { margin-bottom: var(--cds-spacing-05); } -- 2.47.3