Various Fixes

src/e2e/CareLeavers.E2ETests/src/pages/BasePage.ts

@@ -67,7 +67,7 @@ export class BasePage {
 
         // Locators for social media share buttons
         this.shareButtonsContainer = page.locator('.sharethis-inline-share-buttons');
-        this.printShareButton = page.locator('[data-network="print"]');
+        this.printShareButton = page.locator('#print-link');
 
         // Locators for Metadata definitions
         this.metadataDefinitions = page.locator('.gem-c-metadata__definition');

src/web/CareLeavers.Web/AssetSrc/scss/metadata.scss

@@ -201,3 +201,18 @@
     color: #000 !important
   }
 }
+
+.gem-c-print-link__button {
+  display: block;
+  border: 1px solid #505a5f;
+  color: #1d70b8;
+  cursor: pointer;
+  margin: 0;
+}
+
+.gem-c-print-link__link, .gem-c-print-link__button {
+  background: url('/assets/icon-print.png') no-repeat 10px 50%;
+  background-size: 16px 18px;
+  padding: 10px 10px 10px 36px;
+  text-decoration: none;
+}

src/web/CareLeavers.Web/CareLeavers.Web.csproj

@@ -13,6 +13,10 @@
       <Content Include="..\.dockerignore">
         <Link>.dockerignore</Link>
       </Content>
+      <Content Update="AssetSrc\assets\icon-print.png">
+        <ExcludeFromSingleFile>true</ExcludeFromSingleFile>
+        <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
+      </Content>
     </ItemGroup>
 
     <ItemGroup>
@@ -27,4 +31,15 @@
       <PackageReference Include="Serilog.Sinks.ApplicationInsights" Version="4.0.0" />
     </ItemGroup>
 
+    <ItemGroup>
+      <_ContentIncludedByDefault Remove="wwwroot\assets\images\favicon.ico" />
+      <_ContentIncludedByDefault Remove="wwwroot\assets\images\favicon.svg" />
+      <_ContentIncludedByDefault Remove="wwwroot\assets\images\govuk-crest.svg" />
+      <_ContentIncludedByDefault Remove="wwwroot\assets\images\govuk-icon-180.png" />
+      <_ContentIncludedByDefault Remove="wwwroot\assets\images\govuk-icon-192.png" />
+      <_ContentIncludedByDefault Remove="wwwroot\assets\images\govuk-icon-512.png" />
+      <_ContentIncludedByDefault Remove="wwwroot\assets\images\govuk-icon-mask.svg" />
+      <_ContentIncludedByDefault Remove="wwwroot\assets\images\govuk-opengraph-image.png" />
+    </ItemGroup>
+
 </Project>

src/web/CareLeavers.Web/ContentfulRenderers/GDSEntityLinkContentRenderer.cs

@@ -18,24 +18,53 @@
             };
         }
 
