From cdaa30d63809e4e7c726fca660568b4ce6f72fd1 Mon Sep 17 00:00:00 2001
From: swapnamol-abraham <swapnamol.abraham@nhs.net>
Date: Thu, 18 Sep 2025 14:36:36 +0100
Subject: [PATCH 1/2] TD-6230: SIT Defects-Recent Learning Page-2

---
 .../Controllers/HomeController.cs             |  2 +-
 .../Styles/layout/_layout.scss                |  6 ++
 .../Styles/nhsuk/pages/dashboard.scss         |  6 ++
 .../Views/Catalogue/AllCatalogue.cshtml       |  2 +-
 .../Views/Catalogue/AllCatalogueSearch.cshtml |  2 +-
 .../Views/Catalogue/Catalogues.cshtml         |  2 +-
 .../Views/Home/_CertificateCard.cshtml        |  4 +-
 .../Views/Home/_LearningActivityCard.cshtml   |  4 +-
 .../Views/Home/_MyCoursesAndElearning.cshtml  | 56 ++++++++++++-------
 .../Views/Home/_ResourceCard.cshtml           |  2 +-
 .../Views/Home/_ResourceTray.cshtml           | 10 +++-
 .../Resources/ResourceVersionRepository.cs    |  6 --
 12 files changed, 65 insertions(+), 37 deletions(-)

diff --git a/LearningHub.Nhs.WebUI/Controllers/HomeController.cs b/LearningHub.Nhs.WebUI/Controllers/HomeController.cs
index a23e986e0..5f4540b57 100644
--- a/LearningHub.Nhs.WebUI/Controllers/HomeController.cs
+++ b/LearningHub.Nhs.WebUI/Controllers/HomeController.cs
@@ -208,7 +208,7 @@ public IActionResult HomepageWithAuthentication()
         /// <param name="resourceDashboard">The resource dashboard type.</param>
         /// <param name="catalogueDashboard">The catalogue dashboard type.</param>
         /// <returns>Home page.</returns>
