From 4838b6b28dd9ecfa9cef853ccdab2077418745c8 Mon Sep 17 00:00:00 2001
From: Paul Robert Lloyd <me+git@paulrobertlloyd.com>
Date: Sat, 19 Mar 2022 10:43:13 +0000
Subject: [PATCH] Improve the appearance of inline and block code

---
 x-govuk/code/_code.scss | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/x-govuk/code/_code.scss b/x-govuk/code/_code.scss
index a307c1e..04a0a9d 100644
--- a/x-govuk/code/_code.scss
+++ b/x-govuk/code/_code.scss
@@ -1,12 +1,22 @@
+// Use same colour for inline code as that used on GOV.UK Design System site.
+// https://github.com/alphagov/govuk-design-system/blob/main/src/stylesheets/main.scss
+$x-govuk-code-color: #d13118;
+
 .x-govuk-code {
-  @include govuk-font(16);
+  @include govuk-typography-responsive(16);
   background-color: govuk-colour("light-grey");
   font-family: ui-monospace, monospace;
+  -webkit-font-smoothing: auto;
 }
 
 .x-govuk-code--inline {
+  color: $x-govuk-code-color;
   padding: 2px govuk-spacing(1);
 
+  a & {
+    color: inherit;
+  }
+
   // Ensure links within inline code blocks receive focus colour
   a:focus & {
     background: $govuk-focus-colour;
@@ -15,7 +25,7 @@
 
 .x-govuk-code--block {
   @include govuk-responsive-margin(4, "bottom");
-  line-height: 1.4;
+  @include govuk-typography-responsive(19, $override-line-height: 1.4);
   overflow: auto;
   padding: govuk-spacing(4);
   scrollbar-color: $govuk-border-colour govuk-colour("light-grey");