Standardise inverse for action link component

- renames option from 'light_text' to 'inverse'
alphagov · Oct 8, 2024 · 6aab99b · 6aab99b
1 parent 06e1b60
commit 6aab99b
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 12 deletions.
diff --git a/app/assets/stylesheets/govuk_publishing_components/components/_action-link.scss b/app/assets/stylesheets/govuk_publishing_components/components/_action-link.scss
@@ -169,7 +169,7 @@
   }
 }
 
-.gem-c-action-link--light-text {
+.gem-c-action-link--inverse {
   color: govuk-colour("white");
 
   .gem-c-action-link__subtext {

diff --git a/app/views/govuk_publishing_components/components/_action_link.html.erb b/app/views/govuk_publishing_components/components/_action_link.html.erb
@@ -10,15 +10,15 @@
   subtext ||= false
   subtext_href ||= false
   mobile_subtext ||= false
-  light_text ||= false
+  inverse ||= false
   simple ||= false
   simple_light ||= false
   dark_icon ||= false
   dark_large_icon ||= false
   light_icon ||= false
 
   css_classes = %w(gem-c-action-link)
-  css_classes << "gem-c-action-link--light-text" if light_text
+  css_classes << "gem-c-action-link--inverse" if inverse
   css_classes << "gem-c-action-link--dark-icon" if dark_icon
   css_classes << "gem-c-action-link--dark-large-icon" if dark_large_icon
   css_classes << "gem-c-action-link--light-icon" if light_icon
@@ -29,7 +29,7 @@
   css_classes << shared_helper.get_margin_bottom
 
   link_classes = %w(govuk-link gem-c-action-link__link gem-print-link)
-  link_classes << "govuk-link--inverse" if light_text
+  link_classes << "govuk-link--inverse" if inverse
 
   component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
   component_helper.add_class(css_classes.join(" "))

diff --git a/app/views/govuk_publishing_components/components/docs/action_link.yml b/app/views/govuk_publishing_components/components/docs/action_link.yml
@@ -18,11 +18,11 @@ examples:
       text: "Coronavirus (COVID-19):"
       nowrap_text: what you need to do
       href: "/page"
-  with_light_text:
+  inverse:
     data:
       text: "Coronavirus (COVID-19)"
       href: "/page"
-      light_text: true
+      inverse: true
     context:
       dark_background: true
   with_subtext:
@@ -35,7 +35,7 @@ examples:
       text: Emergency something
       href: "/page"
       subtext: This is about the emergency that is happening right now unfortunately so pay attention
-      light_text: true
+      inverse: true
     context:
       dark_background: true
   mobile_subtext:
@@ -56,7 +56,7 @@ examples:
       text: Remain calm
       subtext: Better things are ahead
       subtext_href: "/page"
-      light_text: true
+      inverse: true
     context:
       dark_background: true
   simple_arrow:
@@ -68,7 +68,7 @@ examples:
     data:
       text: Getting financial help and keeping your business safe
       href: "/financial-help"
-      light_text: true
+      inverse: true
       simple_light: true
     context:
       dark_background: true

diff --git a/spec/components/action_link_spec.rb b/spec/components/action_link_spec.rb
@@ -100,12 +100,12 @@ def component_name
     assert_select ".gem-c-action-link--dark-large-icon"
   end
 
-  it "renders light text version" do
+  it "renders inverse version" do
     render_component(
       text: "Get more info",
       href: "/coronavirus",
-      light_text: true,
+      inverse: true,
     )
-    assert_select ".gem-c-action-link--light-text"
+    assert_select ".gem-c-action-link--inverse"
   end
 end