From a80fc1665ebda66fae29f095447901d92fb66633 Mon Sep 17 00:00:00 2001
From: Juraj Roka <95219754+jr-rk@users.noreply.github.com>
Date: Mon, 8 Sep 2025 16:02:46 +0200
Subject: [PATCH 1/4] Making admin sidebar submenu items clickable as block

---
 .../expandable-admin-sidebar-section.component.html         | 2 +-
 .../expandable-admin-sidebar-section.component.scss         | 2 +-
 .../shared/menu/menu-item/onclick-menu-item.component.html  | 2 +-
 .../shared/menu/menu-item/onclick-menu-item.component.scss  | 6 ++++--
 4 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.html b/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.html
index 636938b7b6e..e3ebab1a959 100644
--- a/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.html
+++ b/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.html
@@ -34,7 +34,7 @@
     <div class="sidebar-collapsible-element-outer-wrapper">
       <div class="sidebar-collapsible-element-inner-wrapper">
         <div class="sidebar-sub-level-item-list" role="menu" [id]="adminMenuSectionId(section.id)" [attr.aria-label]="('menu.section.' + section.id) | translate">
-          <div class="sidebar-item" *ngFor="let subSection of (subSections$ | async)">
+          <div *ngFor="let subSection of (subSections$ | async)">
             {{ (sectionMap$ | async).get(subSection.id).component | json}}
             <ng-container
               *ngComponentOutlet="(sectionMap$ | async).get(subSection.id).component; injector: (sectionMap$ | async).get(subSection.id).injector;"></ng-container>
diff --git a/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.scss b/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.scss
index 845ba734df6..e09696bdc67 100644
--- a/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.scss
+++ b/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.scss
@@ -4,7 +4,7 @@
     margin: 0;
     padding: 0;
     ::ng-deep .ds-menu-item {
-      margin-left: var(--ds-admin-sidebar-section-indent);
+      padding-left: var(--ds-admin-sidebar-section-indent);
     }
   }
 
diff --git a/src/app/shared/menu/menu-item/onclick-menu-item.component.html b/src/app/shared/menu/menu-item/onclick-menu-item.component.html
index b8ee6ebe176..e9cce7f2c69 100644
--- a/src/app/shared/menu/menu-item/onclick-menu-item.component.html
+++ b/src/app/shared/menu/menu-item/onclick-menu-item.component.html
@@ -1,5 +1,5 @@
 <a *ngIf="!item.disabled"
-   class="ds-menu-item" role="menuitem"
+   class="ds-menu-item sidebar-item" role="menuitem"
    routerLinkActive="active"
    href="javascript:void(0);"
    [title]="item.text | translate"
diff --git a/src/app/shared/menu/menu-item/onclick-menu-item.component.scss b/src/app/shared/menu/menu-item/onclick-menu-item.component.scss
index adb670aa6f8..d7cdb17c08b 100644
--- a/src/app/shared/menu/menu-item/onclick-menu-item.component.scss
+++ b/src/app/shared/menu/menu-item/onclick-menu-item.component.scss
@@ -1,3 +1,5 @@
-a {
+.ds-menu-item {
     cursor: pointer;
-}
\ No newline at end of file
+    display: block;
+    width: 100%;
+}

From a59a9d6b35ab1e0c6624c8cdb7e94de0231d2739 Mon Sep 17 00:00:00 2001
From: Juraj Roka <95219754+jr-rk@users.noreply.github.com>
Date: Tue, 9 Sep 2025 10:26:22 +0200
Subject: [PATCH 2/4] Added style for expandable-admin-sidebar-section to
 sidebar-sub-level-item-list's childs

---
 ...dable-admin-sidebar-section.component.html |  2 +-
 ...dable-admin-sidebar-section.component.scss | 26 +++++++++++++++++--
 .../onclick-menu-item.component.html          |  2 +-
 .../onclick-menu-item.component.scss          |  4 +--
 4 files changed, 27 insertions(+), 7 deletions(-)

diff --git a/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.html b/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.html
index e3ebab1a959..636938b7b6e 100644
--- a/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.html
+++ b/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.html
@@ -34,7 +34,7 @@
     <div class="sidebar-collapsible-element-outer-wrapper">
       <div class="sidebar-collapsible-element-inner-wrapper">
         <div class="sidebar-sub-level-item-list" role="menu" [id]="adminMenuSectionId(section.id)" [attr.aria-label]="('menu.section.' + section.id) | translate">
-          <div *ngFor="let subSection of (subSections$ | async)">
+          <div class="sidebar-item" *ngFor="let subSection of (subSections$ | async)">
             {{ (sectionMap$ | async).get(subSection.id).component | json}}
             <ng-container
               *ngComponentOutlet="(sectionMap$ | async).get(subSection.id).component; injector: (sectionMap$ | async).get(subSection.id).injector;"></ng-container>
diff --git a/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.scss b/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.scss
index e09696bdc67..548618183f7 100644
--- a/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.scss
+++ b/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.scss
@@ -3,8 +3,30 @@
     list-style: none;
     margin: 0;
     padding: 0;