-        public async Task<IActionResult> Index(string dashboardTrayLearningResourceType = "all", string myLearningDashboard = "my-in-progress", string resourceDashboard = "popular-resources", string catalogueDashboard = "popular-catalogues")
+        public async Task<IActionResult> Index(string dashboardTrayLearningResourceType = "all", string myLearningDashboard = "my-in-progress", string resourceDashboard = "my-recent-completed", string catalogueDashboard = "popular-catalogues")
         {
             if (this.User?.Identity.IsAuthenticated == true)
             {
diff --git a/LearningHub.Nhs.WebUI/Styles/layout/_layout.scss b/LearningHub.Nhs.WebUI/Styles/layout/_layout.scss
index bbacdc52d..c2ef190b0 100644
--- a/LearningHub.Nhs.WebUI/Styles/layout/_layout.scss
+++ b/LearningHub.Nhs.WebUI/Styles/layout/_layout.scss
@@ -320,6 +320,12 @@ input:required:invalid, input:focus:invalid {
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
 }
+.line-clamp-5 {
+    display: -webkit-box !important;
+    overflow: hidden;
+    -webkit-line-clamp: 5;
+    -webkit-box-orient: vertical;
+}
 .search-box-container {
     display: flex;
     flex-direction: row;
diff --git a/LearningHub.Nhs.WebUI/Styles/nhsuk/pages/dashboard.scss b/LearningHub.Nhs.WebUI/Styles/nhsuk/pages/dashboard.scss
index 6dde76f58..ba1ce9f28 100644
--- a/LearningHub.Nhs.WebUI/Styles/nhsuk/pages/dashboard.scss
+++ b/LearningHub.Nhs.WebUI/Styles/nhsuk/pages/dashboard.scss
@@ -47,6 +47,12 @@
     }
 }
 
+.course-card {
+    border: 1px solid #1C366A; 
+    border-radius: 8px; 
+    box-shadow: 2px 2px 0 #1C366A;
+}
+
 .dashboard-card-content {
     display: flex;
     flex-direction: column;
diff --git a/LearningHub.Nhs.WebUI/Views/Catalogue/AllCatalogue.cshtml b/LearningHub.Nhs.WebUI/Views/Catalogue/AllCatalogue.cshtml
index 88e11b91b..700138dda 100644
--- a/LearningHub.Nhs.WebUI/Views/Catalogue/AllCatalogue.cshtml
+++ b/LearningHub.Nhs.WebUI/Views/Catalogue/AllCatalogue.cshtml
@@ -79,7 +79,7 @@
                     <div class="nhsuk-card__content catalogue-card-content">
 
                         <h3 class="nhsuk-card__heading nhsuk-heading-m">
-                            <a class="nhsuk-card__link line-clamp-2" asp-controller="Catalogue" asp-action="Index" asp-route-reference="@item.Url">@item.Name</a>
+                            <a class="nhsuk-card__link line-clamp-5" asp-controller="Catalogue" asp-action="Index" asp-route-reference="@item.Url">@item.Name</a>
                         </h3>
 
                         <div class="nhsuk-card__description catalogue-card-body">
diff --git a/LearningHub.Nhs.WebUI/Views/Catalogue/AllCatalogueSearch.cshtml b/LearningHub.Nhs.WebUI/Views/Catalogue/AllCatalogueSearch.cshtml
index 379cffa64..41d02c3e8 100644
--- a/LearningHub.Nhs.WebUI/Views/Catalogue/AllCatalogueSearch.cshtml
+++ b/LearningHub.Nhs.WebUI/Views/Catalogue/AllCatalogueSearch.cshtml
@@ -65,7 +65,7 @@
                     <div class="nhsuk-card__content catalogue-card-content">
 
                         <h3 class="nhsuk-card__heading nhsuk-heading-m">
-                            <a class="nhsuk-card__link line-clamp-2" asp-controller="Catalogue" asp-action="Index" asp-route-reference="@item.Url">@item.Name</a>
+                            <a class="nhsuk-card__link line-clamp-5" asp-controller="Catalogue" asp-action="Index" asp-route-reference="@item.Url">@item.Name</a>
                         </h3>
 
                         <div class="nhsuk-card__description catalogue-card-body">
diff --git a/LearningHub.Nhs.WebUI/Views/Catalogue/Catalogues.cshtml b/LearningHub.Nhs.WebUI/Views/Catalogue/Catalogues.cshtml
index 486a6b624..a5b5b6acd 100644
--- a/LearningHub.Nhs.WebUI/Views/Catalogue/Catalogues.cshtml
+++ b/LearningHub.Nhs.WebUI/Views/Catalogue/Catalogues.cshtml
@@ -76,7 +76,7 @@
                     <div class="nhsuk-card__content catalogue-card-content">
 
                         <h3 class="nhsuk-card__heading nhsuk-heading-m">
-                            <a class="nhsuk-card__link line-clamp-2" href="@GetCatalogueUrl(item.Url, item.ClickPayload, item.NodeId)">@item.Name</a>
+                            <a class="nhsuk-card__link line-clamp-5" href="@GetCatalogueUrl(item.Url, item.ClickPayload, item.NodeId)">@item.Name</a>
                         </h3>
 
                         <div class="nhsuk-card__description catalogue-card-body">
diff --git a/LearningHub.Nhs.WebUI/Views/Home/_CertificateCard.cshtml b/LearningHub.Nhs.WebUI/Views/Home/_CertificateCard.cshtml
index b2716efb4..485eb1af4 100644
--- a/LearningHub.Nhs.WebUI/Views/Home/_CertificateCard.cshtml
+++ b/LearningHub.Nhs.WebUI/Views/Home/_CertificateCard.cshtml
@@ -42,10 +42,10 @@
            }
        );
 }
-<div class="nhsuk-card dashboard-card">
+<div class="nhsuk-card dashboard-card @((ResourceTypeEnum)Model.Item2.ResourceTypeId == ResourceTypeEnum.Moodle ? "course-card" : string.Empty)">
     <div class="nhsuk-card__content dashboard-card-content">
         <div>
-            <h3 class="nhsuk-card__heading nhsuk-heading-m line-clamp-2">
+            <h3 class="nhsuk-card__heading nhsuk-heading-m line-clamp-5">
 
                 @if ((ResourceTypeEnum)Model.Item2.ResourceTypeId == ResourceTypeEnum.Moodle)
                 {
diff --git a/LearningHub.Nhs.WebUI/Views/Home/_LearningActivityCard.cshtml b/LearningHub.Nhs.WebUI/Views/Home/_LearningActivityCard.cshtml
index 03d76d2b8..799c4169d 100644
--- a/LearningHub.Nhs.WebUI/Views/Home/_LearningActivityCard.cshtml
+++ b/LearningHub.Nhs.WebUI/Views/Home/_LearningActivityCard.cshtml
@@ -22,10 +22,10 @@
         return moodleApiService.GetCourseUrl(courseId);
     }
 }
-<div class="nhsuk-card dashboard-card">
+<div class="nhsuk-card dashboard-card @(ViewActivityHelper.GetResourceTypeDesc(Model.Item2.ResourceType) == "Course" ? "course-card" : string.Empty)">
     <div class="nhsuk-card__content dashboard-card-content">
         <div>
