From c75ce1949aad4efc9bd21d08d1607f2a88357b52 Mon Sep 17 00:00:00 2001
From: AshGDS <8880610+AshGDS@users.noreply.github.com>
Date: Fri, 14 Feb 2025 15:58:27 +0000
Subject: [PATCH] Swap inset text top margin with padding

We're trying to standardise the margins at the parent level of components
---
 CHANGELOG.md                                       |  4 ++++
 .../components/_inset-text.scss                    | 11 +++++++++++
 .../components/_inset_text.html.erb                | 14 ++++++++------
 spec/components/inset_text_spec.rb                 |  4 ++--
 4 files changed, 25 insertions(+), 8 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index a34641447c..1b68b5324c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,10 @@
   useful summary for people upgrading their application, not a replication
   of the commit log.
 
+## Unreleased
+
+* Swap inset text top margin with padding ([PR #4634](https://github.com/alphagov/govuk_publishing_components/pull/4634))
+
 ## 51.2.1
 
 * Fix spacing between govspeak headings and attachment ([PR #4618](https://github.com/alphagov/govuk_publishing_components/pull/4618))
diff --git a/app/assets/stylesheets/govuk_publishing_components/components/_inset-text.scss b/app/assets/stylesheets/govuk_publishing_components/components/_inset-text.scss
index 5b61dc845b..ada485e8d1 100644
--- a/app/assets/stylesheets/govuk_publishing_components/components/_inset-text.scss
+++ b/app/assets/stylesheets/govuk_publishing_components/components/_inset-text.scss
@@ -6,3 +6,14 @@
     break-inside: avoid;
   }
 }
+
+.govuk-inset-text {
+  margin-top: 0;
+}
+
+.gem-c-inset-text {
+  padding-top: govuk-spacing(4);
+  @include govuk-media-query($from: tablet) {
+    padding-top: govuk-spacing(6);
+  }
+}
diff --git a/app/views/govuk_publishing_components/components/_inset_text.html.erb b/app/views/govuk_publishing_components/components/_inset_text.html.erb
index ef5e4c5852..af6fb0951f 100644
--- a/app/views/govuk_publishing_components/components/_inset_text.html.erb
+++ b/app/views/govuk_publishing_components/components/_inset_text.html.erb
@@ -5,13 +5,15 @@
   local_assigns[:margin_bottom] ||= 6
 
   component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
-  component_helper.add_class("gem-c-inset-text govuk-inset-text gem-c-force-print-link-styles-within")
+  component_helper.add_class("gem-c-inset-text gem-c-force-print-link-styles-within")
   component_helper.set_id(id)
 %>
 <%= tag.div(**component_helper.all_attributes) do %>
-  <% if defined? text %>
-    <%= text %>
-  <% elsif block_given? %>
-    <%= yield %>
-  <% end %>
+  <div class="govuk-inset-text">
+    <% if defined? text %>
+      <%= text %>
+    <% elsif block_given? %>
+      <%= yield %>
+    <% end %>
+  </div>
 <% end %>
diff --git a/spec/components/inset_text_spec.rb b/spec/components/inset_text_spec.rb
index 729a1bf20b..2083fc169a 100644
--- a/spec/components/inset_text_spec.rb
+++ b/spec/components/inset_text_spec.rb
@@ -8,7 +8,7 @@ def component_name
   it "renders inset text" do
     render_component(text: "It can take up to 8 weeks to register a lasting power of attorney if there are no mistakes in the application.")
 
-    assert_select(".govuk-inset-text.govuk-\\!-margin-bottom-6", text: "It can take up to 8 weeks to register a lasting power of attorney if there are no mistakes in the application.")
+    assert_select(".gem-c-inset-text.govuk-\\!-margin-bottom-6", text: "It can take up to 8 weeks to register a lasting power of attorney if there are no mistakes in the application.")
   end
 
   it "renders a block" do
@@ -36,6 +36,6 @@ def component_name
       margin_bottom: 9,
     )
 
-    assert_select(".govuk-inset-text.govuk-\\!-margin-bottom-9", text: "margin!")
+    assert_select(".gem-c-inset-text.govuk-\\!-margin-bottom-9", text: "margin!")
   end
 end