Add helper for hiding global bar

Currently the global bar is initially hidden, then shown using JavaScript - this causes a shift in the layout of the page (aka jank) and means that the global bar is not available for users without JavaScript. To avoid this, a change will need to be made in Static to the make the global bar be initially shown by default. The bar can then be hidden on pages that don't need it - and doing this using CSS will avoid jank. This change adds a helper that checks whether a page should hide the global bar; the view can then add a class to the body element that will hide the global bar. These changes won't have any effect until Static has been updated.
alphagov · Apr 21, 2021 · d45685f · d45685f
1 parent 2dc18bb
commit d45685f
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 2 deletions.
diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb
@@ -65,4 +65,18 @@ def render_govspeak(content)
       raw(Govspeak::Document.new(content, sanitize: false).to_html)
     end
   end
+
+  def hide_global_bar?
+    paths_to_hide_global_bar_on = [
+      "^/coronavirus$",
+      "^/coronavirus/.*$",
+      "^/transition(.cy)?$",
+      "^/transition-check/.*$",
+      "^/eubusiness(\\..*)?$",
+    ]
+
+    concatenated_regexes = Regexp.new(paths_to_hide_global_bar_on.join("|"))
+
+    request.path.match(concatenated_regexes).present?
+  end
 end
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
@@ -1,3 +1,10 @@
+<%
+  body_classes = %w[]
+  body_classes << content_for(:body_classes) if content_for(:body_classes)
+  body_classes << "full-width" if content_for(:is_full_width_header)
+  body_classes << "hide-global-bar" if hide_global_bar?
+%>
+
 <!DOCTYPE html>
 <html>
 <head>
@@ -11,7 +18,7 @@
   <%= stylesheet_link_tag "print.css", :media => "print", integrity: false %>
 </head>
 
-<body <% if content_for(:is_full_width_header) %>class="full-width"<% end %>>
+<%= content_tag(:body, class: body_classes) do %>
   <div class="wrapper" id="wrapper">
     <%= yield :back_link %>
     <% unless (content_for(:is_full_width_header) || content_for(:back_link)) %>
@@ -37,5 +44,5 @@
       <%= render 'govuk_publishing_components/components/feedback' %>
     <% end %>
   </div>
-</body>
+<% end %>
 </html>