-            <h3 class="nhsuk-card__heading nhsuk-heading-m line-clamp-2">
+            <h3 class="nhsuk-card__heading nhsuk-heading-m line-clamp-5">
 
                 @if (ViewActivityHelper.GetResourceTypeDesc(Model.Item2.ResourceType) == "Course")
                 {
diff --git a/LearningHub.Nhs.WebUI/Views/Home/_MyCoursesAndElearning.cshtml b/LearningHub.Nhs.WebUI/Views/Home/_MyCoursesAndElearning.cshtml
index 76dd1a61d..2a2c5e5ad 100644
--- a/LearningHub.Nhs.WebUI/Views/Home/_MyCoursesAndElearning.cshtml
+++ b/LearningHub.Nhs.WebUI/Views/Home/_MyCoursesAndElearning.cshtml
@@ -56,28 +56,44 @@
         </div>
     </nav>
 
-    <div class="nhsuk-u-padding-bottom-3">
-        <span class="nhsuk-u-padding-right-3 nhsuk-u-primary-text-color nhsuk-u-font-size-16 nhsuk-u-font-weight-bold">Show</span>
-
-        <a asp-action="Index" asp-route-dashboardTrayLearningResourceType="all" asp-route-myLearningDashboard=@Model.MyLearnings.Type asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning"
-           class="nhsuk-u-padding-right-3 nhsuk-u-secondary-text-color nhsuk-u-font-size-16 nhsuk-u-font-weight-bold nhsuk-u-text-align-centre @(Model.DashboardTrayLearningResourceType == "all" ? "active" : string.Empty)"
-           title="All">
-            <span class="nhsuk-bg-pale-blue">All</span>
-        </a>
-
-        <a asp-action="Index" asp-route-dashboardTrayLearningResourceType="courses" asp-route-myLearningDashboard=@Model.MyLearnings.Type asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning"
-           class="subnavwhite-link text-nowrap nhsuk-u-padding-right-3 nhsuk-u-secondary-text-color nhsuk-u-font-size-16 nhsuk-u-font-weight-bold @(Model.DashboardTrayLearningResourceType == "courses" ? "active" : string.Empty)"
-           title="In progress">
-            Courses
-        </a>
+    <nav class="subnavbarwhite nhsuk-bg-grey navbar-expand-md nhsuk-u-margin-bottom-5">
+        <input class="subnav-hidden-checkbox" id="mylearning-subnav-hidden-checkbox" role="button" type="checkbox" aria-controls="collapsingMyLearningNestedSubNavbar" aria-labelledby="mylearning-subnav-hidden-checkbox-label">
+        <div class="bar">
+            <div class="navbar-toggler navbar-toggler-left nhsuk-u-font-size-19">@GetActiveTabName()</div>
+            <label class="navbar-toggler navbar-toggler-right" id="mylearning-subnav-hidden-checkbox-label" for="mylearning-subnav-hidden-checkbox">
+                <i class="fa-solid fa-chevron-down"><span class="nhsuk-u-visually-hidden">Show Resource Options</span></i>
+                <i class="fa-solid fa-chevron-up display--hide"><span class="nhsuk-u-visually-hidden">Hide Resource Options</span></i>
+            </label>
+        </div>
+        <div class="navbar-collapse collapse nhsuk-bg-grey" id="collapsingMyLearningNestedSubNavbar">
+            <ul class="navbar-nav">
+                <li><span class="nhsuk-u-padding-right-3 nhsuk-u-primary-text-color nhsuk-u-font-size-16 nhsuk-u-font-weight-bold">Show</span></li>
 
-        <a asp-action="Index" asp-route-dashboardTrayLearningResourceType="elearning" asp-route-myLearningDashboard=@Model.MyLearnings.Type asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning"
-           class="subnavwhite-link text-nowrap nhsuk-u-padding-right-3  nhsuk-u-secondary-text-color nhsuk-u-font-size-16 nhsuk-u-font-weight-bold @(Model.DashboardTrayLearningResourceType == "elearning" ? "active" : string.Empty)"
-           title="Completed">
-            Elearning
-        </a>
+                <li class="subnavwhite-item nhsuk-bg-grey @(Model.DashboardTrayLearningResourceType == "all" ? "active" : string.Empty)">
+                    <a asp-action="Index" tabindex="0" asp-route-dashboardTrayLearningResourceType="all" asp-route-myLearningDashboard=@Model.MyLearnings.Type asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning"
+                       class="subnavwhite-link text-nowrap"
+                       title="All">
+                        All
+                    </a>
+                </li>
 
-    </div>
+                <li class="subnavwhite-item nhsuk-bg-grey @(Model.DashboardTrayLearningResourceType == "courses" ? "active" : string.Empty)">
+                    <a asp-action="Index" asp-route-dashboardTrayLearningResourceType="courses" asp-route-myLearningDashboard=@Model.MyLearnings.Type asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning"
+                       class="subnavwhite-link text-nowrap ondary-text-color"
+                       title="Courses">
+                        Courses
+                    </a>
+                </li>
+                <li class="subnavwhite-item nhsuk-bg-grey @(Model.DashboardTrayLearningResourceType == "elearning" ? "active" : string.Empty)">
+                    <a asp-action="Index" asp-route-dashboardTrayLearningResourceType="elearning" asp-route-myLearningDashboard=@Model.MyLearnings.Type asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning"
+                       class="subnavwhite-link text-nowrap nhsuk-u-padding-right-3"
+                       title="Elearning">
+                        Elearning
+                    </a>
+                </li>
+            </ul>
+        </div>
+    </nav>
     <div class="nhsuk-grid-row nhsuk-u-margin-bottom-2">
         <div class="nhsuk-grid-column-full">
             @if (Model.MyLearnings.Type == "my-in-progress" && Model.MyLearnings.Activities?.Count() > 0)
diff --git a/LearningHub.Nhs.WebUI/Views/Home/_ResourceCard.cshtml b/LearningHub.Nhs.WebUI/Views/Home/_ResourceCard.cshtml
index 0e87cf85c..48f6cacfc 100644
--- a/LearningHub.Nhs.WebUI/Views/Home/_ResourceCard.cshtml
+++ b/LearningHub.Nhs.WebUI/Views/Home/_ResourceCard.cshtml
@@ -16,7 +16,7 @@
 <div class="nhsuk-card dashboard-card">
   <div class="nhsuk-card__content dashboard-card-content">
     <div>
-      <h3 class="nhsuk-card__heading nhsuk-heading-m line-clamp-2">
+      <h3 class="nhsuk-card__heading nhsuk-heading-m line-clamp-5">
         <a class="nhsuk-card__link" asp-controller="Dashboard" asp-action="RecordDashboardNavigation" asp-route-eventType="@EventTypeEnum.DashBoardResourceView"
            asp-route-url="@("/Resource/" + Model.Item2.ResourceReferenceId)" asp-route-resourceReference="@Model.Item2.ResourceReferenceId">@UtilityHelper.StripHtmlFromString(Model.Item2.Title)</a>
       </h3>
diff --git a/LearningHub.Nhs.WebUI/Views/Home/_ResourceTray.cshtml b/LearningHub.Nhs.WebUI/Views/Home/_ResourceTray.cshtml
index 756908897..4a48a59ae 100644
--- a/LearningHub.Nhs.WebUI/Views/Home/_ResourceTray.cshtml
+++ b/LearningHub.Nhs.WebUI/Views/Home/_ResourceTray.cshtml
@@ -10,10 +10,12 @@
             case "rated-resources":
                 return "Highly rated";
             case "recent-resources":
-                return "Recently added";
+                return "Recently added";                
             case "popular-resources":
-            default:
                 return "Most accessed";
+            case "my-recent-completed":
+            default:
+                return "Recently Completed";
         }
     }
     var pagingViewModel = new DashBoardPagingViewModel
