diff --git a/app/views/govuk_publishing_components/components/_global_bar.html.erb b/app/views/govuk_publishing_components/components/_global_bar.html.erb index 99e9d5c4c5..3fbe9e82cf 100644 --- a/app/views/govuk_publishing_components/components/_global_bar.html.erb +++ b/app/views/govuk_publishing_components/components/_global_bar.html.erb @@ -1,9 +1,9 @@ <% - show_global_bar = false + add_gem_component_stylesheet("global-bar") + title ||= nil title_href ||= nil - link_text ||= nil - link_href = false + text ||= nil # Toggles banner being permanently visible # If true, banner is always_visible & does not disappear automatically after 3 pageviews @@ -21,40 +21,21 @@ type: "global bar", section: title, }.to_json - --%> - -<% if show_global_bar %> - +%> +<% if title %>
data-nosnippet>

- <% if title %> - <% if title_href %> - <%= title %> - <% else %> - <%= title %> - <% end %> + <% if title_href %> + <%= title %> + <% else %> + <%= title %> <% end %> - <% if link_text %> + <% if text %> - <% if link_href %> - <%= link_to( - link_text, - link_href, - rel: "external noreferrer", - class: "govuk-link js-call-to-action", - data: { - module: "ga4-link-tracker", - ga4_link: ga4_data, - }, - ) %> - <% else %> - <%= link_text %> - <% end %> + <%= text %> <% end %>

- <% end %> diff --git a/app/views/govuk_publishing_components/components/docs/global_bar.yml b/app/views/govuk_publishing_components/components/docs/global_bar.yml index 5b5735437a..2a604ae3ee 100644 --- a/app/views/govuk_publishing_components/components/docs/global_bar.yml +++ b/app/views/govuk_publishing_components/components/docs/global_bar.yml @@ -1,10 +1,21 @@ name: Global banner description: A site-wide banner used to convey important information body: | - See the [opsmanual](https://docs.publishing.service.gov.uk/apps/static/global-banner.html) for information about what the Global banner is and when it should be activated. + The [dev docs](https://docs.publishing.service.gov.uk/manual/global-banner.html) contains information about this component and when it should be used. accessibility_criteria: | The link must: * be keyboard focusable examples: - default: {} + default: + data: + title: Bring photo ID to vote + with_a_link: + data: + title: Bring photo ID to vote + title_href: "https://www.gov.uk" + with_a_link_and_text: + data: + title: Bring photo ID to vote + title_href: "https://www.gov.uk" + text: Check what photo ID you'll need to vote in person in the General Election on 4 July. diff --git a/spec/components/global_bar_spec.rb b/spec/components/global_bar_spec.rb index ee17463955..5ec4f8b726 100644 --- a/spec/components/global_bar_spec.rb +++ b/spec/components/global_bar_spec.rb @@ -4,4 +4,24 @@ def component_name "global_bar" end + + it "renders nothing without a title" do + assert_empty render_component({}) + end + + it "renders with a title" do + render_component(title: "Look here you") + assert_select ".gem-c-global-bar", text: "Look here you" + end + + it "renders with a title and a link" do + render_component(title: "Look here you", title_href: "https://www.gov.uk") + assert_select ".gem-c-global-bar a.gem-c-global-bar-title", text: "Look here you" + end + + it "renders with a title and text" do + render_component(title: "Look here you", text: "This is important") + assert_select ".gem-c-global-bar .gem-c-global-bar-title", text: "Look here you" + assert_select ".gem-c-global-bar .gem-c-global-bar-text", text: "This is important" + end end