govuk_publishing_components 17.15.0 → 17.16.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 9efc12b3a7bac033538c37f639b3d445b7143048cef4cb79f023dcc0f2c73327
-  data.tar.gz: 8764534227e500e355d10106fa48207ef289eccb96ecb685167b7f8d1bdc2649
+  metadata.gz: cdaa42c19f8a80868991b0c0e2e71a395157646a467ba370feed0c5de6f14fef
+  data.tar.gz: d298c0038c8681fc915002dc50302806571fe57902ef68e44d2c409692a3ba7d
 SHA512:
-  metadata.gz: '06985cc2887f08e4689f82bf2611ca5a5697d80e81ca0bdbd4a39c7937806218a9d4d5a9837cb1f5a01f8bcf74989d9f49380cdc3f1a5f67fcac528bd7afb672'
-  data.tar.gz: 5f1956bf05209b2f62a3df019606d6ed44515da8a2d5fd731882dd2297bb235e51e78881ea0d326bb5755c127003921136d07e4eb239633aa88d545d9cb28745
+  metadata.gz: b2790a4941d7b4b6d6b5e65162efe05770e33eb0a928fa3524cb7c08f1208f33b97bee095a0cf4bb25c0243728b64267a4b892b13904423e47487a3dd0ead52c
+  data.tar.gz: 63934ae81bd49e440358b247ad9d3c45ec4c6075db00e405a512212d4f78da5fd50f74afa66899eee85ef0c47e39df8dd026a0453b86e27f51064392bee51fbb

data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss

@@ -1,22 +1,23 @@
 .gem-c-image-card {
-  // if this extends grid-row a margin-bottom can't
-  // be applied as the extend overrides it
-  @extend %contain-floats;
-  margin: 0 (-$gutter-half) $gutter (-$gutter-half);
-  position: relative;
+  @include govuk-clearfix;
   @include govuk-text-colour;
+
+  margin: 0 (- govuk-spacing(3)) govuk-spacing(6) (- govuk-spacing(3));
+  position: relative;
 }
 
 .gem-c-image-card__image-wrapper {
-  @include grid-column(1 / 3, mobile);
+  @include govuk-grid-column(one-third, $class: false, $at: mobile);
+  @include govuk-grid-column(full, $class: false, $at: tablet);
+
   margin: 0;
 
-  @include media(tablet) {
-    margin-bottom: $gutter-one-third;
+  @include govuk-media-query($from: tablet) {
+    margin-bottom: govuk-spacing(2);
   }
 
   + .gem-c-image-card__text-wrapper {
-    @include media(mobile) {
+    @include govuk-media-query($until: tablet) {
       padding-left: 0;
     }
   }
@@ -28,11 +29,12 @@
 }
 
 .gem-c-image-card__text-wrapper {
-  @include grid-column(2 / 3, mobile);
+  @include govuk-grid-column(two-thirds, $class: false, $at: mobile);
+  @include govuk-grid-column(full, $class: false, $at: tablet);
 }
 
 .gem-c-image-card__title {
-  @include bold-19;
+  @include govuk-font(19, $weight: bold);
   margin: 0;
 }
 
@@ -52,8 +54,8 @@
     position: absolute;
     z-index: 1;
     top: 0;
-    left: $gutter-half;
-    right: $gutter-half;
+    left: govuk-spacing(3);
+    right: govuk-spacing(3);
     height: 100%;
     $ie-background: rgba(255, 255, 255, 0);
     background: $ie-background; // because internet explorer
@@ -69,18 +71,18 @@
 
 .gem-c-image-card__context,
 .gem-c-image-card__metadata {
-  @include core-14;
-  margin: 0 0 $gutter-one-quarter;
-  color: $grey-1;
+  @include govuk-font(14);
+  margin: 0 0 (govuk-spacing(3) / 2);
+  color: govuk-colour("grey-1");
 
-  @include media(tablet) {
+  @include govuk-media-query($from: tablet) {
     margin-bottom: 0;
   }
 }
 
 .gem-c-image-card__description {
   @include govuk-font($size: 16);
-  padding-top: $gutter-one-quarter;
+  padding-top: (govuk-spacing(3) / 2);
   word-wrap: break-word;
 }
 
@@ -88,7 +90,7 @@
   @include govuk-font($size: 16);
   position: relative;
   z-index: 2;
-  padding: $gutter-one-quarter 0 0 0;
+  padding: (govuk-spacing(3) / 2) 0 0 0;
   margin: 0;
   list-style: none;
 
@@ -97,7 +99,7 @@
   }
 
   &.gem-c-image-card__list--indented {
-    padding-left: $gutter-half;
+    padding-left: govuk-spacing(3);
 
     .gem-c-image-card__list-item {
       position: relative;
@@ -105,50 +107,50 @@
       &:before {
         content: "-";
         position: absolute;
-        left: -$gutter-half;
+        left: (- govuk-spacing(3));
       }
     }
   }
 }
 
 .gem-c-image-card--large.gem-c-image-card {
-  margin: 0 0 30px 0;
+  margin: 0 0 govuk-spacing(6) 0;
 }
 
 .gem-c-image-card--large {
   .gem-c-image-card__image-wrapper {
-    padding: 0 $gutter-one-third 0 0;
-    margin: 0;
-    float: left;
-    max-width: 66.66%;
-  }
+    @include govuk-grid-column(two-thirds, $class: false, $at: tablet);
 
-  .gem-c-image-card__text-wrapper {
-    overflow: hidden;
-  }
+    margin-bottom: govuk-spacing(2);
+    float: none;
+    width: auto;
+    max-width: 100%;
+    padding: 0;
 
-  .gem-c-image-card__image-wrapper {
-    @include media(mobile) {
-      margin-bottom: $gutter-one-third;
-      padding: 0;
+    @include govuk-media-query($from: tablet) {
+      padding: 0 govuk-spacing(2) 0 0;
+      margin-bottom: 0;
     }
   }
 
-  .gem-c-image-card__image-wrapper,
   .gem-c-image-card__text-wrapper {
-    @include media(mobile) {
-      float: none;
-      width: auto;
-      max-width: 100%;
+    @include govuk-grid-column(one-third, $class: false, $at: tablet);
+
+    padding: 0;
+    overflow: hidden;
+
+    @include govuk-media-query($from: tablet) {
+      padding: 0 govuk-spacing(3);
+      margin-bottom: 0;
     }
   }
 
   .gem-c-image-card__title {
-    @include bold-24;
-    padding-bottom: $gutter-one-third;
+    @include govuk-font(24, $weight: bold);
+    padding-bottom: govuk-spacing(2);
   }
 
   .gem-c-image-card__description {
-    @include core-19;
+    @include govuk-font(19);
   }
 }

data/app/assets/stylesheets/govuk_publishing_components/components/_search.scss

@@ -10,15 +10,13 @@ $large-input-size: 50px;
   display: block;
 
   h1 {
-    @include core-19($line-height: $input-size, $line-height-640: $input-size);
+    @include govuk-font($size: 19, $line-height: $input-size);
     margin: 0;
   }
 }
 
 .gem-c-search__input[type="search"] { // overly specific to prevent some overrides from outside
-  @include box-sizing(border-box);
-  @include core-19($line-height: (28 / 19), $line-height-640: (28 / 16));
-  @include appearance(none);
+  @include govuk-font($size: 19, $line-height: (28 / 19));
   @include govuk-focusable;
 
   padding: 6px;
@@ -26,8 +24,12 @@ $large-input-size: 50px;
   width: 100%;
   height: $input-size;
   border: 0;
-  background: $white;
+  background: govuk-colour("white");
   border-radius: 0; //otherwise iphones apply an automatic border radius
+  box-sizing: border-box;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
 }
 
 .gem-c-search__submit {
@@ -38,92 +40,87 @@ $large-input-size: 50px;
   border-radius: 0;
 }
 
-// IE6 + IE7 always get the simplest version, regardless of whether javascript is enabled
-@if ($is-ie == false) or ($ie-version >= 8) {
-  .js-enabled {
-    .gem-c-search__label {
-      @include core-19($line-height: $input-size, $line-height-640: $input-size);
+.js-enabled {
+  .gem-c-search__label {
+    @include govuk-font($size: 19, $line-height: $input-size);
 
-      position: absolute;
-      left: 15px;
-      top: 1px;
-      z-index: 1;
-      color: $secondary-text-colour;
-    }
+    position: absolute;
+    left: govuk-spacing(3);
+    top: 1px;
+    z-index: 1;
+    color: $govuk-secondary-text-colour;
   }
+}
 
-  .gem-c-search__item-wrapper {
-    display: table;
-    width: 100%;
-    background: $white;
-  }
+.gem-c-search__item-wrapper {
+  display: table;
+  width: 100%;
+  background: govuk-colour("white");
+}
 
-  //general class applied to search input and button wrapper
-  .gem-c-search__item {
-    position: relative;
-    display: table-cell;
-    vertical-align: top;
-  }
+//general class applied to search input and button wrapper
+.gem-c-search__item {
+  position: relative;
+  display: table-cell;
+  vertical-align: top;
+}
 
-  .gem-c-search__input[type="search"] {
-    margin: 0;
+.gem-c-search__input[type="search"] {
+  margin: 0;
 
-    // the .focus class is added by JS and ensures that the input remains above the label once clicked/filled in
-    &:focus,
-    &.focus {
-      z-index: 2;
-    }
+  // the .focus class is added by JS and ensures that the input remains above the label once clicked/filled in
+  &:focus,
+  &.focus {
+    z-index: 2;
   }
+}
 
-  .gem-c-search__submit-wrapper {
-    width: 1%;
-  }
+.gem-c-search__submit-wrapper {
+  width: 1%;
+}
 
-  .gem-c-search__submit {
-    position: relative;
-    padding: 0;
-    width: $input-size;
-    height: $input-size;
-    background-image: image-url("govuk_publishing_components/search-button.png");
-    background-repeat: no-repeat;
-    background-position: 2px 50%;
-    text-indent: -5000px;
-    overflow: hidden;
-
-    &:focus {
-      z-index: 2;
-    }
+.gem-c-search__submit {
+  position: relative;
+  padding: 0;
+  width: $input-size;
+  height: $input-size;
+  background-image: image-url("govuk_publishing_components/search-button.png");
+  background-repeat: no-repeat;
+  background-position: 2px 50%;
+  text-indent: -5000px;
+  overflow: hidden;
 
-    &::-moz-focus-inner {
-      border: 0;
-    }
+  &:focus {
+    z-index: 2;
+  }
 
-    @include device-pixel-ratio {
-      background-size: 52.5px auto;
-      background-position: 115% 50%;
-    }
+  &::-moz-focus-inner {
+    border: 0;
+  }
+
+  @include govuk-device-pixel-ratio {
+    background-size: 52.5px auto;
+    background-position: 115% 50%;
   }
 }
 
 .gem-c-search--on-govuk-blue {
   .gem-c-search__label {
-    color: $white;
+    color: govuk-colour("white");
   }
 
   .gem-c-search__submit {
-    background-color: $black;
-    color: $white;
+    background-color: govuk-colour("black");
+    color: govuk-colour("white");
 
     &:hover {
-      background-color: lighten($black, 5%);
+      background-color: lighten(govuk-colour("black"), 5%);
     }
   }
 
-  @if ($is-ie == false) or ($ie-version >= 8) {
-    .js-enabled & {
-      .gem-c-search__label {
-        color: $secondary-text-colour;
-      }
+  .js-enabled & {
+    .gem-c-search__label {
+      color: $govuk-secondary-text-colour;
     }
   }
 }
@@ -131,38 +128,36 @@ $large-input-size: 50px;
 
 .gem-c-search--on-white {
   .gem-c-search__label {
-    color: $black;
+    color: govuk-colour("black");
   }
 
   .gem-c-search__input[type="search"] {
-    border: solid 1px $grey-2;
+    border: solid 1px govuk-colour("grey-2");
   }
 
   .gem-c-search__submit {
-    background-color: $light-blue;
-    color: $white;
+    background-color: govuk-colour("light-blue");
+    color: govuk-colour("white");
 
     &:hover {
-      background-color: lighten($light-blue, 5%);
+      background-color: lighten(govuk-colour("light-blue"), 5%);
     }
   }
 
-  @if ($is-ie == false) or ($ie-version >= 8) {
-    .gem-c-search__input[type="search"] {
-      border-right: 0;
-    }
+  .gem-c-search__input[type="search"] {
+    border-right: 0;
+  }
 
-    .js-enabled & {
-      .gem-c-search__label {
-        color: $secondary-text-colour;
-      }
+  .js-enabled & {
+    .gem-c-search__label {
+      color: $govuk-secondary-text-colour;
     }
   }
 }
 
 .gem-c-search--large {
   .gem-c-search__label {
-    @include core-19($line-height: $large-input-size, $line-height-640: $large-input-size);
+    @include govuk-font($size: 19, $line-height: $large-input-size);
   }
 
   .gem-c-search__input[type="search"] {
@@ -174,7 +169,7 @@ $large-input-size: 50px;
     height: $large-input-size;
     background-position: 8px 50%;
 
-    @include device-pixel-ratio {
+    @include govuk-device-pixel-ratio {
       background-size: 60px auto;
       background-position: 160% 50%;
     }

data/app/views/govuk_publishing_components/components/_meta_tags.html.erb

@@ -1,4 +1,4 @@
-<% meta_tags = GovukPublishingComponents::Presenters::MetaTags.new(content_item, local_assigns).meta_tags %>
+<% meta_tags = GovukPublishingComponents::Presenters::MetaTags.new(content_item, local_assigns, request).meta_tags %>
 
 <% meta_tags.each do |name, content| %>
   <meta name="<%= name %>" content="<%= content %>">

data/app/views/govuk_publishing_components/components/docs/image_card.yml

@@ -150,7 +150,7 @@ examples:
     data:
       large: true
       href: "/still-not-a-page"
-      image_src: "https://assets.publishing.service.gov.uk/frontend/homepage/leaving-the-eu-bc9992ee672a30d8e8a3e195c9afa750e618748130a4e073a593ba36dfc29af9.jpg"
+      image_src: "https://assets.publishing.service.gov.uk/frontend/homepage/uk-leaves-the-eu-d84d2981a9953d8b1261c9d25016223b0a8af3c096fa2d5e03510d73a78e3c60.jpg"
       image_alt: "some meaningful alt text please"
       context:
         date: 2017-06-14 11:30:00
@@ -204,4 +204,3 @@ examples:
         }
       ]
       extra_links_no_indent: true
-

data/lib/govuk_publishing_components/presenters/meta_tags.rb

@@ -1,9 +1,9 @@
 module GovukPublishingComponents
   module Presenters
     class MetaTags
-      attr_reader :content_item, :details, :links, :local_assigns
+      attr_reader :content_item, :details, :links, :local_assigns, :request
 
-      def initialize(content_item, local_assigns)
+      def initialize(content_item, local_assigns, request)
         # We have to call deep_symbolize_keys because we're often dealing with a
         # parsed JSON document which will have string keys by default, but our
         # components use symbol keys and we want consistency.
@@ -11,6 +11,7 @@ module GovukPublishingComponents
         @details = @content_item[:details] || {}
         @links = @content_item[:links] || {}
         @local_assigns = local_assigns
+        @request = request
       end
 
       def meta_tags
@@ -98,6 +99,14 @@ module GovukPublishingComponents
         stepnavs = links[:part_of_step_navs] || []
         stepnavs_content = stepnavs.map { |stepnav| stepnav[:content_id] }.join(",")
         meta_tags["govuk:stepnavs"] = stepnavs_content if stepnavs_content.present?
+
+        step_nav_helper = PageWithStepByStepNavigation.new(content_item, request.path, request.query_parameters)
+        if step_nav_helper.show_secondary_step_by_step?
+          meta_tags["govuk:navigation-page-type"] = "Secondary step by step shown"
+        elsif step_nav_helper.show_header?
+          meta_tags["govuk:navigation-page-type"] = "Primary step by step shown"
+        end
+
         meta_tags
       end
 

data/lib/govuk_publishing_components/version.rb

@@ -1,3 +1,3 @@
 module GovukPublishingComponents
-  VERSION = '17.15.0'.freeze
+  VERSION = '17.16.0'.freeze
 end

data/node_modules/accessible-autocomplete/package.json

@@ -49,7 +49,7 @@
     "/"
   ],
   "_resolved": "git://github.com/alphagov/accessible-autocomplete.git#3523dd9fffc70cbd9f6f555f75863c33a709f49e",
-  "_shasum": "e90b620884c34d12eeb583d4639556727b4bb978",
+  "_shasum": "5566724b506194c06c4d6e3660c1c741eebe3879",
   "_shrinkwrap": null,
   "_spec": "accessible-autocomplete@git://github.com/alphagov/accessible-autocomplete.git#add-multiselect-support",
   "_where": "/var/lib/jenkins/workspace/ublishing_components_master-N4FWJIUY4CIFHKGZOAAEVVXODRY3YBORQOPIBBXWX72VUPSGJRRQ",

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: govuk_publishing_components
 version: !ruby/object:Gem::Version
-  version: 17.15.0
+  version: 17.16.0
 platform: ruby
 authors:
 - GOV.UK Dev
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-07-16 00:00:00.000000000 Z
+date: 2019-07-18 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: gds-api-adapters