@@ -43,6 +45,10 @@
         </div>
         <div class="navbar-collapse collapse" id="collapsingResourcesSubNavbar">
             <ul class="navbar-nav">
+                <li class="subnavwhite-item @(Model.Resources.Type == "my-recent-completed" ? "active" : string.Empty)">
+                    <a tabindex="0" class="subnavwhite-link text-nowrap"
+                       asp-controller="Home" asp-action="Index" asp-route-myLearningDashboard="@(Model.MyLearnings.Type)" asp-route-resourceDashboard="my-recent-completed" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="resources">Recently Completed</a>
+                </li>
                 <li class="subnavwhite-item @(Model.Resources.Type == "rated-resources" ? "active" : string.Empty)">
                     <a tabindex="0" class="subnavwhite-link text-nowrap"
                        asp-controller="Home" asp-action="Index" asp-route-myLearningDashboard="@(Model.MyLearnings.Type)" asp-route-resourceDashboard="rated-resources" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="resources">Highly rated</a>
diff --git a/OpenAPI/LearningHub.Nhs.OpenApi.Repositories/Repositories/Resources/ResourceVersionRepository.cs b/OpenAPI/LearningHub.Nhs.OpenApi.Repositories/Repositories/Resources/ResourceVersionRepository.cs
index ae0609d11..47d302e0c 100644
--- a/OpenAPI/LearningHub.Nhs.OpenApi.Repositories/Repositories/Resources/ResourceVersionRepository.cs
+++ b/OpenAPI/LearningHub.Nhs.OpenApi.Repositories/Repositories/Resources/ResourceVersionRepository.cs
@@ -731,15 +731,9 @@ public List<ResourceContributionDto> GetContributions(int userId, ResourceContri
             var dashboardResources = new List<DashboardResourceDto>();
             switch (dashboardType)
             {
-                ////case "my-certificates":
-                ////    dashboardResources = this.DbContext.DashboardResourceDto.FromSqlRaw("resources.GetMyLearningCertificatesDashboardResources @userId, @pageNumber, @totalRows output", param0, param1, param2).ToList();
-                ////    break;
                 case "my-recent-completed":
                     dashboardResources = this.DbContext.DashboardResourceDto.FromSqlRaw("resources.GetMyRecentCompletedDashboardResources @userId, @pageNumber, @totalRows output", param0, param1, param2).ToList();
                     break;
-                ////case "my-in-progress":
-                ////    dashboardResources = this.DbContext.DashboardResourceDto.FromSqlRaw("resources.GetMyInProgressDashboardResources @userId, @pageNumber, @totalRows output", param0, param1, param2).ToList();
-                //    break;
                 case "recent-resources":
                     dashboardResources = this.DbContext.DashboardResourceDto.FromSqlRaw("resources.GetRecentDashboardResources @userId, @pageNumber, @totalRows output", param0, param1, param2).ToList();
                     break;

From f08d4657671dc38ded9beb1b39b5f9ca1c6e639c Mon Sep 17 00:00:00 2001
From: swapnamol-abraham <swapnamol.abraham@nhs.net>
Date: Thu, 18 Sep 2025 20:27:41 +0100
Subject: [PATCH 2/2] TD-6230: Header menu style and pagination issue

---
 .../Styles/nhsuk/pages/dashboard.scss         | 27 +++++++
 .../Views/Home/Dashboard.cshtml               |  4 +-
 .../Views/Home/_CatalogueTray.cshtml          |  3 +-
 .../Views/Home/_MyCoursesAndElearning.cshtml  | 71 ++++++++-----------
 .../Views/Home/_ResourceTray.cshtml           | 17 ++---
 5 files changed, 68 insertions(+), 54 deletions(-)

diff --git a/LearningHub.Nhs.WebUI/Styles/nhsuk/pages/dashboard.scss b/LearningHub.Nhs.WebUI/Styles/nhsuk/pages/dashboard.scss
index ba1ce9f28..d2bec44ae 100644
--- a/LearningHub.Nhs.WebUI/Styles/nhsuk/pages/dashboard.scss
+++ b/LearningHub.Nhs.WebUI/Styles/nhsuk/pages/dashboard.scss
@@ -191,6 +191,33 @@ div.bmj-best-practice-logo-image {
     background-color: #f0f4f5;
 }
 
+.filterlink {
+    display: inline-block;
+    padding: 6px 12px;
+    font-weight: bold;
+    text-decoration: none;
+    border: 2px solid transparent;
+    border-radius: 4px;
+    font-family: sans-serif;
+}
+.filteractive {
+    color: $nhsuk-blue;
+    border-color: #0b63ce;
+    background-color: $nhsuk-pale-blue-color;
+}
+
+.filterinactive {
+    color: #6e6e6e; 
+    border-color: #c2c2c2; 
+    background-color: #f1f1f1; 
+    opacity: 0.7; 
+}
+
+filterfocus {
+    color: black;
+    background-color: #ffeb3b;
+    border-color: #212b32;
+}
 .dashboard-paging {
     width: 100%;
     display: flex;
diff --git a/LearningHub.Nhs.WebUI/Views/Home/Dashboard.cshtml b/LearningHub.Nhs.WebUI/Views/Home/Dashboard.cshtml
index 4acd0c8c7..59528c734 100644
--- a/LearningHub.Nhs.WebUI/Views/Home/Dashboard.cshtml
+++ b/LearningHub.Nhs.WebUI/Views/Home/Dashboard.cshtml
@@ -21,7 +21,7 @@
 }
 
 <div>
-	<div class="nhsuk-bg-grey">
+	<div class="nhsuk-bg-white">
 		<div class="text-center">
 			<picture>
 				<source media="(min-width: 1441px)" srcset="images\dashboard\hero\LH-dashboard-banner_2400x320.jpg" />
@@ -39,7 +39,7 @@
 		</div>
 	</div>
 
-	<div class="nhsuk-bg-white">
+	<div class="nhsuk-bg-grey">
 		<div class="nhsuk-width-container app-width-container">
 			<div id="resources">
 				<partial name="_ResourceTray" model="Model" />
diff --git a/LearningHub.Nhs.WebUI/Views/Home/_CatalogueTray.cshtml b/LearningHub.Nhs.WebUI/Views/Home/_CatalogueTray.cshtml
index fd8932610..dcdb35170 100644
--- a/LearningHub.Nhs.WebUI/Views/Home/_CatalogueTray.cshtml
+++ b/LearningHub.Nhs.WebUI/Views/Home/_CatalogueTray.cshtml
@@ -23,7 +23,8 @@
                 CatalogueDashboard = Model.Catalogues.Type,
                 CurrentPage = Model.Catalogues.CurrentPage,
                 TotalPages = Model.Catalogues.TotalPages,
-                TotalCount = Model.Catalogues.TotalCount
+                TotalCount = Model.Catalogues.TotalCount,
+                DashboardTrayLearningResourceType = Model.DashboardTrayLearningResourceType
             };
 }
 
