From cf2f6b85d9b8bdc14eddbca99926cf57c643f1c5 Mon Sep 17 00:00:00 2001
From: ficklephil <philip.aberneithy@gmail.com>
Date: Thu, 11 Jun 2020 08:59:18 +0100
Subject: [PATCH] Feature/eui 1960 restyle signout button (#516)

* Restyle sign-out button

* Restyling signout button.

* Restyle sign out button, with new SVG, and scheme from UI common lib.
---
 package.json                              |  2 +-
 src/app/containers/app/app.component.html | 11 +++++------
 src/styles.scss                           |  4 ++++
 yarn.lock                                 |  8 ++++----
 4 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/package.json b/package.json
index 8fc628fb7..d4439c6ba 100644
--- a/package.json
+++ b/package.json
@@ -58,7 +58,7 @@
     "@hmcts/frontend": "0.0.41-alpha",
     "@hmcts/nodejs-healthcheck": "^1.6.0",
     "@hmcts/properties-volume": "0.0.9",
-    "@hmcts/rpx-xui-common-lib": "0.1.11",
+    "@hmcts/rpx-xui-common-lib": "0.1.14",
     "@ng-idle/core": "^8.0.0-beta.4",
     "@ng-idle/keepalive": "^8.0.0-beta.4",
     "@ngrx/effects": "^7.4.0",
diff --git a/src/app/containers/app/app.component.html b/src/app/containers/app/app.component.html
index 024d60816..3b972cfaa 100644
--- a/src/app/containers/app/app.component.html
+++ b/src/app/containers/app/app.component.html
@@ -15,17 +15,16 @@
 <app-footer></app-footer>
 
 <xuilib-session-dialog positionTop="300px" *ngIf="(modalData$ | async).isVisible" (close)="onStaySignedIn()">
-  <h3 class="govuk-heading-m">We are about to sign you out</h3>
   <p class="govuk-body">For your security, we will sign you out of your account in
-    <strong style="font-weight: bold">{{(modalData$ | async).countdown}}</strong>
+    <strong>{{(modalData$ | async).countdown}}</strong>
   </p>
   <p>Any information you have not saved will be lost</p>
-  <button type="submit" class="govuk-button" (click)="onStaySignedIn()">
+  <button type="submit" class="govuk-button stay-signed-in-button" (click)="onStaySignedIn()">
     Stay signed in
   </button>
-  <div>
-    <a (click)="onNavigate('sign-out')" [routerLink]="">Sign out</a>
-  </div>
+  <button type="submit" class="govuk-button govuk-button--secondary" (click)="onNavigate('sign-out')">
+    Sign out
+  </button>
 </xuilib-session-dialog>
 
 <!--this is the part of fee accounts leaving it here so we know it exist-->
diff --git a/src/styles.scss b/src/styles.scss
index 0e4221e39..43c504d34 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -31,3 +31,7 @@ div.govuk-header__logo, div.hmcts-header__logo {
 .my_hmcts_application_name {
   max-width: 64%;
 }
+
+.stay-signed-in-button {
+  margin-right: 15px;
+}
diff --git a/yarn.lock b/yarn.lock
index edfca314f..1afd70558 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -341,10 +341,10 @@
     lodash "^4.17.11"
     path "^0.12.7"
 
-"@hmcts/rpx-xui-common-lib@0.1.11":
-  version "0.1.11"
-  resolved "https://registry.yarnpkg.com/@hmcts/rpx-xui-common-lib/-/rpx-xui-common-lib-0.1.11.tgz#e02cee1e1fdb792f0a1a65ce935f9f4268c12d29"
-  integrity sha512-k4mw1nrn+g0oJFMtP3qs5MvbZdo0jf21S+EotmvD0BmO5brlJUIOp/YvBdL24YJ1oBqg0MwXjFPrClDDZmqPKQ==
+"@hmcts/rpx-xui-common-lib@0.1.14":
+  version "0.1.14"
+  resolved "https://registry.yarnpkg.com/@hmcts/rpx-xui-common-lib/-/rpx-xui-common-lib-0.1.14.tgz#08b624deb580ed4c9d2368f9f2fa184ce55fadff"
+  integrity sha512-+AI8IKEcktQlcLZTkONwVW55bMLNgTSAtqWBpfRKnnjp60KxI/UJ7TlmmR3zF951d4X8rYkKuQubTB6HOJvJmA==
   dependencies:
     tslib "^1.9.0"