Replace countdown component with sidebar partial

Previously we had a separate component to represent the countdown
functionality, which was only used as part of the sidebar. Once
the countdown has elapsed, the bulk of the component will become
redundant, so it makes sense to incorporate it directly into the
contextual sidebar since:

- It's not intended for re-use - the design is coupled to how it
appears as part of contextual navigation.

- It's no longer a countdown, and no other naming is appropriate,
given its single use case.

Note this preserves all of the other behaviour of the component,
including the button/focus.

app/assets/stylesheets/govuk_publishing_components/components/_contextual-sidebar.scss

@@ -1,4 +1,5 @@
-@import 'transition-countdown';
+$transition-campaign-red: #ff003b;
+$transition-campaign-dark-blue: #1e1348;
 
 .gem-c-contextual-sidebar__brexit-related-links {
   border-top: 2px solid $govuk-brand-colour;
@@ -9,3 +10,42 @@
     margin-bottom: govuk-spacing(2);
   }
 }
+
+.gem-c-contextual-sidebar__brexit-cta {
+  @include govuk-font(19);
+  margin-bottom: govuk-spacing(6);
+  background-color: govuk-colour('light-grey', $legacy: 'grey-4');
+  border-top: 4px solid $transition-campaign-red;
+  display: block;
+  padding: govuk-spacing(3);
+  text-decoration: none;
+
+  .gem-c-contextual-sidebar__brexit-heading {
+    @extend %govuk-heading-m;
+    color: $transition-campaign-dark-blue;
+  }
+
+  .gem-c-contextual-sidebar__brexit-text {
+    @extend %govuk-link;
+
+    margin-top: 0;
+    margin-bottom: 0;
+    text-decoration: underline;
+
+    @include govuk-media-query($from: tablet) {
+      margin-bottom: govuk-spacing(2);
+    }
+  }
+
+  @include govuk-compatibility(govuk_template) {
+    .gem-c-contextual-sidebar__brexit-title {
+      margin-bottom: govuk-spacing(3);
+    }
+  }
+}
+
+.gem-c-contextual-sidebar__brexit-cta:focus {
+  .gem-c-contextual-sidebar__brexit-text {
+    text-decoration: none;
+  }
+}

app/views/govuk_publishing_components/components/_contextual_sidebar.html.erb

@@ -5,20 +5,7 @@
   <% if navigation.show_brexit_related_links? && navigation.step_by_step_count.zero? %>
     <%= render 'govuk_publishing_components/components/contextual_sidebar/brexit_related_links' %>
   <% elsif navigation.step_by_step_count.zero? && !navigation.transition_countdown_exception? %>
-    <%= render 'govuk_publishing_components/components/transition_countdown', {
-      title: t("components.related_navigation.transition.title"),
-      url: t("components.related_navigation.transition.link_path"),
-      text: t("components.related_navigation.transition.link_text"),
-      data_attributes: {
-        "module": "track-click",
-        "track-category": "relatedLinkClicked",
-        "track-action": "1.0 Transition",
-        "track-label": t("components.related_navigation.transition.link_path"),
-        "track-dimension": t("components.related_navigation.transition.link_text"),
-        "track-dimension-index": "29",
-      },
-      lang: shared_helper.t_locale("components.related_navigation.transition.title"),
-    } %>
+    <%= render 'govuk_publishing_components/components/contextual_sidebar/brexit_cta' %>
   <% end %>
 
   <% if navigation.content_tagged_to_a_reasonable_number_of_step_by_steps? %>

app/views/govuk_publishing_components/components/contextual_sidebar/_brexit_cta.html.erb

@@ -0,0 +1,20 @@
+<% shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns) %>
+<% link_text = t("components.related_navigation.transition.link_text") %>
+<% link_path = t("components.related_navigation.transition.link_path") %>
+
+<% data_attributes = {
+  "module": "track-click",
+  "track-category": "relatedLinkClicked",
+  "track-action": "1.0 Transition",
+  "track-label": link_path,
+  "track-dimension": link_text,
+  "track-dimension-index": "29",
+} %>
+
+<%= link_to link_path,
+    class: "govuk-link gem-c-contextual-sidebar__brexit-cta",
+    data: data_attributes,
+    lang: shared_helper.t_locale("components.related_navigation.transition.title") do %>
+  <h2 class="gem-c-contextual-sidebar__brexit-heading"><%= t("components.related_navigation.transition.title") %></h2>
+  <p class="gem-c-contextual-sidebar__brexit-text"><%= link_text %></p>
+<% end %>

config/locales/cy.yml

@@ -13,6 +13,3 @@ cy:
         title: "Pontio Brexit"
         link_path: "/transition.cy"
         link_text: "Gwiriwch eich bod chi'n barod ar gyfer 2021"
-    transition_countdown:
-      day_to_go: "diwrnod i fynd"
-      days_to_go: "diwrnod i fynd"

config/locales/en.yml

@@ -103,6 +103,3 @@ en:
     summary_list:
       edit: "Change"
       delete: "Delete"
-    transition_countdown:
-      day_to_go: "day to go"
-      days_to_go: "days to go"

lib/govuk_publishing_components.rb

@@ -34,7 +34,6 @@
 require "govuk_publishing_components/app_helpers/taxon_breadcrumbs"
 require "govuk_publishing_components/app_helpers/table_helper"
 require "govuk_publishing_components/app_helpers/brand_helper"
-require "govuk_publishing_components/app_helpers/countdown_helper"
 require "govuk_publishing_components/app_helpers/environment"
 
 # Add i18n paths and views for usage outside of a Rails app

spec/component_guide/component_index_spec.rb

@@ -71,8 +71,8 @@
 @import 'govuk_publishing_components/components/step-by-step-nav-header';
 @import 'govuk_publishing_components/components/step-by-step-nav-related';
 @import 'govuk_publishing_components/components/tabs';
-@import 'govuk_publishing_components/components/title';
-@import 'govuk_publishing_components/components/transition-countdown';"
+@import 'govuk_publishing_components/components/title';"
+
     expected_print_sass = "@import 'govuk_publishing_components/govuk_frontend_support';
 @import 'govuk_publishing_components/components/print/back-link';
 @import 'govuk_publishing_components/components/print/button';

spec/features/contextual_navigation_spec.rb

@@ -554,15 +554,14 @@ def and_i_see_the_transition_related_links
 
   def and_i_see_the_transition_call_to_action
     within ".gem-c-contextual-sidebar" do
-      expect(page).to have_selector(".gem-c-transition-countdown")
-      expect(page).to have_css(".gem-c-transition-countdown__title", text: I18n.t("components.related_navigation.transition.title"))
+      expect(page).to have_selector(".gem-c-contextual-sidebar__brexit-cta")
+      expect(page).to have_css(".gem-c-contextual-sidebar__brexit-heading", text: I18n.t("components.related_navigation.transition.title"))
     end
   end
 
   def and_i_do_not_see_the_transition_call_to_action
     within ".gem-c-contextual-sidebar" do
-      expect(page).not_to have_selector(".gem-c-transition-countdown")
-      expect(page).not_to have_css(".gem-c-transition-countdown__title", text: I18n.t("components.related_navigation.transition.title"))
+      expect(page).not_to have_selector(".gem-c-contextual-sidebar__brexit-cta")
     end
   end