TD-5761: Merging latest from feature branch.

Author: ArunimaGeorge

LearningHub.Nhs.WebUI/Styles/nhsuk/layout.scss

@@ -9,6 +9,21 @@ body {
     padding: 0 px2rem(32);
 }
 
+.nhsuk-hero {
+    background-color: $color_nhsuk-blue;
+    color: #fff;
+    position: relative;
+}
+
+.nhsuk-hero a,
+.nhsuk-hero a:visited,
+.nhsuk-hero a:hover,
+.nhsuk-hero a:active,
+.nhsuk-hero i {
+    color: $color_nhsuk-white;
+}
+
+
 .nhsuk-width-container.app-width-container {
     max-width: px2rem(1208);
     margin: 0 auto;

LearningHub.Nhs.WebUI/Views/MyAccount/Index.cshtml

@@ -4,18 +4,36 @@
    ViewData["Title"] = "Personal Details";
   var isgeneralUser = User.IsInRole("BasicUser");
 }
+@section NavBreadcrumbs {
 
-<div class="nhsuk-width-container app-width-container">
-    <div class="nhsuk-grid-row my_account_section">
+    <section class="nhsuk-hero">
+        <div class="nhsuk-width-container app-width-container">
+            <div class="nhsuk-grid-row">
+                <div class="nhsuk-grid-column-full">
+
+                    <div class="nhsuk-u-padding-top-3 nhsuk-u-padding-bottom-3">
+                        <a href="/">Home</a>
+                        <i class="fa-solid fa-chevron-right nhsuk-u-padding-top-1 nhsuk-u-padding-bottom-1 nhsuk-u-padding-left-2 nhsuk-u-padding-right-2"></i>
+                    </div>
+                    <div class="nhsuk-u-padding-top-4 nhsuk-u-padding-bottom-7">
+                        <h1 class="nhsuk-heading-xl">My account</h1>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+}
+<div class="bg-white nhsuk-u-padding-bottom-9">
+    <div class="nhsuk-width-container app-width-container">
+        <div class="nhsuk-grid-row">
         <div class="nhsuk-grid-column-one-third">
             @await Component.InvokeAsync("SideNav", new { groupTitle = "Account" })
         </div>
-        <div class="nhsuk-grid-column-two-thirds">
-            @* <h1 class="nhsuk-heading-xl">@ViewData["Title"]</h1> *@
-            <h2 class="nhsuk-heading-l">@ViewData["Title"]</h2>
-            @if (isgeneralUser)
-            {
-                <div class="nhsuk-inset-text">
+                <div class="nhsuk-grid-column-two-thirds">
+                <h2 class="nhsuk-heading-l nhsuk-u-padding-top-7">@ViewData["Title"]</h2>
+                @if (isgeneralUser)
+                {
+                  <div class="nhsuk-inset-text">
                     <span class="nhsuk-u-visually-hidden">Information: </span>
                     <p>If you have a work email address you can upgrade to a full user account. Full users are able to access learning community resources, contribute and share knowledge and content. </p>
                 </div>
@@ -112,6 +130,6 @@
                 </form>
             }
         </div>
-        
         </div>
-        </div>
+        </div>
+</div>

LearningHub.Nhs.WebUI/Views/MyLearning/Index.cshtml

@@ -17,6 +17,27 @@
     <link rel="stylesheet" type="text/css" href="~/css/nhsuk/pages/mylearning.css" asp-append-version="true" />
 
 }
+
+@section NavBreadcrumbs {
+
+    <section class="nhsuk-hero">
+        <div class="nhsuk-width-container app-width-container">
+            <div class="nhsuk-grid-row">
+                <div class="nhsuk-grid-column-full">
+
+                    <div class="nhsuk-u-padding-top-3 nhsuk-u-padding-bottom-3">
+                        <a href="/">Home</a>
+                        <i class="fa-solid fa-chevron-right nhsuk-u-padding-top-1 nhsuk-u-padding-bottom-1 nhsuk-u-padding-left-2 nhsuk-u-padding-right-2"></i>
+                    </div>
+                    <div class="nhsuk-u-padding-top-4 nhsuk-u-padding-bottom-7">
+                        <h1 class="nhsuk-heading-xl">My learning activity</h1>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+}
+
 <div class="my-learning">
     <div class="nhsuk-width-container app-width-container">
         <div class="nhsuk-grid-row nhsuk-u-padding-top-9 nhsuk-u-padding-bottom-9">
@@ -25,7 +46,7 @@
                 {
                     <vc:error-summary order-of-property-names="@(new[] { nameof(Model) })" />
                 }
-                <h1 class="nhsuk-heading-xl">My learning</h1>
+               @*  <h1 class="nhsuk-heading-xl">My learning</h1> *@
                 <p class="nhsuk-body-l">
                     You can use this page to search and filter learning resources you've accessed, download certificates and generate a report
                     of your activity.