From fe3baa25c2ce88917c9452151b2eead2df61c6ef Mon Sep 17 00:00:00 2001
From: Tom Byers <tombaromba@gmail.com>
Date: Wed, 27 Nov 2019 16:42:07 +0000
Subject: [PATCH] Replace GOVUK Template anchor focus styles

Not moved across when the GOVUK Template CSS was
removed.
---
 app/assets/stylesheets/globals.scss | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/app/assets/stylesheets/globals.scss b/app/assets/stylesheets/globals.scss
index e85cf2b69..33204ec3c 100644
--- a/app/assets/stylesheets/globals.scss
+++ b/app/assets/stylesheets/globals.scss
@@ -42,6 +42,9 @@ input[type="search"]::-webkit-search-decoration {
 // To be removed when all links follow the GOV.UK Frontend conventions:
 // https://design-system.service.gov.uk/styles/typography/#links
 a {
+  /* Give a strong clear visual idea as to what is currently in focus */
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.3);
+
   &:link {
     color: $link-colour;
   }
@@ -57,6 +60,16 @@ a {
   &:active {
     color: $link-active-colour;
   }
+
+  &:focus {
+    background-color: $focus-colour;
+    outline: 3px solid $focus-colour;
+  }
+
+  /* Make links slightly darker when focused to improve contrast. */
+  &:link:focus {
+    color: darken( $link-colour, 2.5%)
+  }
 }
 
 // Each selector, and then the whole block when only one remains, to be removed when the