AP-5434: CYA update - convert existing summary lists to cards

app/assets/stylesheets/application.scss

@@ -31,6 +31,7 @@ $govuk-assets-path: "/";
 @import "table-sort";
 @import "tables";
 @import "sort-transactions";
+@import "summary-card";
 @import "width-style-correction";
 @import "citizens/spinner";
 @import "providers/legal_aid_applications";

app/assets/stylesheets/check-your-answers.scss

@@ -45,6 +45,7 @@
   border-top: 3px solid #000000;
   border-bottom: 1px solid #000000;
   font-weight: bold;
+
   @include govuk-media-query($from: tablet) {
     display: table-row;
   }
@@ -70,6 +71,6 @@
   }
 }
 
-.print-no-break > .govuk-body {
+.print-no-break>.govuk-body {
   word-wrap: break-word;
 }

app/assets/stylesheets/summary-card.scss

@@ -0,0 +1,7 @@
+.bold-border-top {
+  border-top: 2px solid govuk-colour("black");
+}
+
+.govuk-summary-card {
+  break-inside: avoid;
+}

app/components/reports/merits/delegated_functions_component.html.erb

@@ -1,14 +1,13 @@
-<h3 class="govuk-heading-s">
-  <%= @proceeding.meaning %>
-</h3>
-
 <% if @proceeding.used_delegated_functions? %>
   <%= govuk_summary_list(
+        card: { title: @proceeding.meaning },
         rows:,
         actions: false,
-        classes: "govuk-!-margin-bottom-9",
       ) %>
 <% else %>
+  <h3 class="govuk-heading-s">
+    <%= @proceeding.meaning %>
+  </h3>
   <p class="govuk-body govuk-!-margin-bottom-9">
     <%= t(".not_used") %>
   </p>

app/helpers/check_answers_helper.rb

@@ -1,31 +1,5 @@
 module CheckAnswersHelper
   ItemStruct = Struct.new(:label, :amount_text, :name)
-  # Creates one dictionary list item - so needs to be used within a `govuk-summary-list` `dl`:
-  #     <dl class="govuk-summary-list govuk-!-margin-bottom-9">
-  #       <%= check_answer_link ..... %>
-  #     </dl>
-  def check_answer_link(question:, answer:, name:, url: nil, read_only: false, no_border: false)
-    render(
-      "shared/check_answers/item",
-      name:,
-      url:,
-      question:,
-      answer:,
-      read_only: url.nil? ? true : read_only,
-      no_border:,
-    )
-  end
-
-  def check_answer_no_link(question:, answer:, name:, no_border: false, read_only: false)
-    render(
-      "shared/check_answers/no_link_item",
-      name:,
-      question:,
-      answer:,
-      read_only:,
-      no_border:,
-    )
-  end
 
   # Creates both the outer `div` and the inner list items
   def check_answer_change_link(name:, url:, question:, read_only: false)
@@ -38,16 +12,6 @@ def check_answer_change_link(name:, url:, question:, read_only: false)
     )
   end
 
-  def check_long_question_no_link(question:, answer:, name:, no_border: false)
-    render(
-      "shared/check_answers/no_link_long_item",
-      name:,
-      question:,
-      answer:,
-      no_border:,
-    )
-  end
-
   def number_to_currency_or_na(number)
     number.to_d == BigDecimal("999_999_999_999.0", 12) ? "N/a" : gds_number_to_currency(number)
   end

app/views/providers/check_passported_answers/show.html.erb

@@ -9,9 +9,9 @@
 
   <%= render "shared/check_answers/assets", individual: %>
 
-  <h2 class="govuk-heading-m"><%= t(".chances_of_success_h2") %></h2>
+  <h3 class="govuk-heading-m"><%= t(".what_happens_next") %></h2>
 