diff --git a/LearningHub.Nhs.WebUI/Views/Home/_MyCoursesAndElearning.cshtml b/LearningHub.Nhs.WebUI/Views/Home/_MyCoursesAndElearning.cshtml
index 2a2c5e5ad..1fd3e413a 100644
--- a/LearningHub.Nhs.WebUI/Views/Home/_MyCoursesAndElearning.cshtml
+++ b/LearningHub.Nhs.WebUI/Views/Home/_MyCoursesAndElearning.cshtml
@@ -32,7 +32,7 @@
 <div class="dashboardTray">
     <h2>My courses and elearning</h2>
 
-    <nav class="subnavbarwhite nhsuk-bg-grey navbar-expand-md nhsuk-u-margin-bottom-5">
+    <nav class="subnavbarwhite nhsuk-bg-white  navbar-expand-md nhsuk-u-margin-bottom-5">
         <input class="subnav-hidden-checkbox" id="mylearning-subnav-hidden-checkbox" role="button" type="checkbox" aria-controls="collapsingMyLearningSubNavbar" aria-labelledby="mylearning-subnav-hidden-checkbox-label">
         <div class="bar">
             <div class="navbar-toggler navbar-toggler-left nhsuk-u-font-size-19">@GetActiveTabName()</div>
@@ -41,59 +41,44 @@
                 <i class="fa-solid fa-chevron-up display--hide"><span class="nhsuk-u-visually-hidden">Hide Resource Options</span></i>
             </label>
         </div>