-    ::ng-deep .ds-menu-item {
-      padding-left: var(--ds-admin-sidebar-section-indent);
+    /* Make the entire sub-level row clickable by applying padding to the anchor */
+    ::ng-deep {
+      /* Ensure anchors are full-width blocks */
+      .ds-menu-item {
+        display: block;
+        width: 100%;
+        padding-left: var(--ds-admin-sidebar-section-indent);
+      }
+
+      /* Remove vertical padding from the wrapper and apply it to the anchor */
+      .sidebar-item {
+        padding-top: 0 !important;
+        padding-bottom: 0 !important;
+      }
+      .sidebar-item .ds-menu-item {
+        padding-top: var(--ds-admin-sidebar-item-padding);
+        padding-bottom: var(--ds-admin-sidebar-item-padding);
+      }
+
+      /* In case an anchor also has .sidebar-item, reset it to avoid double padding */
+      .ds-menu-item.sidebar-item {
+        padding-top: 0 !important;
+        padding-bottom: 0 !important;
+      }
     }
   }
 
diff --git a/src/app/shared/menu/menu-item/onclick-menu-item.component.html b/src/app/shared/menu/menu-item/onclick-menu-item.component.html
index e9cce7f2c69..b8ee6ebe176 100644
--- a/src/app/shared/menu/menu-item/onclick-menu-item.component.html
+++ b/src/app/shared/menu/menu-item/onclick-menu-item.component.html
@@ -1,5 +1,5 @@
 <a *ngIf="!item.disabled"
-   class="ds-menu-item sidebar-item" role="menuitem"
+   class="ds-menu-item" role="menuitem"
    routerLinkActive="active"
    href="javascript:void(0);"
    [title]="item.text | translate"
diff --git a/src/app/shared/menu/menu-item/onclick-menu-item.component.scss b/src/app/shared/menu/menu-item/onclick-menu-item.component.scss
index d7cdb17c08b..903e9bfdb37 100644
--- a/src/app/shared/menu/menu-item/onclick-menu-item.component.scss
+++ b/src/app/shared/menu/menu-item/onclick-menu-item.component.scss
@@ -1,5 +1,3 @@
-.ds-menu-item {
+a {
     cursor: pointer;
-    display: block;
-    width: 100%;
 }

From 4ae5af621bade16e2d8dd447d381f6ba02ebbd5e Mon Sep 17 00:00:00 2001
From: Juraj Roka <95219754+jr-rk@users.noreply.github.com>
Date: Tue, 9 Sep 2025 11:35:08 +0200
Subject: [PATCH 3/4] Copilot suggestion refactoring - removed the !important
 keywords

---
 .../admin/admin-sidebar/admin-sidebar.component.scss  |  9 +++++++++
 .../expandable-admin-sidebar-section.component.scss   | 11 -----------
 2 files changed, 9 insertions(+), 11 deletions(-)

diff --git a/src/app/admin/admin-sidebar/admin-sidebar.component.scss b/src/app/admin/admin-sidebar/admin-sidebar.component.scss
index d3607ca625a..e89cfcebf1a 100644
--- a/src/app/admin/admin-sidebar/admin-sidebar.component.scss
+++ b/src/app/admin/admin-sidebar/admin-sidebar.component.scss
@@ -56,6 +56,15 @@
         padding-bottom: var(--ds-admin-sidebar-item-padding);
       }
 
+      // Remove vertical padding from the wrapper and apply it to the anchor
+      // In case an anchor also has .sidebar-item, reset it to avoid double padding
+      .sidebar-sub-level-item-list {
+        .sidebar-item,  .ds-menu-item.sidebar-item {
+          padding-top: 0;
+          padding-bottom: 0;
+        }
+      }
+
       // These classes handle the collapsing behavior
       .sidebar-section-wrapper {
 
diff --git a/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.scss b/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.scss
index 548618183f7..5aae07485b4 100644
--- a/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.scss
+++ b/src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.scss
@@ -12,21 +12,10 @@
         padding-left: var(--ds-admin-sidebar-section-indent);
       }
 
-      /* Remove vertical padding from the wrapper and apply it to the anchor */
-      .sidebar-item {
-        padding-top: 0 !important;
-        padding-bottom: 0 !important;
-      }
       .sidebar-item .ds-menu-item {
         padding-top: var(--ds-admin-sidebar-item-padding);
         padding-bottom: var(--ds-admin-sidebar-item-padding);
       }
-
-      /* In case an anchor also has .sidebar-item, reset it to avoid double padding */
-      .ds-menu-item.sidebar-item {
-        padding-top: 0 !important;
-        padding-bottom: 0 !important;
-      }
     }
   }
 

From 11c4e24d58488adcbf9f6a227433a9a18956aed1 Mon Sep 17 00:00:00 2001
From: Juraj Roka <95219754+jr-rk@users.noreply.github.com>
Date: Tue, 9 Sep 2025 12:19:50 +0200
Subject: [PATCH 4/4] removed whitespace

---
 src/app/admin/admin-sidebar/admin-sidebar.component.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/admin/admin-sidebar/admin-sidebar.component.scss b/src/app/admin/admin-sidebar/admin-sidebar.component.scss
index e89cfcebf1a..4d4c302f089 100644
--- a/src/app/admin/admin-sidebar/admin-sidebar.component.scss
+++ b/src/app/admin/admin-sidebar/admin-sidebar.component.scss
@@ -59,7 +59,7 @@
       // Remove vertical padding from the wrapper and apply it to the anchor
       // In case an anchor also has .sidebar-item, reset it to avoid double padding
       .sidebar-sub-level-item-list {
-        .sidebar-item,  .ds-menu-item.sidebar-item {
+        .sidebar-item, .ds-menu-item.sidebar-item {
           padding-top: 0;
           padding-bottom: 0;
         }