-  <p class="govuk-body"><%= t(".chances_of_success_body") %></p>
+  <p class="govuk-body"><%= t(".what_happens_next_body") %></p>
 
   <%= next_action_buttons_with_form(
         url: continue_providers_legal_aid_application_check_passported_answers_path(@legal_aid_application),

app/views/providers/check_provider_answers/_read_only.html.erb

@@ -1,30 +1,31 @@
 <p class="govuk-body"><%= t ".sent_email_text", email: @legal_aid_application.applicant.email %></p>
 
-  <%= govuk_button_link_to t(".change_email_button"),
-                           providers_legal_aid_application_email_address_path,
-                           role: "button",
-                           secondary: true,
-                           id: "change-email" %>
+<%= govuk_button_link_to t(".change_email_button"),
+                         providers_legal_aid_application_email_address_path,
+                         role: "button",
+                         secondary: true,
+                         id: "change-email" %>
 
-  <%= page_template(
-        page_title: t(".title"),
-        notification_banner_title: t("generic.important"),
-        notification_banner_text: t(".banner.your_client_needs_to"),
-        back_link: {
-          path: submitted_providers_legal_aid_applications_path,
-          text: t("generic.home"),
-          method: :get,
-        },
-      ) do %>
+<%= page_template(
+      page_title: t(".title"),
+      notification_banner_title: t("generic.important"),
+      notification_banner_text: t(".banner.your_client_needs_to"),
+      back_link: {
+        path: submitted_providers_legal_aid_applications_path,
+        text: t("generic.home"),
+        method: :get,
+      },
+    ) do %>
 
-    <%= render("providers/check_provider_answers/shared",
-               applicant: @applicant,
-               address: @address,
-               read_only: @read_only) %>
-    <%= next_action_buttons_with_form(
-          url: submitted_providers_legal_aid_applications_path,
-          method: :get,
-          show_draft: false,
-          continue_button_text: t("generic.back_to_your_applications"),
-        ) %>
+  <%= render("providers/check_provider_answers/shared",
+             applicant: @applicant,
+             address: @address,
+             read_only: @read_only) %>
+
+  <%= next_action_buttons_with_form(
+        url: submitted_providers_legal_aid_applications_path,
+        method: :get,
+        show_draft: false,
+        continue_button_text: t("generic.back_to_your_applications"),
+      ) %>
 <% end %>

app/views/providers/check_provider_answers/_shared.html.erb

@@ -34,7 +34,7 @@
     </div>
   </div>
 
-  <%= govuk_summary_list(actions: false, classes: "govuk-!-margin-bottom-9") do |summary_list| %>
+  <%= govuk_summary_list(card: { title: t(".section_proceeding.heading") }, actions: false) do |summary_list| %>
     <%= @source_application.proceedings_by_name.each_with_index do |proceeding, i| %>
       <%= summary_list.with_row(classes: "app-check-your-answers__#{proceeding.name}_proceeding") do |row| %>
         <%= row.with_key(text: "#{t('.proceeding')} #{i + 1}", classes: "govuk-!-width-one-half") %>
@@ -88,6 +88,7 @@
     <%= render(
           "shared/check_answers/substantive_costs",
           legal_aid_application: @source_application,
+          heading: t(".substantive_cost_limit"),
           read_only: @read_only,
         ) %>
   <% end %>

app/views/providers/means_reports/_capital_disregards.html.erb

@@ -1,7 +1,7 @@
 <h2 class="govuk-heading-m"><%= t(".heading") %></h2>
 <%= govuk_summary_list(
+      card: { title: t(".heading") },
       actions: false,
-      classes: "govuk-!-margin-bottom-9",
       html_attributes: { id: "capital-disregards-questions" },
     ) do |summary_list| %>
 

app/views/providers/means_reports/_caseworker_review.html.erb

@@ -1,48 +1,34 @@
-  <section class="print-no-break">
-    <h2 class="govuk-heading-l"><%= t("providers.means_reports.caseworker_review_section_heading") %></h2>
+<section class="print-no-break">
+  <h2 class="govuk-heading-l"><%= t("providers.means_reports.caseworker_review_section_heading") %></h2>
 
-    <section>
-      <dl id="caseworker-review-questions" class="govuk-summary-list govuk-!-margin-bottom-9">
-
-        <div class="<%= "govuk-summary-list__row  normal-word-break govuk-summary-list__row--no-border" %>" id="<%= "means-merits-report__caseworker-review-required" %>">
-          <dt class="<%= "govuk-summary-list__key govuk-!-width-one-half" %>">
-            <%= t(".required") %>
-          </dt>
-          <dd class="<%= "govuk-summary-list__value govuk-!-text-align-right" %>" id="caseworker_review_required_answer">
-            <%= yes_no(@manual_review_determiner.manual_review_required?) %>
-          </dd>
-        </div>
-
-        <% if @manual_review_determiner.manual_review_required? %>
-
-          <div class="<%= "govuk-summary-list__row  normal-word-break govuk-summary-list__row--no-border" %>" id="<%= "means-merits-report__caseworker-review-required" %>">
-            <dt class="<%= "govuk-summary-list__key govuk-!-width-one-half" %>">
-              <%= t(".reasons") %>
-            </dt>
-            <dd class="<%= "govuk-summary-list__value govuk-!-text-align-right" %>" id="caseworker_review_reasons">
-              <% @manual_review_determiner.review_reasons.each do |reason| %>
-                <%= t(".reason.#{reason}") %>
-                <br>
-              <% end %>
-            </dd>
-          </div>
-
-          <% @manual_review_determiner.review_categories_by_reason&.each do |reason, categories| %>
-            <div class="<%= "govuk-summary-list__row  normal-word-break govuk-summary-list__row--no-border" %>" id="<%= "means-merits-report__caseworker-review-required-#{reason}" %>">
-              <dt class="<%= "govuk-summary-list__key govuk-!-width-one-half" %>">
-                <%= t(".category-#{reason}") %>
-              </dt>
-              <dd class="<%= "govuk-summary-list__value govuk-!-text-align-right" %>" id="<%= "review-reason-#{reason}" %>">
-                <% categories.each do |category| %>
-                  <%= t(".category.#{category}") %>
-                  <br>
-                <% end %>
-              </dd>
-            </div>
+  <%= govuk_summary_list(
+        card: { title: t("providers.means_reports.caseworker_review_section_heading") },
+        actions: false,
+        html_attributes: { id: "caseworker-review-questions" },
+      ) do |summary_list| %>
+    <%= summary_list.with_row do |row| %>
+      <%= row.with_key(text: t(".required"), classes: "govuk-!-width-one-half") %>
+      <%= row.with_value(text: yes_no(@manual_review_determiner.manual_review_required?)) %>
+    <% end %>
+    <% if @manual_review_determiner.manual_review_required? %>
+      <%= summary_list.with_row do |row| %>
+        <%= row.with_key(text: t(".reasons")) %>
+        <%= row.with_value do %>
+          <% @manual_review_determiner.review_reasons.each do |reason| %>
+              <%= t(".reason.#{reason}") %><br>
+          <% end %>
+        <% end %>
+      <% end %>
+      <% @manual_review_determiner.review_categories_by_reason&.each do |reason, categories| %>
+        <%= summary_list.with_row do |row| %>
+          <%= row.with_key(text: t(".category-#{reason}"), classes: "govuk-!-width-one-half") %>
+          <%= row.with_value do %>
+            <% categories.each do |category| %>
+                <%= t(".category.#{category}") %><br>
+            <% end %>
           <% end %>
-
         <% end %>
-      </dl>
-      <hr>
-    </section>
+      <% end %>
+    <% end %>
+  <% end %>
 </section>