-        <div class="navbar-collapse collapse nhsuk-bg-grey" id="collapsingMyLearningSubNavbar">
+        <div class="navbar-collapse collapse nhsuk-bg-white" id="collapsingMyLearningSubNavbar">
             <ul class="navbar-nav">
-                <li class="subnavwhite-item nhsuk-bg-grey @(Model.MyLearnings.Type == "my-in-progress" ? "active" : string.Empty)">
+                <li class="subnavwhite-item nhsuk-bg-white @(Model.MyLearnings.Type == "my-in-progress" ? "active" : string.Empty)">
                     <a tabindex="0" class="subnavwhite-link text-nowrap"
                        asp-controller="Home" asp-action="Index" asp-route-dashboardTrayLearningResourceType="all" asp-route-myLearningDashboard="my-in-progress" asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning">In Progress</a>
                 </li>
 
-                <li class="subnavwhite-item nhsuk-bg-grey @(Model.MyLearnings.Type == "my-certificates" ? "active" : string.Empty)">
+                <li class="subnavwhite-item nhsuk-bg-white @(Model.MyLearnings.Type == "my-certificates" ? "active" : string.Empty)">
                     <a tabindex="0" class="subnavwhite-link text-nowrap"
                        asp-controller="Home" asp-action="Index" asp-route-dashboardTrayLearningResourceType="all" asp-route-myLearningDashboard="my-certificates" asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning">Certificates</a>
                 </li>
             </ul>
         </div>
     </nav>
