From fe7a0fa7a358678e8d4e686b2f778de550c5eced Mon Sep 17 00:00:00 2001
From: "Daniel A.C. Martin" <github@daniel-martin.co.uk>
Date: Fri, 9 Aug 2024 16:42:58 +0100
Subject: [PATCH 1/3] Rename to .tsx

Also fixes a few issues at the top of the file.
---
 .../{voice-and-tone.html => voice-and-tone.tsx}    | 14 ++++++--------
 1 file changed, 6 insertions(+), 8 deletions(-)
 rename apps/docs/src/common/pages/content-style-guide/{voice-and-tone.html => voice-and-tone.tsx} (89%)

diff --git a/apps/docs/src/common/pages/content-style-guide/voice-and-tone.html b/apps/docs/src/common/pages/content-style-guide/voice-and-tone.tsx
similarity index 89%
rename from apps/docs/src/common/pages/content-style-guide/voice-and-tone.html
rename to apps/docs/src/common/pages/content-style-guide/voice-and-tone.tsx
index 1b3b0f62..4e2a6a90 100644
--- a/apps/docs/src/common/pages/content-style-guide/voice-and-tone.html
+++ b/apps/docs/src/common/pages/content-style-guide/voice-and-tone.tsx
@@ -2,13 +2,11 @@
 import { Helmet } from 'react-helmet-async';
 import { PageProps } from '@not-govuk/app-composer';
 import { A } from '@not-govuk/components';
-import { menu } from '../accessibility'
+import { menu } from '../content-style-guide'
 
-export const title = 'Limited English';
-const description = 'Designing for people with limited English';
-export const section = 'Accessibility';
-
-const biometricsSign = require('../../../../assets/images/content-style-guide/Biometrics sign.png');
+export const title = 'Voice and tone';
+const description = 'Voice and tone';
+export const section = 'Content style guide';
 
 const Page: FC<PageProps> = ({ location }) => (
   <div className="govuk-grid-row">
@@ -24,8 +22,8 @@
     </div>
     <div className="govuk-grid-column-three-quarters">
       <h1>
-        <span className="caption">Content style guide</span>
-          Voice and tone
+        <span className="caption">{section}</span>
+          {title}
       </h1>
       <h2 id="home-office-voice">Home Office voice</h2>
       <p>Our voice should be consistent across all our products and services. It is who we are and how we want others to see us.</p>

From 8d4e77bf43b2a030e6221b46fa0a79d63da65ecf Mon Sep 17 00:00:00 2001
From: "Daniel A.C. Martin" <github@daniel-martin.co.uk>
Date: Fri, 9 Aug 2024 16:44:56 +0100
Subject: [PATCH 2/3] Add link to new page

---
 apps/docs/src/common/pages/content-style-guide.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/apps/docs/src/common/pages/content-style-guide.tsx b/apps/docs/src/common/pages/content-style-guide.tsx
index 66b62520..10635c0a 100644
--- a/apps/docs/src/common/pages/content-style-guide.tsx
+++ b/apps/docs/src/common/pages/content-style-guide.tsx
@@ -22,6 +22,10 @@ export const menu = (
       {
         href: '/content-style-guide/designing-for-limited-english',
         text: 'Designing for users with limited English'
+      },
+      {
+        href: '/content-style-guide/voice-and-tone',
+        text: 'Voice and tone'
       }
     ]} />
   </Fragment>

From a44a114a677ae0b007502691cff75b437835c37b Mon Sep 17 00:00:00 2001
From: "Daniel A.C. Martin" <github@daniel-martin.co.uk>
Date: Fri, 9 Aug 2024 16:45:36 +0100
Subject: [PATCH 3/3] Correct meta-data and use correct menu

---
 .../content-style-guide/designing-for-limited-english.tsx     | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/docs/src/common/pages/content-style-guide/designing-for-limited-english.tsx b/apps/docs/src/common/pages/content-style-guide/designing-for-limited-english.tsx
index 2e2a7f88..7e8655a1 100644
--- a/apps/docs/src/common/pages/content-style-guide/designing-for-limited-english.tsx
+++ b/apps/docs/src/common/pages/content-style-guide/designing-for-limited-english.tsx
@@ -2,11 +2,11 @@ import { FC, createElement as h } from 'react';
 import { Helmet } from 'react-helmet-async';
 import { PageProps } from '@not-govuk/app-composer';
 import { A } from '@not-govuk/components';
-import { menu } from '../accessibility'
+import { menu } from '../content-style-guide'
 
 export const title = 'Limited English';
 const description = 'Designing for people with limited English';
-export const section = 'Accessibility';
+export const section = 'Content style guide';
 
 const biometricsSign = require('../../../../assets/images/content-style-guide/Biometrics sign.png');