Update locator pages

Example Page: /find-local-council Update to resolve visual differences for frontend swap Remove border from swap on: /foreign-travel-advice
alphagov · May 28, 2021 · ae8cb74 · ae8cb74
1 parent 5aaad0b
commit ae8cb74
Show file tree

Hide file tree

Showing 8 changed files with 21 additions and 37 deletions.
diff --git a/app/assets/stylesheets/views/_homepage.scss b/app/assets/stylesheets/views/_homepage.scss
@@ -1,20 +1,3 @@
-// Remove search from the top bar as we have one in the content.
-
-// stylelint-disable selector-no-qualifying-type, selector-max-id
-body.homepage {
-  #global-header-bar {
-    display: none;
-  }
-
-  // #wrapper,
-  // #content {
-  //   margin: 0;
-  //   width: auto; // needed for IE overides
-  //   max-width: 100%;
-  // }
-}
-// stylelint-enable selector-no-qualifying-type, selector-max-id
-
 .home-top {
   overflow: hidden;
   background: $govuk-brand-colour;
@@ -170,7 +153,7 @@ body.homepage {
 
 .home-numbers__large {
   // Manually setting font-size rather than using the mixins size
-  // because the layout doesnt really work otherwise
+  // because the layout doesn't really work otherwise
   font-size: 53px;
   line-height: (55 / 53);
   font-weight: bold;

diff --git a/app/assets/stylesheets/views/_travel-advice.scss b/app/assets/stylesheets/views/_travel-advice.scss
@@ -8,7 +8,8 @@
   }
 
   .country-filter-form__form-group {
-    margin: 0; // Because fieldset has 2px margins by default.
+    border: 0;
+    margin: 0;
   }
 
   .subscriptions-wrapper {

diff --git a/app/controllers/travel_advice_controller.rb b/app/controllers/travel_advice_controller.rb
@@ -7,7 +7,7 @@ def index
     @presenter = TravelAdviceIndexPresenter.new(@content_item)
 
     respond_to do |format|
-      format.html { 
+      format.html do
         slimmer_template "gem_layout"
         render locals: { full_width: true }
       end

diff --git a/app/views/application/_location_form.html.erb b/app/views/application/_location_form.html.erb
@@ -23,8 +23,8 @@
   <% end %>
 
   <form method="post" id="local-locator-form" class="location-form">
-    <fieldset>
-      <legend class="visuallyhidden">Postcode lookup</legend>
+    <fieldset class="govuk-fieldset">
+      <legend class=" govuk-fieldset__legend govuk-visually-hidden">Postcode lookup</legend>
 
       <%= render partial: 'draft_fields' %>
 

diff --git a/app/views/find_local_council/index.html.erb b/app/views/find_local_council/index.html.erb
@@ -1,9 +1,9 @@
 <%= render layout: 'base_page' do %>
   <p class="govuk-body">Find the website for your local council.</p>
   <%= render partial: 'location_form',
-             locals: {
-               format: 'service',
-               publication_format: 'find_local_council',
-               postcode: @postcode,
-             } %>
+    locals: {
+      format: 'service',
+      publication_format: 'find_local_council',
+      postcode: @postcode,
+    } %>
 <% end %>
diff --git a/app/views/place/_option.html.erb b/app/views/place/_option.html.erb
@@ -7,15 +7,15 @@
 
             <p class="adr govuk-body">
               <% if place["name"].present? %>
-              <span class="fn"><%= place["name"] %></span><span class="visuallyhidden">,</span>
+              <span class="fn"><%= place["name"] %></span><span class="govuk-visually-hidden">,</span>
               <% end %>
 
               <% if place["address"].present? %>
-                <br /><span class="street-address"><%= place["address"] %></span><span class="visuallyhidden">,</span>
+                <br /><span class="street-address"><%= place["address"] %></span><span class="govuk-visually-hidden">,</span>
               <% end %>
 
               <% if place["town"].present? %>
-                <br /><span class="locality"><%= place["town"] %></span><span class="visuallyhidden">,</span>
+                <br /><span class="locality"><%= place["town"] %></span><span class="govuk-visually-hidden">,</span>
               <% end %>
 
               <% if place["postcode"].present? %>

diff --git a/app/views/place/_option_report_child_abuse.html.erb b/app/views/place/_option_report_child_abuse.html.erb
@@ -32,7 +32,7 @@
 
             <% if place["url"].present? %>
               <p class="url govuk-body">
-                <a href="<%= place["url"] %>">Go to their website</a>
+                <a href="<%= place["url"] %>" class="govuk-link">Go to their website</a>
               </p>
             <% end %>
           </div>

diff --git a/spec/javascripts/unit/foreign-travel-advice.spec.js b/spec/javascripts/unit/foreign-travel-advice.spec.js
@@ -3,22 +3,22 @@ var GOVUKTest = {
   countryFilter: {
     threeCategories: '<div id="W" class="list">' +
       '<h3>' +
-      '<span class="visuallyhidden">Countries starting with </span>W</h3>' +
+      '<span class="govuk-visually-hidden">Countries starting with </span>W</h3>' +
       '<ul class="countries js-countries-list">' +
       '<li data-synonyms=""><a href="/foreign-travel-advice/wallis-and-futuna">Wallis and Futuna</a></li>' +
       '<li data-synonyms="Sahel"><a href="/foreign-travel-advice/western-sahara">Western Sahara</a></li>' +
       '</ul>' +
       '</div>' +
       '<div id="Y" class="list">' +
       '<h3>' +
-      '<span class="visuallyhidden">Countries starting with </span>Y</h3>' +
+      '<span class="govuk-visually-hidden">Countries starting with </span>Y</h3>' +
       '<ul class="countries js-countries-list">' +
       '<li data-synonyms=""><a href="/foreign-travel-advice/yemen">Yemen</a></li>' +
       '</ul>' +
       '</div>' +
       '<div id="Z" class="list">' +
       '<h3>' +
-      '<span class="visuallyhidden">Countries starting with </span>Z</h3>' +
+      '<span class="govuk-visually-hidden">Countries starting with </span>Z</h3>' +
       '<ul class="countries js-countries-list">' +
       '<li data-synonyms=""><a href="/foreign-travel-advice/zambia">Zambia</a></li>' +
       '<li data-synonyms=""><a href="/foreign-travel-advice/zimbabwe">Zimbabwe</a></li>' +
@@ -31,22 +31,22 @@ GOVUKTest.countryFilter.categories = {
   allWithCountries: '<section class="countries-wrapper">' + GOVUKTest.countryFilter.threeCategories + '</section>',
   twoWithoutCountries: '<section><div id="W" class="list">' +
     '<h3>' +
-    '<span class="visuallyhidden">Countries starting with </span>W</h3>' +
+    '<span class="govuk-visually-hidden">Countries starting with </span>W</h3>' +
     '<ul class="countries js-countries-list">' +
     '<li data-synonyms="" style="display:none"><a href="/foreign-travel-advice/wallis-and-futuna">Wallis and Futuna</a></li>' +
     '<li data-synonyms="Sahel" style="display:none"><a href="/foreign-travel-advice/western-sahara">Western Sahara</a></li>' +
     '</ul>' +
     '</div>' +
     '<div id="Y" class="list">' +
     '<h3>' +
-    '<span class="visuallyhidden">Countries starting with </span>Y</h3>' +
+    '<span class="govuk-visually-hidden">Countries starting with </span>Y</h3>' +
     '<ul class="countries js-countries-list">' +
     '<li data-synonyms="" style="display:none"><a href="/foreign-travel-advice/yemen">Yemen</a></li>' +
     '</ul>' +
     '</div>' +
     '<div id="Z" class="list">' +
     '<h3>' +
-    '<span class="visuallyhidden">Countries starting with </span>Z</h3>' +
+    '<span class="govuk-visually-hidden">Countries starting with </span>Z</h3>' +
     '<ul class="countries js-countries-list">' +
     '<li data-synonyms=""><a href="/foreign-travel-advice/zambia">Zambia</a></li>' +
     '<li data-synonyms=""><a href="/foreign-travel-advice/zimbabwe">Zimbabwe</a></li>' +