-
-    <nav class="subnavbarwhite nhsuk-bg-grey navbar-expand-md nhsuk-u-margin-bottom-5">
-        <input class="subnav-hidden-checkbox" id="mylearning-subnav-hidden-checkbox" role="button" type="checkbox" aria-controls="collapsingMyLearningNestedSubNavbar" aria-labelledby="mylearning-subnav-hidden-checkbox-label">
-        <div class="bar">
-            <div class="navbar-toggler navbar-toggler-left nhsuk-u-font-size-19">@GetActiveTabName()</div>
-            <label class="navbar-toggler navbar-toggler-right" id="mylearning-subnav-hidden-checkbox-label" for="mylearning-subnav-hidden-checkbox">
-                <i class="fa-solid fa-chevron-down"><span class="nhsuk-u-visually-hidden">Show Resource Options</span></i>
-                <i class="fa-solid fa-chevron-up display--hide"><span class="nhsuk-u-visually-hidden">Hide Resource Options</span></i>
-            </label>
-        </div>
-        <div class="navbar-collapse collapse nhsuk-bg-grey" id="collapsingMyLearningNestedSubNavbar">
-            <ul class="navbar-nav">
-                <li><span class="nhsuk-u-padding-right-3 nhsuk-u-primary-text-color nhsuk-u-font-size-16 nhsuk-u-font-weight-bold">Show</span></li>
-
-                <li class="subnavwhite-item nhsuk-bg-grey @(Model.DashboardTrayLearningResourceType == "all" ? "active" : string.Empty)">
-                    <a asp-action="Index" tabindex="0" asp-route-dashboardTrayLearningResourceType="all" asp-route-myLearningDashboard=@Model.MyLearnings.Type asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning"
-                       class="subnavwhite-link text-nowrap"
-                       title="All">
-                        All
-                    </a>
-                </li>
-
-                <li class="subnavwhite-item nhsuk-bg-grey @(Model.DashboardTrayLearningResourceType == "courses" ? "active" : string.Empty)">
-                    <a asp-action="Index" asp-route-dashboardTrayLearningResourceType="courses" asp-route-myLearningDashboard=@Model.MyLearnings.Type asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning"
-                       class="subnavwhite-link text-nowrap ondary-text-color"
-                       title="Courses">
-                        Courses
-                    </a>
-                </li>
-                <li class="subnavwhite-item nhsuk-bg-grey @(Model.DashboardTrayLearningResourceType == "elearning" ? "active" : string.Empty)">
-                    <a asp-action="Index" asp-route-dashboardTrayLearningResourceType="elearning" asp-route-myLearningDashboard=@Model.MyLearnings.Type asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning"
-                       class="subnavwhite-link text-nowrap nhsuk-u-padding-right-3"
-                       title="Elearning">
-                        Elearning
-                    </a>
-                </li>
-            </ul>
-        </div>
-    </nav>
+    <div class="nhsuk-u-padding-bottom-3">
+        <span class="nhsuk-u-padding-right-3 nhsuk-u-primary-text-color nhsuk-u-font-size-16 nhsuk-u-font-weight-bold">Show</span>
+        <span class="nhsuk-u-padding-right-3">
+            <a asp-action="Index" asp-route-dashboardTrayLearningResourceType="all" asp-route-myLearningDashboard=@Model.MyLearnings.Type asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning"
+               class="nhsuk-u-padding-right-3 nhsuk-u-secondary-text-color nhsuk-u-font-size-16 nhsuk-u-font-weight-bold nhsuk-u-text-align-centre filterlink @(Model.DashboardTrayLearningResourceType == "all" ? "filteractive" : "filterinactive")"
+               title="All">
+                All
+            </a>
+        </span>
+        <span class="nhsuk-u-padding-right-3">
+            <a asp-action="Index" asp-route-dashboardTrayLearningResourceType="courses" asp-route-myLearningDashboard=@Model.MyLearnings.Type asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning"
+               class="subnavwhite-link text-nowrap nhsuk-u-padding-right-3 nhsuk-u-secondary-text-color nhsuk-u-font-size-16 nhsuk-u-font-weight-bold filterlink @(Model.DashboardTrayLearningResourceType == "courses" ? "filteractive" : "filterinactive")"
+               title="Courses">
+                Courses
+            </a>
+        </span>
+        <span class="nhsuk-u-padding-right-3">
+            <a asp-action="Index" asp-route-dashboardTrayLearningResourceType="elearning" asp-route-myLearningDashboard=@Model.MyLearnings.Type asp-route-resourceDashboard="@(Model.Resources.Type)" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="my-learning"
+               class="subnavwhite-link text-nowrap nhsuk-u-padding-right-3  nhsuk-u-secondary-text-color nhsuk-u-font-size-16 nhsuk-u-font-weight-bold filterlink @(Model.DashboardTrayLearningResourceType == "elearning" ? "filteractive" : "filterinactive")"
+               title="Elearning">
+                Elearning
+            </a>
+        </span>
+    </div>
     <div class="nhsuk-grid-row nhsuk-u-margin-bottom-2">
         <div class="nhsuk-grid-column-full">
             @if (Model.MyLearnings.Type == "my-in-progress" && Model.MyLearnings.Activities?.Count() > 0)
