Load individual CSS components

Updated due to a rebase from the main branch which changed how CSS components are loaded. The new way of loading individual components: https://github.com/alphagov/govuk_publishing_components/blob/main/docs/set-up-individual-component-css-loading.md PR that introduced the change: #1622
alphagov · May 31, 2023 · f41f510 · f41f510
1 parent 5ea0d7e
commit f41f510
Show file tree

Hide file tree

Showing 8 changed files with 30 additions and 5 deletions.
diff --git a/app/assets/config/manifest.js b/app/assets/config/manifest.js
@@ -1,2 +1,4 @@
 //= link_directory ../javascripts .js
 //= link_directory ../stylesheets .css
+
+//= link views/_completed_transaction.css
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
@@ -2,8 +2,3 @@
 // for components and views on pages where they are needed.
 
 // https://github.com/alphagov/govuk_publishing_components/blob/main/docs/set-up-individual-component-css-loading.md
-
-.promotion {
-  background: govuk-colour("light-grey");
-  padding: govuk-spacing(3);
-}
diff --git a/app/assets/stylesheets/views/_completed_transaction.scss b/app/assets/stylesheets/views/_completed_transaction.scss
@@ -0,0 +1,7 @@
+@import "govuk_publishing_components/govuk_frontend_support";
+@import "govuk_publishing_components/individual_component_support";
+
+.promotion {
+  background: govuk-colour("light-grey");
+  padding: govuk-spacing(3);
+}
diff --git a/app/views/assisted_digital_feedback/_assistance_received.html.erb b/app/views/assisted_digital_feedback/_assistance_received.html.erb
@@ -1,3 +1,6 @@
+<%
+  add_view_stylesheet("completed_transaction")
+%>
 <%= render "govuk_publishing_components/components/radio", {
     name: "service_feedback[assistance_satisfaction_rating]",
     id_prefix: locals[:id_prefix],

diff --git a/app/views/assisted_digital_feedback/new.html.erb b/app/views/assisted_digital_feedback/new.html.erb
@@ -1 +1,4 @@
+<%
+  add_view_stylesheet("completed_transaction")
+%>
 <%= render partial: "shared/completed_transaction_feedback", locals: { survey: "assisted_digital_satisfaction_survey" } %>
diff --git a/app/views/layouts/service_feedback.html.erb b/app/views/layouts/service_feedback.html.erb
@@ -6,6 +6,9 @@
     <%=  stylesheet_link_tag 'application', :media => "all", integrity: false %>
     <title><%= yield :title %> - GOV.UK</title>
     <%= yield :section_meta_tags %>
+    <%=
+      render_component_stylesheets
+    %>
   </head>
   <body>
     <div id="wrapper" class="completed_transaction service govuk-width-container">

diff --git a/app/views/service_feedback/new.html.erb b/app/views/service_feedback/new.html.erb
@@ -1 +1,10 @@
+<%
+  add_view_stylesheet("completed_transaction")
+%>
+<% add_gem_component_stylesheet("step-by-step-nav") %>
+<% add_gem_component_stylesheet("related-navigation") %>
+<% add_gem_component_stylesheet("step-by-step-nav-header") %>
+<% add_gem_component_stylesheet("step-by-step-nav-related") %>
+<% add_gem_component_stylesheet("contextual-sidebar") %>
+
 <%= render partial: "shared/completed_transaction_feedback", locals: { survey: "standard_satisfaction_survey" } %>
diff --git a/config/application.rb b/config/application.rb
@@ -9,6 +9,7 @@
 
 module Feedback
   class Application < Rails::Application
+    include GovukPublishingComponents::AppHelpers::AssetHelper
     # Initialize configuration defaults for originally generated Rails version.
     config.load_defaults 7.0
 
@@ -26,6 +27,8 @@ class Application < Rails::Application
     # https://github.com/alphagov/govuk-frontend/issues/1350
     config.assets.css_compressor = nil
 
+    config.assets.precompile << get_component_css_paths
+
     config.max_age = ENV["MAX_AGE"] || 300
 
     config.i18n.default_locale = :en