Tweaks to entity table in desktop view

- Also tweaks to sign/signout in small screen

src/server/common/components/entity-table/_entity-table.scss

@@ -3,6 +3,7 @@
 @use "variables/border-radius" as *;
 
 $min-width: 200px;
+$min-grid-cell-width: 200px;
 
 .app-entity-table {
   @extend %govuk-body-m;
@@ -15,6 +16,7 @@ $min-width: 200px;
   empty-cells: show;
 }
 
+// Display compact table on small screens
 @include govuk-media-query($until: desktop-wide) {
   // Hide header, we place headings on individual cells on small screens
   .app-entity-table__head {
@@ -30,19 +32,14 @@ $min-width: 200px;
 
   .app-entity-table__row {
     display: grid;
-    grid-template-columns: repeat(3, minmax(100px, 1fr));
+    grid-template-columns: repeat(4, minmax($min-grid-cell-width, 1fr));
     gap: govuk-spacing(1);
     grid-auto-rows: minmax(50px, auto);
-
     margin-bottom: govuk-spacing(3);
     background-color: govuk-colour("white");
     border-bottom: 2px solid $app-mid-grey;
 
-    &:hover {
-      background-color: govuk-colour("white");
-    }
-
-    &:nth-child(even) {
+    &:hover, &:nth-child(even) {
       background-color: govuk-colour("white");
     }
   }
@@ -52,6 +49,7 @@ $min-width: 200px;
     display: inline-block;
     padding: govuk-spacing(2) govuk-spacing(1);
 
+    // Make icons tiny in compact view
     .app-icon {
       width: 20px;
       min-width: 20px;
@@ -63,19 +61,25 @@ $min-width: 200px;
       content: attr(data-label);
       display: inline-block;
       min-width: $min-width;
-      text-align: left;
       font-weight: bold;
       padding-bottom: govuk-spacing(1);
     }
   }
 }
 
+@include govuk-media-query($until: desktop) {
+  .app-entity-table__row {
+    grid-template-columns: repeat(3, minmax($min-grid-cell-width, 1fr));
+  }
+}
+
 @include govuk-media-query($until: tablet) {
   .app-entity-table__row {
-    grid-template-columns: repeat(2, minmax(100px, 1fr));
+    grid-template-columns: repeat(2, minmax($min-grid-cell-width, 1fr));
   }
 }
 
+// Display full table on large screens
 @include govuk-media-query($from: desktop-wide) {
   .app-entity-table__row {
     display: table-row;

src/server/common/components/service-header/_service-header.scss

@@ -44,12 +44,12 @@
 }
 
 .app-service-header__login-link {
-  margin-left: govuk-spacing(3);
   @include govuk-font(19, "bold");
   display: block;
 
-
   &.app-service-header__is-logged-in {
+    padding-left: govuk-spacing(3);
+
     &::before {
       content: "";
       padding-right: govuk-spacing(3);