diff --git a/LearningHub.Nhs.WebUI/Views/Home/_ResourceTray.cshtml b/LearningHub.Nhs.WebUI/Views/Home/_ResourceTray.cshtml
index 4a48a59ae..dbd475962 100644
--- a/LearningHub.Nhs.WebUI/Views/Home/_ResourceTray.cshtml
+++ b/LearningHub.Nhs.WebUI/Views/Home/_ResourceTray.cshtml
@@ -10,7 +10,7 @@
             case "rated-resources":
                 return "Highly rated";
             case "recent-resources":
-                return "Recently added";                
+                return "Recently added";
             case "popular-resources":
                 return "Most accessed";
             case "my-recent-completed":
@@ -26,14 +26,15 @@
                 CatalogueDashboard = Model.Catalogues.Type,
                 CurrentPage = Model.Resources.CurrentPage,
                 TotalPages = Model.Resources.TotalPages,
-                TotalCount = Model.Resources.TotalCount
+                TotalCount = Model.Resources.TotalCount,
+                DashboardTrayLearningResourceType = Model.DashboardTrayLearningResourceType
             };
 }
 
 <div class="dashboardTray">
     <h2>Resources</h2>
 
-    <nav class="subnavbarwhite navbar-expand-md nhsuk-u-margin-bottom-5">
+    <nav class="subnavbarwhite nhsuk-bg-grey navbar-expand-md nhsuk-u-margin-bottom-5">
         <input class="subnav-hidden-checkbox" id="resources-subnav-hidden-checkbox" role="button" type="checkbox" aria-controls="collapsingResourcesSubNavbar" aria-labelledby="resources-subnav-hidden-checkbox-label">
         <div class="bar">
             <div class="navbar-toggler navbar-toggler-left nhsuk-u-font-size-19">@GetActiveTabName()</div>
@@ -43,21 +44,21 @@
 
             </label>
         </div>
-        <div class="navbar-collapse collapse" id="collapsingResourcesSubNavbar">
+        <div class="navbar-collapse nhsuk-bg-grey collapse" id="collapsingResourcesSubNavbar">
             <ul class="navbar-nav">
-                <li class="subnavwhite-item @(Model.Resources.Type == "my-recent-completed" ? "active" : string.Empty)">
+                <li class="subnavwhite-item nhsuk-bg-grey @(Model.Resources.Type == "my-recent-completed" ? "active" : string.Empty)">
                     <a tabindex="0" class="subnavwhite-link text-nowrap"
                        asp-controller="Home" asp-action="Index" asp-route-myLearningDashboard="@(Model.MyLearnings.Type)" asp-route-resourceDashboard="my-recent-completed" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="resources">Recently Completed</a>
                 </li>
-                <li class="subnavwhite-item @(Model.Resources.Type == "rated-resources" ? "active" : string.Empty)">
+                <li class="subnavwhite-item nhsuk-bg-grey @(Model.Resources.Type == "rated-resources" ? "active" : string.Empty)">
                     <a tabindex="0" class="subnavwhite-link text-nowrap"
                        asp-controller="Home" asp-action="Index" asp-route-myLearningDashboard="@(Model.MyLearnings.Type)" asp-route-resourceDashboard="rated-resources" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="resources">Highly rated</a>
                 </li>
-                <li class="subnavwhite-item @(Model.Resources.Type == "recent-resources" ? "active" : string.Empty)">
+                <li class="subnavwhite-item nhsuk-bg-grey @(Model.Resources.Type == "recent-resources" ? "active" : string.Empty)">
                     <a tabindex="0" class="subnavwhite-link text-nowrap"
                        asp-controller="Home" asp-action="Index" asp-route-myLearningDashboard="@(Model.MyLearnings.Type)" asp-route-resourceDashboard="recent-resources" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="resources">Recently added</a>
                 </li>
-                <li class="subnavwhite-item @(Model.Resources.Type == "popular-resources" ? "active" : string.Empty)">
+                <li class="subnavwhite-item nhsuk-bg-grey @(Model.Resources.Type == "popular-resources" ? "active" : string.Empty)">
                     <a tabindex="0" class="subnavwhite-link text-nowrap"
                        asp-controller="Home" asp-action="Index" asp-route-myLearningDashboard="@(Model.MyLearnings.Type)" asp-route-resourceDashboard="popular-resources" asp-route-catalogueDashboard="@Model.Catalogues.Type" asp-fragment="resources">Most accessed</a>
                 </li>