+        if (content is Hyperlink)
+        {
+            return true;
+        }
+
         return false;
     }
 
     public async Task<string> RenderAsync(IContent content)
     {
-        var link = (content as EntryStructure);
         var tb = new TagBuilder("a");
-        tb.AddCssClass("govuk-hyperlink");
-        switch (link?.Data.Target)
+        tb.AddCssClass("govuk-link");
+
+        if (content is Hyperlink)
         {
-            case Page p:
-                tb.Attributes["href"] = p.Slug;
+            var link = (content as Hyperlink);
+            tb.Attributes["href"] = link.Data.Uri;
+            if (link.Content.Any())
+            {
                 foreach (var subContent in link.Content)
                 {
                     var renderer = rendererCollection.GetRendererForContent(subContent);
                     tb.InnerHtml.AppendHtml(await renderer.RenderAsync(subContent));
                 }
-                break;
+            }
+            else
+            {
+                tb.InnerHtml.Append(link.Data.Title);
+            }
+        }
+        else
+        {
+
+            var link = (content as EntryStructure);
+
+            switch (link?.Data.Target)
+            {
+                case Page p:
+                    tb.Attributes["href"] = p.Slug;
+                    foreach (var subContent in link.Content)
+                    {
+                        var renderer = rendererCollection.GetRendererForContent(subContent);
+                        tb.InnerHtml.AppendHtml(await renderer.RenderAsync(subContent));
+                    }
+
+                    break;
+            }
         }
 
         return tb.HasInnerHtml ? tb.ToHtmlString() : string.Empty;

src/web/CareLeavers.Web/Gulpfile.js

@@ -24,11 +24,6 @@ gulp.task('dfe-assets', function() {
         .pipe(gulp.dest(paths.dist + 'assets'));
 });
 
-gulp.task('gov-assets', function() {
-    return gulp.src('node_modules/dfe-frontend/packages/assets/**/*', {encoding:false})
-        .pipe(gulp.dest(paths.dist + 'assets'));
-});
-
 gulp.task("sass", function () {
     return gulp.src(paths.src + '/scss/**/*.scss')
         .pipe(sass({
@@ -38,11 +33,17 @@ gulp.task("sass", function () {
         // .pipe(connect.reload());
 });
 
+gulp.task("images", function() {
+    return gulp.src(paths.src + '/assets/**/*', {encoding:false})
+        .pipe(gulp.dest(paths.dist + 'assets'));
+})
+
 gulp.task("dev",
     gulp.series(
         "dfe-js",
         "dfe-css",
         "dfe-assets",
+        "images",
         "sass"
     )
 );

src/web/CareLeavers.Web/Models/Content/Card.cs

@@ -16,5 +16,4 @@ public class Card : ContentfulContent
 
     public List<string> Types { get; set; } = new();
 
-    public int Position { get; set; } = 0;
 }

src/web/CareLeavers.Web/Views/Contentful/Page.cshtml

@@ -1,10 +1,13 @@
 @using System.Globalization
 @using CareLeavers.Web.Configuration
 @using CareLeavers.Web.Models.Enums
+@using Joonasw.AspNetCore.SecurityHeaders.Csp
 @using Microsoft.AspNetCore.Mvc.TagHelpers
 @model CareLeavers.Web.Models.Content.Page
 
 @inject IContentfulConfiguration ContentfulConfiguration
+@inject ICspNonceService CspNonceService
+
 
 @{
     ViewBag.Title = Model.Title;
@@ -45,26 +48,25 @@
             <gds-contentful-contents document="@Model.MainContent" levels="@Model.ContentsHeadings"/>
         }
         <gds-contentful-rich-text document="@Model.MainContent"></gds-contentful-rich-text>
-        @if (Model.Width == PageWidth.FullWidth)
-        {
-            <partial name="ShareThis" model="Model.ShowShareThis"/>
-        }
-
         @if (Model.ShowLastUpdated)
         {
             <hr/>
-            <partial name="_LastUpdated" model="@Model.Sys"/>
+            <partial name="LastUpdated" model="@Model"/>
         }
 
+        <partial name="ShareThis" model="Model.ShowShareThis"/>
     </div>
     @if (Model.Width == PageWidth.TwoThirds)
     {
         <div class="govuk-grid-column-one-third">
+            &nbsp;
+        </div>
+        <div class="govuk-grid-column-full">
             @if (Model.SecondaryContent != null)
             {
+                <hr class="govuk-section-break govuk-section-break--l govuk-section-break--visible">
                 <gds-contentful-rich-text document="@Model.SecondaryContent"></gds-contentful-rich-text>
             }
-            <partial name="ShareThis" model="Model.ShowShareThis"/>
         </div>
     }
 </div>
@@ -83,3 +85,26 @@
         </div>
     }
 }
+
+@section Scripts
+{
+    @if (Model.ShowShareThis)
+    {
+        <script asp-add-nonce="true" defer>
+            const printPage  = () => window.print();
+
+            const addPrintButtonEventListener  = () => {
+                const printButton = document.getElementById("print-link");
+
+                if (!printButton) {
+                    return;
+                }
+
+                printButton.addEventListener('click', printPage);
+
+            }
+
+            addPrintButtonEventListener();
+        </script>
+    }
+}

src/web/CareLeavers.Web/Views/Shared/Banner.cshtml

@@ -24,7 +24,7 @@
                         <h3 class="govuk-heading-l">@Model?.Title</h3>
                         <p class="govuk-body">@Model?.Text</p>
                         <p class="govuk-body">
-                            <a href="@link">@Model?.LinkText</a>
+                            <a href="@link" class="govuk-link">@Model?.LinkText</a>
                         </p>
                     </div>
                     <div class="govuk-grid-column-one-half image-column">

src/web/CareLeavers.Web/Views/Shared/Grid.cshtml

@@ -25,12 +25,9 @@
             <section class="dfe-section alternating-image-text">
                 @if (Model.Content != null && Model.Content.Any())
                 {
-                    var position = -1;
                     foreach (var content in Model.Content)
                     {
-                        position++;
                         var card = (Card)content;
-                        card.Position = position;
                         <partial model="@card" name="Grid/AlternatingImageAndText"/>
                     }
                 }

src/web/CareLeavers.Web/Views/Shared/Grid/AlternatingImageAndText.cshtml

@@ -6,7 +6,7 @@
     <div class="govuk-!-margin-top-3 govuk-!-margin-bottom-5">
         <div class="govuk-grid-row split-panel" style="background: #f3f2f1; vertical-align: text-top;">
             <div class="govuk-grid-column-one-half image-column">
-                <a href="@link">
+                <a href="@link" class="govuk-link">
                     <div class="image-container" style="background-image: url('@Model?.Image?.File?.Url');"></div>
                 </a>
             </div>
@@ -15,7 +15,7 @@
                 {
                     <span class="govuk-caption-l">@Model.Types.FirstOrDefault()</span>
                 }
-                <h3 class="govuk-heading-l"><a href="@link">@Model.Title</a></h3>
+                <h3 class="govuk-heading-l"><a href="@link" class="govuk-link">@Model.Title</a></h3>
                 <p class="govuk-body">@Model.Text</p>
                 <p class="govuk-!-margin-bottom-0">
                 </p>

src/web/CareLeavers.Web/Views/Shared/Grid/Card.cshtml

@@ -5,7 +5,7 @@
 }
 
 <div class="hf-card">
-    <a href="@link">
+    <a href="@link" class="govuk-link">
         <div class="hf-card-container">
             <contentful-image asset="@Model.Image" class="full-width-image card-image" alt="" role="presentation"></contentful-image>
             <div class="cat-card-details">

src/web/CareLeavers.Web/Views/Shared/Grid/ExternalAgency.cshtml

@@ -8,7 +8,7 @@
         }
     </div>
     <div class="box-content">
-        <h3 class="govuk-heading-s"><a href="@Model.Url" target="_blank">@Model.Name</a> <span class="govuk-body-s">(Opens in a new tab)</span></h3>
+        <h3 class="govuk-heading-s"><a href="@Model.Url" target="_blank" class="govuk-link">@Model.Name</a> <span class="govuk-body-s">(Opens in a new tab)</span></h3>
         <p class="govuk-body-s">@Model.Description</p>
         <p class="govuk-body-s"><strong>Call:</strong> @Model.Call</p>
         <p class="govuk-body-s"><strong>Opening times:</strong> @Model.OpeningTimes</p>

src/web/CareLeavers.Web/Views/Shared/_LastUpdated.cshtml → src/web/CareLeavers.Web/Views/Shared/LastUpdated.cshtml

@@ -1,24 +1,30 @@
 @using System.Globalization
-@model Contentful.Core.Models.SystemProperties
+@model CareLeavers.Web.Models.Content.Page
 
 <div class="govuk-grid-row">
     <div class="metadata-logo-wrapper">
         <div class="govuk-grid-column-two-thirds metadata-column">
-            <div class="gem-c-metadata" data-module="gem-toggle metadata" data-gem-toggle-module-started="true" data-metadata-module-started="true">
+            <div class="gem-c-metadata" data-module="gem-toggle metadata">
                 <dl class="gem-c-metadata__list">
                     <dt class="gem-c-metadata__term">From:</dt>
                     <dd class="gem-c-metadata__definition notranslate">
                         <a class="govuk-link" href="https://www.gov.uk/government/organisations/department-for-education">Department for Education</a>
 
                     </dd>
                     <dt class="gem-c-metadata__term">Published</dt>
-                    <dd class="gem-c-metadata__definition">@Model.CreatedAt?.ToString("dd MMMM yyyy", DateTimeFormatInfo.InvariantInfo)</dd>
+                    <dd class="gem-c-metadata__definition">@Model.Sys.CreatedAt?.ToString("dd MMMM yyyy", DateTimeFormatInfo.InvariantInfo)</dd>
                     <dt class="gem-c-metadata__term">Last updated</dt>
                     <dd class="gem-c-metadata__definition">
-                        @Model.UpdatedAt?.ToString("dd MMMM yyyy", DateTimeFormatInfo.InvariantInfo)
+                        @Model.Sys.UpdatedAt?.ToString("dd MMMM yyyy", DateTimeFormatInfo.InvariantInfo)
                     </dd>
                 </dl>
             </div>
+            @if (Model.ShowShareThis)
+            {
+                <div class="gem-c-print-link govuk-!-display-none-print govuk-!-margin-top-3 govuk-!-margin-bottom-8">
+                    <button class="govuk-link govuk-body-s gem-c-print-link__button" data-module="print-link" id="print-link">Print this page</button>
+                </div>
+            }
         </div>
     </div>
 </div>

src/web/CareLeavers.Web/Views/Shared/ShareThis.cshtml

@@ -4,6 +4,7 @@
 {
     <div class="govuk-grid-row">
         <div class="govuk-grid-column-full">
+            <h3 class="govuk-heading-m">Share this page</h3>
             <div class="sharethis-inline-share-buttons"></div>
         </div>
     </div>

src/web/CareLeavers.Web/Views/Shared/_Layout.cshtml

@@ -1,4 +1,5 @@
-@using CareLeavers.Web.Configuration
+@using System.Globalization
+@using CareLeavers.Web.Configuration
 @using GovUk.Frontend.AspNetCore
 @using GovUk.Frontend.AspNetCore.TagHelpers
 @using Joonasw.AspNetCore.SecurityHeaders.Csp