From 23ab59b5411b4940906eaf39253dc7afbec41375 Mon Sep 17 00:00:00 2001
From: Andy Sellick <andy.sellick@digital.cabinet-office.gov.uk>
Date: Mon, 5 Aug 2024 11:02:18 +0100
Subject: [PATCH] Use heading component

- replace hard coded headings with our heading component
---
 app/assets/stylesheets/views/_browse.scss | 5 -----
 app/views/browse/index.html.erb           | 9 ++++++---
 app/views/browse/show.html.erb            | 9 ++++++---
 3 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/app/assets/stylesheets/views/_browse.scss b/app/assets/stylesheets/views/_browse.scss
index eae9baca2..36257a68b 100644
--- a/app/assets/stylesheets/views/_browse.scss
+++ b/app/assets/stylesheets/views/_browse.scss
@@ -54,11 +54,6 @@ $browse-header-background-colour: #263135;
   }
 }
 
-.browse__heading {
-  color: govuk-colour("white");
-  margin-bottom: govuk-spacing(6);
-}
-
 .browse__section {
   margin-bottom: govuk-spacing(9);
 
diff --git a/app/views/browse/index.html.erb b/app/views/browse/index.html.erb
index 4759bf7bc..1887e7825 100644
--- a/app/views/browse/index.html.erb
+++ b/app/views/browse/index.html.erb
@@ -17,9 +17,12 @@
 <% end %>
 
 <%= render "shared/browse_header", { margin_bottom: 9 } do %>
-  <h1 class="browse__heading govuk-heading-xl">
-    <%= t("browse.title") %>
-  </h1>
+  <%= render "govuk_publishing_components/components/heading", {
+    text: t("browse.title"),
+    inverse: true,
+    font_size: "xl",
+    margin_bottom: 6,
+  } %>
   <%= render "govuk_publishing_components/components/lead_paragraph", {
     text: t("browse.description"),
     margin_bottom: 2,
diff --git a/app/views/browse/show.html.erb b/app/views/browse/show.html.erb
index 583e3844c..94d0987c1 100644
--- a/app/views/browse/show.html.erb
+++ b/app/views/browse/show.html.erb
@@ -21,9 +21,12 @@
 <% end %>
 
 <%= render "shared/browse_header", { margin_bottom: page.slug == "benefits" ? 7 : 9 } do %>
-  <h1 class="browse__heading govuk-heading-xl">
-    <%= page.title %>
-  </h1>
+  <%= render "govuk_publishing_components/components/heading", {
+    text: page.title,
+    inverse: true,
+    font_size: "xl",
+    margin_bottom: 6,
+  } %>
   <%= render "govuk_publishing_components/components/lead_paragraph", {
     text: page.description,
     margin_bottom: 2,