dxw_govuk_frontend_rails 3.14.0 → 4.6.0

data/vendor/assets/stylesheets/helpers/_shape-arrow.scss

@@ -46,7 +46,7 @@
 
   $perpendicular: $base / 2;
 
-  @if ($height == null) {
+  @if not $height {
     $height: _govuk-equilateral-height($base);
   }
 

data/vendor/assets/stylesheets/helpers/_spacing.scss

@@ -39,7 +39,7 @@
   }
 
   $is-negative: false;
-  @if ($spacing-point < 0) {
+  @if $spacing-point < 0 {
     $is-negative: true;
     $spacing-point: abs($spacing-point);
   }
@@ -94,12 +94,12 @@
   // Loop through each breakpoint in the map
   @each $breakpoint, $breakpoint-value in $scale-map {
 
-    @if ($adjustment) {
+    @if $adjustment {
       $breakpoint-value: $breakpoint-value + $adjustment;
     }
 
     // The 'null' breakpoint is for mobile.
-    @if $breakpoint == null {
+    @if not $breakpoint {
 
       @if $direction == all {
         #{$property}: $breakpoint-value if($important, !important, null);

data/vendor/assets/stylesheets/helpers/_typography.scss

@@ -23,7 +23,7 @@
   // We do not need to include the GDS Transport font-face declarations if
   // alphagov/govuk_template is being used since nta will already be included by
   // default.
-  @if ($govuk-include-default-font-face) {
+  @if $govuk-include-default-font-face {
     @include _govuk-font-face-gds-transport;
   }
 
@@ -86,12 +86,13 @@
 
 /// Responsive typography helper
 ///
-/// Takes a 'font map' as an argument and uses it to create font-size and
-/// line-height declarations for different breakpoints, and for print.
+/// Takes a point from the responsive 'font map' as an argument (the size as it
+/// would appear on tablet and above), and uses it to create font-size and
+/// line-height declarations for different breakpoints, and print.
 ///
 /// Example font map:
 ///
-/// $my-font-map: (
+/// 19: (
 ///   null: (
 ///     font-size: 16px,
 ///     line-height: 20px
@@ -106,12 +107,15 @@
 ///   )
 /// );
 ///
-/// @param {Map} $font-map - Font map
+/// @param {Number} $size - Point from the spacing scale (the size as it would
+///   appear on tablet and above)
 /// @param {Number} $override-line-height [false] - Non responsive custom line
 ///   height. Omit to use the line height from the font map.
 /// @param {Boolean} $important [false] - Whether to mark declarations as
 ///   `!important`.
 ///
+/// @throw if `$size` is not a valid point from the spacing scale
+///
 /// @access public
 
 @mixin govuk-typography-responsive($size, $override-line-height: false, $important: false) {
@@ -142,7 +146,7 @@
     $font-size-rem: $font-size-rem if($important, !important, null);
     $line-height: $line-height if($important, !important, null);
 
-    @if $breakpoint == null {
+    @if not $breakpoint {
       font-size: $font-size;
       @if $govuk-typography-use-rem {
         font-size: $font-size-rem;
@@ -167,11 +171,14 @@
 
 /// Font helper
 ///
-/// @param {Number} $size - Size of the font as it would appear on desktop -
-///   uses the responsive font size map
+/// @param {Number | Boolean} $size Point from the spacing scale (the size as it
+///   would appear on tablet and above). Use `false` to avoid setting a size.
 /// @param {String} $weight [regular] - Weight: `bold` or `regular`
 /// @param {Boolean} $tabular [false] - Whether to use tabular numbers or not
-/// @param {Number} $line-height [false] - Line-height, if overriding the default
+/// @param {Number} $line-height [false] - Line-height, if overriding the
+///   default
+///
+/// @throw if `$size` is not a valid point from the spacing scale (or false)
 ///
 /// @access public
 

data/vendor/assets/stylesheets/objects/_all.scss

@@ -2,4 +2,5 @@
 @import "form-group";
 @import "grid";
 @import "main-wrapper";
+@import "template";
 @import "width-container";

data/vendor/assets/stylesheets/objects/_button-group.scss

@@ -29,19 +29,12 @@
     // margins, but unfortunately the support isn't there (yet) and @supports
     // doesn't play nicely with it
     // (https://github.com/w3c/csswg-drafts/issues/3559)
-    display: -webkit-box;
-    display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
-    -webkit-box-orient: vertical;
-    -webkit-box-direction: normal;
-    -webkit-flex-direction: column;
-        -ms-flex-direction: column;
-            flex-direction: column;
-    -webkit-box-align: center;
-    -webkit-align-items: center;
-        -ms-flex-align: center;
-            align-items: center;
+    -ms-flex-direction: column;
+        flex-direction: column;
+    -ms-flex-align: center;
+        align-items: center;
 
     // Give links within the button group the same font-size and line-height
     // as buttons.
@@ -71,22 +64,13 @@
       // Cancel out the column gap for the last item in each row
       margin-right: ($horizontal-gap * -1);
 
-      -webkit-box-orient: horizontal;
+      -ms-flex-direction: row;
 
-      -webkit-box-direction: normal;
-
-      -webkit-flex-direction: row;
-
-          -ms-flex-direction: row;
-
-              flex-direction: row;
-      -webkit-flex-wrap: wrap;
-          -ms-flex-wrap: wrap;
-              flex-wrap: wrap;
-      -webkit-box-align: baseline;
-      -webkit-align-items: baseline;
-          -ms-flex-align: baseline;
-              align-items: baseline;
+          flex-direction: row;
+      -ms-flex-wrap: wrap;
+          flex-wrap: wrap;
+      -ms-flex-align: baseline;
+          align-items: baseline;
 
       .govuk-button,
       .govuk-link {

data/vendor/assets/stylesheets/objects/_main-wrapper.scss

@@ -21,37 +21,22 @@
 //   </div>
 // </div>
 
-/// @deprecated Replace this mixin with more direct references to the [spacing
-/// mixins](https://design-system.service.gov.uk/styles/spacing/#spacing-on-custom-components).
-@mixin govuk-main-wrapper {
-  // In IE11 the `main` element can be used, but is not recognized  –
-  // meaning it's not defined in IE's default style sheet,
-  // so it uses CSS initial value, which is inline.
-  display: block;
-  padding-top: govuk-spacing(4);
-  padding-bottom: govuk-spacing(4);
-
-  @include govuk-media-query($from: tablet) {
-    // This spacing is manually adjusted to replicate the margin of
-    // govuk-heading-xl (50px) minus the spacing of back link and
-    // breadcrumbs (10px)
-    padding-top: govuk-spacing(7);
-    padding-bottom: govuk-spacing(7);
-  }
-}
-
-/// Use govuk-main-wrapper--l when you page does not have Breadcrumbs, phase
-/// banners or back links.
-///
-/// @deprecated Replace this mixin with more direct references to the [spacing
-/// mixins](https://design-system.service.gov.uk/styles/spacing/#spacing-on-custom-components).
-@mixin govuk-main-wrapper--l {
-  @include govuk-responsive-padding(8, "top");
-}
-
 @include govuk-exports("govuk/objects/main-wrapper") {
   .govuk-main-wrapper {
-    @include govuk-main-wrapper;
+    // In IE11 the `main` element can be used, but is not recognized  –
+    // meaning it's not defined in IE's default style sheet,
+    // so it uses CSS initial value, which is inline.
+    display: block;
+    padding-top: govuk-spacing(4);
+    padding-bottom: govuk-spacing(4);
+
+    @include govuk-media-query($from: tablet) {
+      // This spacing is manually adjusted to replicate the margin of
+      // govuk-heading-xl (50px) minus the spacing of back link and
+      // breadcrumbs (10px)
+      padding-top: govuk-spacing(7);
+      padding-bottom: govuk-spacing(7);
+    }
   }
 
   // Using the `.govuk-main-wrapper--auto-spacing` modifier should apply the
@@ -63,6 +48,6 @@
   // `govuk-main-wrapper--l` modifier instead.
   .govuk-main-wrapper--auto-spacing:first-child,
   .govuk-main-wrapper--l {
-    @include govuk-main-wrapper--l;
+    @include govuk-responsive-padding(8, "top");
   }
 }

data/vendor/assets/stylesheets/objects/_template.scss

@@ -0,0 +1,32 @@
+@import "../base";
+
+@include govuk-exports("govuk/objects/template") {
+
+  // Applied to the <html> element
+  .govuk-template {
+    // Set the overall page background colour to the same colour as used by the
+    // footer to give the illusion of a long footer.
+    background-color: $govuk-canvas-background-colour;
+
+    // Prevent automatic text sizing, as we already cater for small devices and
+    // would like the browser to stay on 100% text zoom by default.
+    -webkit-text-size-adjust: 100%;
+       -moz-text-size-adjust: 100%;
+            text-size-adjust: 100%;
+
+    // Force the scrollbar to always display in IE, to prevent horizontal page
+    // jumps as content height changes (e.g. autocomplete results open).
+    @include govuk-media-query($media-type: screen) {
+      overflow-y: scroll;
+    }
+  }
+
+  // Applied to the <body> element
+  .govuk-template__body {
+    // The default margins set by user-agents are not required since we have our
+    // own containers.
+    margin: 0;
+    // Set the overall body of the page back to the typical background colour.
+    background-color: $govuk-body-background-colour;
+  }
+}

data/vendor/assets/stylesheets/objects/_width-container.scss

@@ -28,9 +28,7 @@
 
   // Respect 'display cutout' safe area (avoids notches and rounded corners)
   @supports (margin: unquote("max(calc(0px))")) {
-    $gutter-safe-area-right: -webkit-calc(#{$govuk-gutter-half} + env(safe-area-inset-right));
     $gutter-safe-area-right: calc(#{$govuk-gutter-half} + env(safe-area-inset-right));
-    $gutter-safe-area-left: -webkit-calc(#{$govuk-gutter-half} + env(safe-area-inset-left));
     $gutter-safe-area-left: calc(#{$govuk-gutter-half} + env(safe-area-inset-left));
 
     // Use max() to pick largest margin, default or with safe area
@@ -46,9 +44,7 @@
 
     // Respect 'display cutout' safe area (avoids notches and rounded corners)
     @supports (margin: unquote("max(calc(0px))")) {
-      $gutter-safe-area-right: -webkit-calc(#{$govuk-gutter-half} + env(safe-area-inset-right));
       $gutter-safe-area-right: calc(#{$govuk-gutter-half} + env(safe-area-inset-right));
-      $gutter-safe-area-left: -webkit-calc(#{$govuk-gutter-half} + env(safe-area-inset-left));
       $gutter-safe-area-left: calc(#{$govuk-gutter-half} + env(safe-area-inset-left));
 
       // Use max() to pick largest margin, default or with safe area
@@ -72,7 +68,7 @@
     }
   }
 
-  @include govuk-if-ie8 {
+  @include _govuk-if-ie8 {
     width: $width;
     // Since media queries are not supported in IE8,
     // we need to duplicate this margin that centers the page.

data/vendor/assets/stylesheets/overrides/_display.scss

@@ -1,9 +1,3 @@
-@if not mixin-exists("govuk-exports") {
-  @warn "Importing items from the overrides layer without first importing `base` is deprecated, and will no longer work as of GOV.UK Frontend v4.0.";
-}
-
-@import "../base";
-
 // stylelint-disable declaration-no-important
 @include govuk-exports("govuk/overrides/display") {
   .govuk-\!-display-inline {

data/vendor/assets/stylesheets/overrides/_spacing.scss

@@ -1,13 +1,9 @@
-@if not mixin-exists("govuk-exports") {
-  @warn "Importing items from the overrides layer without first importing `base` is deprecated, and will no longer work as of GOV.UK Frontend v4.0.";
-}
-
-@import "../base";
-
 ////
 /// @group overrides
 ////
 
+// stylelint-disable declaration-no-important
+
 /// Directions for spacing
 ///
 /// @type Map
@@ -20,25 +16,27 @@ $_spacing-directions: (
   "left"
 ) !default;
 
-/// Spacing override classes
+/// Generate responsive spacing override classes
 ///
 /// Generate spacing override classes for the given property (e.g. margin)
-/// for each point in the spacing scale.
+/// for each point in the responsive spacing scale.
 ///
 /// @param {String} $property - Property to add spacing to (e.g. 'margin')
 ///
-/// @example scss
-///   .govuk-\!-margin-0 {
-///      margin: 0;
-///   }
+/// @example css
+///  .govuk-\!-margin-4 {
+///    margin: 15px !important;
+///  }
 ///
-///  .govuk-\!-margin-top-1 {
-///     margin-top: [whatever spacing point 1 is...]
-///   }
+///  @media (min-width: 40.0625em) {
+///    .govuk-\!-margin-4 {
+///      margin: 20px !important;
+///    }
+///  }
 ///
 /// @access private
 
-@mixin _govuk-generate-spacing-overrides($property) {
+@mixin _govuk-generate-responsive-spacing-overrides($property) {
   // For each point in the spacing scale (defined in settings), create an
   // override that affects all directions...
   @each $scale-point, $scale-map in $govuk-spacing-responsive-scale {
@@ -58,7 +56,47 @@ $_spacing-directions: (
   }
 }
 
+/// Generate static spacing override classes
+///
+/// Generate spacing override classes for the given property (e.g. margin)
+/// for each point in the non-responsive spacing scale.
+///
+/// The classes in the format govuk-#{$property}-static-#{$spacing-point}
+/// and govuk-\!-#{$property}-#{$direction}-static-#{$spacing-point} are deprecated.
+/// For example: govuk-!-margin-static-2 or govuk-!-margin-top-static-2
+///
+/// Use classes in the format .govuk-\!-static-#{$property}-#{$spacing-point}
+/// and .govuk-\!-static-#{$property}-#{$direction}-#{$spacing-point} instead.
+/// For example: govuk-!-static-margin-2 or govuk-!-static-margin-top-2
+///
+/// @param {String} $property - Property to add spacing to (e.g. 'margin')
+///
+/// @example css
+///   .govuk-\!-static-margin-4 {
+///      margin: 20px !important;
+///   }
+///
+/// @access private
+@mixin _govuk-generate-static-spacing-overrides($property) {
+  @each $spacing-point in map-keys($govuk-spacing-points) {
+    .govuk-\!-#{$property}-static-#{$spacing-point},
+    .govuk-\!-static-#{$property}-#{$spacing-point} {
+      #{$property}: govuk-spacing($spacing-point) !important;
+    }
+
+    @each $direction in $_spacing-directions {
+      .govuk-\!-#{$property}-#{$direction}-static-#{$spacing-point},
+      .govuk-\!-static-#{$property}-#{$direction}-#{$spacing-point} {
+        #{$property}-#{$direction}: govuk-spacing($spacing-point) !important;
+      }
+    }
+  }
+}
+
 @include govuk-exports("govuk/overrides/spacing") {
-  @include _govuk-generate-spacing-overrides("margin");
-  @include _govuk-generate-spacing-overrides("padding");
+  @include _govuk-generate-responsive-spacing-overrides("margin");
+  @include _govuk-generate-responsive-spacing-overrides("padding");
+
+  @include _govuk-generate-static-spacing-overrides("margin");
+  @include _govuk-generate-static-spacing-overrides("padding");
 }

data/vendor/assets/stylesheets/overrides/_text-align.scss

@@ -1,9 +1,3 @@
-@if not mixin-exists("govuk-exports") {
-  @warn "Importing items from the overrides layer without first importing `base` is deprecated, and will no longer work as of GOV.UK Frontend v4.0.";
-}
-
-@import "../base";
-
 // stylelint-disable declaration-no-important
 @include govuk-exports("govuk/overrides/text-align") {
   .govuk-\!-text-align-left {

data/vendor/assets/stylesheets/overrides/_typography.scss

@@ -1,9 +1,3 @@
-@if not mixin-exists("govuk-exports") {
-  @warn "Importing items from the overrides layer without first importing `base` is deprecated, and will no longer work as of GOV.UK Frontend v4.0.";
-}
-
-@import "../base";
-
 @include govuk-exports("govuk/overrides/typography") {
   // Font size and line height
 

data/vendor/assets/stylesheets/overrides/_width.scss

@@ -1,9 +1,3 @@
-@if not mixin-exists("govuk-exports") {
-  @warn "Importing items from the overrides layer without first importing `base` is deprecated, and will no longer work as of GOV.UK Frontend v4.0.";
-}
-
-@import "../base";
-
 // stylelint-disable declaration-no-important
 @include govuk-exports("govuk/overrides/width") {
   .govuk-\!-width-full {

data/vendor/assets/stylesheets/settings/_all.scss

@@ -3,6 +3,7 @@
 
 @import "assets";
 
+@import "warnings";
 @import "compatibility";
 @import "global-styles";
 @import "ie8";

data/vendor/assets/stylesheets/settings/_colours-organisations.scss

@@ -54,6 +54,13 @@ $govuk-colours-organisations: (
     colour: #cf102d,
     colour-websafe: #005ea5
   ),
+  "department-for-business-and-trade": (
+    colour: #cf102d,
+    colour-websafe: #005ea5
+  ),
+  "department-for-levelling-up-housing-and-communities": (
+    colour: #012169,
+  ),
   "department-for-transport": (
     colour: #006c56,
     colour-websafe: #398373

data/vendor/assets/stylesheets/settings/_colours-palette.scss

@@ -15,6 +15,8 @@
 ///
 /// @type Boolean
 /// @access public
+/// @deprecated Will be removed in v5.0 with the rest of the compatibility mode
+/// suite of tools and settings
 
 $govuk-use-legacy-palette: if(
   (
@@ -26,6 +28,16 @@ $govuk-use-legacy-palette: if(
   false
 ) !default;
 
+// Only show the deprecation warning if user is setting $govuk-use-legacy-palette
+// manually instead of automatically via compatibility variables
+@if $govuk-use-legacy-palette == true and
+  $govuk-compatibility-govukfrontendtoolkit == false and
+  $govuk-compatibility-govuktemplate == false and
+  $govuk-compatibility-govukelements == false {
+  @include _warning(legacy-palette, "$govuk-use-legacy-palette is deprecated. " +
+  "Only the modern colour palette will be supported from v5.0.");
+}
+
 /// Modern colour palette
 ///
 /// This exists only because you cannot easily set a !default variable

data/vendor/assets/stylesheets/settings/_compatibility.scss

@@ -23,9 +23,17 @@
 ///
 /// @type Boolean
 /// @access public
+/// @deprecated Will be removed in v5.0 with the rest of the compatibility mode
+/// suite of tools and settings
 
 $govuk-compatibility-govukfrontendtoolkit: false !default;
 
+@if $govuk-compatibility-govukfrontendtoolkit == true {
+  @include _warning("compatibility-mode", "$govuk-compatibility-govukfrontendtoolkit " +
+  "is deprecated. From version 5.0, GOV.UK Frontend will remove compatibility " +
+  "with the legacy library govuk_frontend_toolkit.");
+}
+
 /// Compatibility Mode: alphagov/govuk_template
 ///
 /// Enabling this will:
@@ -41,9 +49,17 @@ $govuk-compatibility-govukfrontendtoolkit: false !default;
 ///
 /// @type Boolean
 /// @access public
+/// @deprecated Will be removed in v5.0 with the rest of the compatibility mode
+/// suite of tools and settings
 
 $govuk-compatibility-govuktemplate: false !default;
 
+@if $govuk-compatibility-govuktemplate == true {
+  @include _warning("compatibility-mode", "$govuk-compatibility-govuktemplate " +
+  "is deprecated. From version 5.0, GOV.UK Frontend will remove " +
+  "compatibility with the legacy library govuk_template.");
+}
+
 /// Compatibility Mode: alphagov/govuk_elements
 ///
 /// Enabling this will:
@@ -56,9 +72,17 @@ $govuk-compatibility-govuktemplate: false !default;
 ///
 /// @type Boolean
 /// @access public
+/// @deprecated Will be removed in v5.0 with the rest of the compatibility mode
+/// suite of tools and settings
 
 $govuk-compatibility-govukelements: false !default;
 
+@if $govuk-compatibility-govukelements == true {
+  @include _warning("compatibility-mode", "$govuk-compatibility-govukelements " +
+  "is deprecated. From version 5.0, GOV.UK Frontend will remove compatibility " +
+  "with the legacy library govuk_elements.");
+}
+
 /// Compatibility Product Map
 ///
 /// Maps product names to their settings that we can use to lookup states from
@@ -66,6 +90,8 @@ $govuk-compatibility-govukelements: false !default;
 ///
 /// @type Map
 /// @access private
+/// @deprecated Will be removed in v5.0 with the rest of the compatibility mode
+/// suite of tools and settings
 
 $_govuk-compatibility: (
   govuk_frontend_toolkit: $govuk-compatibility-govukfrontendtoolkit,

data/vendor/assets/stylesheets/settings/_ie8.scss

@@ -6,13 +6,29 @@
 ///
 /// @type Boolean
 /// @access public
+/// @deprecated Will be removed in v5.0
 
 $govuk-is-ie8: false !default;
 
+@if $govuk-is-ie8 == true {
+  @include _warning(
+    ie8,
+    "The $govuk-is-ie8 setting is deprecated and will be removed in v5.0."
+  );
+}
+
 /// The name of the breakpoint to use as the target when rasterizing media
 /// queries
 ///
 /// @type String
 /// @access public
+/// @deprecated Will be removed in v5.0
 
 $govuk-ie8-breakpoint: desktop !default;
+
+@if not $govuk-ie8-breakpoint == desktop {
+  @include _warning(
+    ie8,
+    "The $govuk-ie8-breakpoint setting is deprecated and will be removed in v5.0."
+  );
+}

data/vendor/assets/stylesheets/settings/_links.scss

@@ -38,12 +38,16 @@ $govuk-link-underline-thickness: unquote("max(1px, .0625rem)") !default;
 
 /// Offset of link underlines from text baseline
 ///
+/// The default is 3px expressed as ems, as calculated against the default body
+/// font size (on desktop) of 19px.
+/// 3 ÷ 19 = 0.1578
+///
 /// Set this variable to `false` to avoid setting an offset.
 ///
 /// @type Number
 /// @access public
 
-$govuk-link-underline-offset: .1em !default;
+$govuk-link-underline-offset: .1578em !default;
 
 /// Thickness of link underlines in hover state
 ///

data/vendor/assets/stylesheets/settings/_measurements.scss

@@ -19,11 +19,11 @@ $govuk-page-width: 960px !default;
 /// @access public
 
 $govuk-grid-widths: (
-  one-quarter: 25%,
-  one-third: 33.3333%,
-  one-half: 50%,
-  two-thirds: 66.6666%,
-  three-quarters: 75%,
+  one-quarter: (100% / 4),
+  one-third: (100% / 3),
+  one-half: (100% / 2),
+  two-thirds: (200% / 3),
+  three-quarters: (300% / 4),
   full: 100%
 ) !default;
 
@@ -73,16 +73,6 @@ $govuk-border-width-narrow: 4px !default;
 
 $govuk-border-width-form-element: 2px !default;
 
-/// Form control border width when in error state
-///
-/// @type Number
-/// @access public
-/// @deprecated Use $govuk-border-width-form-element instead. There should be no
-///   difference in thickness for inputs in the error state, in order to
-///   maintain a distinct focus state.
-
-$govuk-border-width-form-element-error: 2px !default;
-
 /// Form group border width when in error state
 ///
 /// @type Number

data/vendor/assets/stylesheets/settings/_spacing.scss

@@ -38,20 +38,16 @@ $govuk-spacing-points: (
 
 $govuk-spacing-responsive-scale: (
   0: (
-    null: 0,
-    tablet: 0
+    null: 0
   ),
   1: (
-    null: 5px,
-    tablet: 5px
+    null: 5px
   ),
   2: (
-    null: 10px,
-    tablet: 10px
+    null: 10px
   ),
   3: (
-    null: 15px,
-    tablet: 15px
+    null: 15px
   ),
   4: (
     null: 15px,