RubyGems - defra_ruby_template - Versions diffs - 5.4.1 → 5.11.0 - Mend

defra_ruby_template 5.4.1 → 5.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (427) hide show

data/node_modules/govuk-frontend/dist/govuk/helpers/_colour.scss CHANGED Viewed

@@ -42,25 +42,72 @@
 /// Get the colour for a government organisation
 ///
 /// @param {String} $organisation - Organisation name, lowercase, hyphenated
-/// @param {Boolean} $websafe [true] - By default a 'websafe' version of the
-///   colour will be returned which meets contrast requirements . If you want to
-///   use the non-websafe version you can set this to `false` but your should
-///   ensure that you still meets contrast requirements for accessibility - for
-///   example, do not use the non-websafe version for text.
+/// @param {Boolean} $websafe - Deprecated. Use $contrast-safe instead.
+/// @param {Boolean} $contrast-safe [true] - By default a version of the colour
+///   will be returned which has a minimum 4.5:1 contrast ratio when used with
+///   white, as per the WCAG 2.1 Level AA guidelines. If you want to use the
+///   non-contrast safe version you can set this to `false` but your should
+///   ensure that you still meets contrast requirements for accessibility -
+///   for example, do not use the non-contrast safe version for text.
 ///
 /// @return {Colour} Representation of colour for organisation
 /// @throw if `$organisation` is not a known organisation
 /// @access public
-@function govuk-organisation-colour($organisation, $websafe: true) {
+@function govuk-organisation-colour($organisation, $websafe: null, $contrast-safe: true) {
+  // Check if the $organisation exists in the aliases map. If so, change the
+  // value of $organisation to the aliased value.
+  @if map-has-key($_govuk_colours-organisations-aliases, $organisation) {
+    $organisation: map-get($_govuk_colours-organisations-aliases, $organisation);
+  }
+  // Check to see if the organisation exists
   @if not map-has-key($govuk-colours-organisations, $organisation) {
     @error "Unknown organisation `#{$organisation}`";
   }
+  // Output a deprecation warning if the legacy colour palette is being used.
+  // Remove in next major version.
+  $is-legacy: $govuk-colours-organisations == $_govuk-legacy-organisation-colours;
+  @if $is-legacy and _should-warn("legacy-organisation-colours") {
+    @warn _warning-text("legacy-organisation-colours",
+      "We've updated the organisation colour palette. Opt in to the new " +
+      "colours using `$govuk-new-organisation-colours: true`. The old " +
+      "palette is deprecated and we'll remove it in the next major version."
+    );
+  }
+  // Output a warning if $websafe is set.
+  @if $websafe and _should-warn("organisation-colour-websafe-param") {
+    @warn _warning-text("organisation-colour-websafe-param",
+      "The `$websafe` parameter of `govuk-organisation-colour` has been " +
+      "renamed to `$contrast-safe`. The old parameter name will be removed in " +
+      "the next major version."
+    );
+  }
   $org-colour: map-get($govuk-colours-organisations, $organisation);
-  @if $websafe and map-has-key($org-colour, colour-websafe) {
-    @return map-get($org-colour, colour-websafe);
+  @if map-has-key($org-colour, deprecation-message) and _should-warn("organisation-colours") {
+    @warn _warning-text(
+      "organisation-colours",
+      map-get($org-colour, deprecation-message)
+    );
+  }
+  // If the $websafe parameter is being used (it has been explicitly set as true
+  // or false), assume the user hasn't updated to use $contrast-safe yet and map
+  // the old parameter's value onto the new parameter.
+  @if type-of($websafe) != "null" {
+    $contrast-safe: $websafe;
+  }
+  // Determine the contrast-safe key to use depending on whether it's the new
+  // palette or the legacy palette
+  $safe-key: if($govuk-new-organisation-colours, "contrast-safe", "colour-websafe");
+  @if $contrast-safe and map-has-key($org-colour, $safe-key) {
+    @return map-get($org-colour, $safe-key);
   } @else {
     @return map-get($org-colour, colour);
   }

data/node_modules/govuk-frontend/dist/govuk/helpers/_colour.scss.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/govuk/helpers/_colour.scss"],"names":[],"mappings":"AAAA,qCAAqC;AACrC,2CAA2C;AAC3C,8BAA8B;;AAE9B,GAAG;AACH,wBAAwB;AACxB,GAAG;;AAEH,aAAa;AACb,EAAE;AACF,4EAA4E;AAC5E,uBAAuB;AACvB,mEAAmE;AACnE,yEAAyE;AACzE,6EAA6E;AAC7E,4BAA4B;AAC5B,kDAAkD;AAClD,EAAE;AACF,8DAA8D;AAC9D,iBAAiB;;AAEjB;EACE,iDAAiD;EACjD;IACE;;yCAEqC;EACvC;;EAEA;IACE,0EAA0E;IAC1E,4BAA4B;EAC9B;;EAEA;IACE,oCAAoC;EACtC;;EAEA,wCAAwC;AAC1C;;AAEA,+CAA+C;AAC/C,EAAE;AACF,2EAA2E;AAC3E,2EAA2E;AAC3E~~,+EAA+E;AAC/E~~,~~4EAA4E~~;~~AAC5E~~,~~8EAA8E~~;~~AAC9E~~,~~0DAA0D~~;~~AAC1D~~,EAAE;AACF,6DAA6D;AAC7D,wDAAwD;AACxD,iBAAiB;;AAEjB;EACE;IACE,gDAAgD;EAClD;;EAEA,iEAAiE;;EAEjE;IACE,~~4CAA4C~~;~~EAC9C~~,EAAE;IACA,oCAAoC;EACtC;AACF;;AAEA,+CAA+C;AAC/C,EAAE;AACF,4CAA4C;AAC5C,wEAAwE;AACxE,mBAAmB;AACnB,iBAAiB;;AAEjB;EACE,0CAA0C;AAC5C;;AAEA,gDAAgD;AAChD,EAAE;AACF,2CAA2C;AAC3C,wEAAwE;AACxE,mBAAmB;AACnB,iBAAiB;;AAEjB;EACE,wDAAwD;AAC1D","file":"_colour.scss","sourcesContent":["@import \"../settings/colours-palette\";\n@import \"../settings/colours-organisations\";\n@import \"../settings/warnings\";\n\n////\n/// @group helpers/colour\n////\n\n/// Get colour\n///\n/// @param {String \| Colour} $colour - Name of colour from the colour palette\n/// (`$govuk-colours`)\n/// @param {String \| Colour \| Boolean} $legacy [false] - Deprecated.\n/// The `$legacy` parameter is deprecated and is non-operational, as the\n/// legacy colour palette has been removed. The parameter will be removed in\n/// the next major version.\n/// @return {Colour} Representation of named colour\n///\n/// @throw if `$colour` is not a colour from the colour palette\n/// @access public\n\n@function govuk-colour($colour, $legacy: false) {\n // Output a warning if $legacy is set to anything.\n @if $legacy and _should-warn(\"legacy-colour-param\") {\n @warn _warning-text(\"legacy-colour-param\", \"The `$legacy` parameter of \" +\n \"`govuk-colour` is deprecated and is non-operational. It will be \" +\n \"removed in the next major version.\");\n }\n\n @if type-of($colour) == \"color\" {\n // stylelint-disable-next-line scss/function-quote-no-quoted-strings-inside\n $colour: quote(\"#{$colour}\");\n }\n\n @if not map-has-key($govuk-colours, $colour) {\n @error \"Unknown colour `#{$colour}`\";\n }\n\n @return map-get($govuk-colours, $colour);\n}\n\n/// Get the colour for a government organisation\n///\n/// @param {String} $organisation - Organisation name, lowercase, hyphenated\n/// @param {Boolean} $websafe [true] - By default a ~~'websafe'~~ version of the\n/// ~~colour~~ will be returned which ~~meets~~ contrast ~~requirements~~ . If you want to\n/// ~~use the~~ non-~~websafe~~ version you can set this to `false` but your should\n/// ensure that you still meets contrast requirements for accessibility ~~- for\~~n/// example, do not use the non-~~websafe~~ version for text.\n///\n/// @return {Colour} Representation of colour for organisation\n/// @throw if `$organisation` is not a known organisation\n/// @access public\n\n@function govuk-organisation-colour($organisation, $websafe: true) {\n @if not map-has-key($govuk-colours-organisations, $organisation) {\n @error \"Unknown organisation `#{$organisation}`\";\n }\n\n $org-colour: map-get($govuk-colours-organisations, $organisation);\n\n @if $websafe and map-has-key($org-colour, ~~colour~~-~~websafe~~) {\n @return map-get($org-colour, ~~colour~~-~~websafe~~);\n } @else {\n @return map-get($org-colour, colour);\n }\n}\n\n/// Make a colour darker by mixing it with black\n///\n/// @param {Colour} $colour - colour to shade\n/// @param {Number} $percentage - percentage of black to mix with $colour\n/// @return {Colour}\n/// @access public\n\n@function govuk-shade($colour, $percentage) {\n @return mix(#000000, $colour, $percentage);\n}\n\n/// Make a colour lighter by mixing it with white\n///\n/// @param {Colour} $colour - colour to tint\n/// @param {Number} $percentage - percentage of white to mix with $colour\n/// @return {Colour}\n/// @access public\n\n@function govuk-tint($colour, $percentage) {\n @return mix(govuk-colour(\"white\"), $colour, $percentage);\n}\n"]}
1	+ {"version":3,"sources":["../../../src/govuk/helpers/_colour.scss"],"names":[],"mappings":"AAAA,qCAAqC;AACrC,2CAA2C;AAC3C,8BAA8B;;AAE9B,GAAG;AACH,wBAAwB;AACxB,GAAG;;AAEH,aAAa;AACb,EAAE;AACF,4EAA4E;AAC5E,uBAAuB;AACvB,mEAAmE;AACnE,yEAAyE;AACzE,6EAA6E;AAC7E,4BAA4B;AAC5B,kDAAkD;AAClD,EAAE;AACF,8DAA8D;AAC9D,iBAAiB;;AAEjB;EACE,iDAAiD;EACjD;IACE;;yCAEqC;EACvC;;EAEA;IACE,0EAA0E;IAC1E,4BAA4B;EAC9B;;EAEA;IACE,oCAAoC;EACtC;;EAEA,wCAAwC;AAC1C;;AAEA,+CAA+C;AAC/C,EAAE;AACF,2EAA2E;AAC3E,sEAAsE;AACtE,8EAA8E;AAC9E,6EAA6E;AAC7E,2EAA2E;AAC3E,0EAA0E;AAC1E,0EAA0E;AAC1E,oEAAoE;AACpE,EAAE;AACF,6DAA6D;AAC7D,wDAAwD;AACxD,iBAAiB;;AAEjB;EACE,yEAAyE;EACzE,8CAA8C;EAC9C;IACE,4EAA4E;EAC9E;;EAEA,yCAAyC;EACzC;IACE,gDAAgD;EAClD;;EAEA,0EAA0E;EAC1E,+BAA+B;EAC/B,+EAA+E;EAC/E;IACE;;;;KAIC;EACH;;EAEA,sCAAsC;EACtC;IACE;;;;KAIC;EACH;;EAEA,iEAAiE;;EAEjE;IACE;;;KAGC;EACH;;EAEA,6EAA6E;EAC7E,6EAA6E;EAC7E,mDAAmD;EACnD;IACE,wBAAwB;EAC1B;;EAEA,0EAA0E;EAC1E,+BAA+B;EAC/B,iFAAiF;;EAEjF;IACE,uCAAuC;EACzC,EAAE;IACA,oCAAoC;EACtC;AACF;;AAEA,+CAA+C;AAC/C,EAAE;AACF,4CAA4C;AAC5C,wEAAwE;AACxE,mBAAmB;AACnB,iBAAiB;;AAEjB;EACE,0CAA0C;AAC5C;;AAEA,gDAAgD;AAChD,EAAE;AACF,2CAA2C;AAC3C,wEAAwE;AACxE,mBAAmB;AACnB,iBAAiB;;AAEjB;EACE,wDAAwD;AAC1D","file":"_colour.scss","sourcesContent":["@import \"../settings/colours-palette\";\n@import \"../settings/colours-organisations\";\n@import \"../settings/warnings\";\n\n////\n/// @group helpers/colour\n////\n\n/// Get colour\n///\n/// @param {String \| Colour} $colour - Name of colour from the colour palette\n/// (`$govuk-colours`)\n/// @param {String \| Colour \| Boolean} $legacy [false] - Deprecated.\n/// The `$legacy` parameter is deprecated and is non-operational, as the\n/// legacy colour palette has been removed. The parameter will be removed in\n/// the next major version.\n/// @return {Colour} Representation of named colour\n///\n/// @throw if `$colour` is not a colour from the colour palette\n/// @access public\n\n@function govuk-colour($colour, $legacy: false) {\n // Output a warning if $legacy is set to anything.\n @if $legacy and _should-warn(\"legacy-colour-param\") {\n @warn _warning-text(\"legacy-colour-param\", \"The `$legacy` parameter of \" +\n \"`govuk-colour` is deprecated and is non-operational. It will be \" +\n \"removed in the next major version.\");\n }\n\n @if type-of($colour) == \"color\" {\n // stylelint-disable-next-line scss/function-quote-no-quoted-strings-inside\n $colour: quote(\"#{$colour}\");\n }\n\n @if not map-has-key($govuk-colours, $colour) {\n @error \"Unknown colour `#{$colour}`\";\n }\n\n @return map-get($govuk-colours, $colour);\n}\n\n/// Get the colour for a government organisation\n///\n/// @param {String} $organisation - Organisation name, lowercase, hyphenated\n/// @param {Boolean} $websafe - Deprecated. Use $contrast-safe instead.\n/// @param {Boolean} $contrast-safe [true] - By default a version of the colour\n/// will be returned which has a minimum 4.5:1 contrast ratio when used with\n/// white, as per the WCAG 2.1 Level AA guidelines. If you want to use the\n/// non-contrast safe version you can set this to `false` but your should\n/// ensure that you still meets contrast requirements for accessibility -\n/// for example, do not use the non-contrast safe version for text.\n///\n/// @return {Colour} Representation of colour for organisation\n/// @throw if `$organisation` is not a known organisation\n/// @access public\n\n@function govuk-organisation-colour($organisation, $websafe: null, $contrast-safe: true) {\n // Check if the $organisation exists in the aliases map. If so, change the\n // value of $organisation to the aliased value.\n @if map-has-key($_govuk_colours-organisations-aliases, $organisation) {\n $organisation: map-get($_govuk_colours-organisations-aliases, $organisation);\n }\n\n // Check to see if the organisation exists\n @if not map-has-key($govuk-colours-organisations, $organisation) {\n @error \"Unknown organisation `#{$organisation}`\";\n }\n\n // Output a deprecation warning if the legacy colour palette is being used.\n // Remove in next major version.\n $is-legacy: $govuk-colours-organisations == $_govuk-legacy-organisation-colours;\n @if $is-legacy and _should-warn(\"legacy-organisation-colours\") {\n @warn _warning-text(\"legacy-organisation-colours\",\n \"We've updated the organisation colour palette. Opt in to the new \" +\n \"colours using `$govuk-new-organisation-colours: true`. The old \" +\n \"palette is deprecated and we'll remove it in the next major version.\"\n );\n }\n\n // Output a warning if $websafe is set.\n @if $websafe and _should-warn(\"organisation-colour-websafe-param\") {\n @warn _warning-text(\"organisation-colour-websafe-param\",\n \"The `$websafe` parameter of `govuk-organisation-colour` has been \" +\n \"renamed to `$contrast-safe`. The old parameter name will be removed in \" +\n \"the next major version.\"\n );\n }\n\n $org-colour: map-get($govuk-colours-organisations, $organisation);\n\n @if map-has-key($org-colour, deprecation-message) and _should-warn(\"organisation-colours\") {\n @warn _warning-text(\n \"organisation-colours\",\n map-get($org-colour, deprecation-message)\n );\n }\n\n // If the $websafe parameter is being used (it has been explicitly set as true\n // or false), assume the user hasn't updated to use $contrast-safe yet and map\n // the old parameter's value onto the new parameter.\n @if type-of($websafe) != \"null\" {\n $contrast-safe: $websafe;\n }\n\n // Determine the contrast-safe key to use depending on whether it's the new\n // palette or the legacy palette\n $safe-key: if($govuk-new-organisation-colours, \"contrast-safe\", \"colour-websafe\");\n\n @if $contrast-safe and map-has-key($org-colour, $safe-key) {\n @return map-get($org-colour, $safe-key);\n } @else {\n @return map-get($org-colour, colour);\n }\n}\n\n/// Make a colour darker by mixing it with black\n///\n/// @param {Colour} $colour - colour to shade\n/// @param {Number} $percentage - percentage of black to mix with $colour\n/// @return {Colour}\n/// @access public\n\n@function govuk-shade($colour, $percentage) {\n @return mix(#000000, $colour, $percentage);\n}\n\n/// Make a colour lighter by mixing it with white\n///\n/// @param {Colour} $colour - colour to tint\n/// @param {Number} $percentage - percentage of white to mix with $colour\n/// @return {Colour}\n/// @access public\n\n@function govuk-tint($colour, $percentage) {\n @return mix(govuk-colour(\"white\"), $colour, $percentage);\n}\n"]}

data/node_modules/govuk-frontend/dist/govuk/helpers/_focused.scss CHANGED Viewed

@@ -24,10 +24,20 @@
   // box shadow adds the "underline"
   text-decoration: none;
-  // When a focused box is broken by e.g. a line break, ensure that the
-  // box-shadow is applied to each fragment independently.
-  -webkit-box-decoration-break: clone;
-          box-decoration-break: clone;
+  // Fixes an issue in Chromium 108–111 where the box-shadow on the focus state
+  // is missing on links that wrap across multiple lines [1].
+  //
+  // However, text-wrap: balance doesn't play nicely with box-decoration-break:
+  // clone, causing links to re-flow when focused [2]. As text-wrap: balance
+  // wasn't introduced until Chromium 114 we can use it as a way to target
+  // this fix to just 108–111.
+  //
+  // [1]: http://crbug.com/40884971
+  // [2]: https://github.com/alphagov/govuk-frontend/issues/5878
+  @supports not (text-wrap: balance) {
+    -webkit-box-decoration-break: clone;
+            box-decoration-break: clone;
+  }
 }
 /// Focused box

data/node_modules/govuk-frontend/dist/govuk/helpers/_focused.scss.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/govuk/helpers/_focused.scss"],"names":[],"mappings":"AAAA,GAAG;AACH,+BAA+B;AAC/B,GAAG;;AAEH,eAAe;AACf,EAAE;AACF,8EAA8E;AAC9E,4CAA4C;AAC5C,EAAE;AACF,iBAAiB;;AAEjB;EACE,uEAAuE;EACvE,uEAAuE;EACvE,4DAA4D;;EAE5D,6CAA6C;EAC7C,+BAA+B;EAC/B,qCAAqC;EACrC;;kCAEgC;EAChC,6DAA6D;EAC7D,iCAAiC;EACjC,qBAAqB;;EAErB,~~oEAAoE~~;~~EACpE~~,~~uDAAuD~~;~~EACvD~~,mCAA2B;~~UAA3B~~,2BAA2B;~~AAC7B~~;;AAEA,cAAc;AACd,EAAE;AACF,8EAA8E;AAC9E,8EAA8E;AAC9E,sEAAsE;AACtE,yDAAyD;AACzD,EAAE;AACF,iBAAiB;;AAEjB;EACE,6CAA6C;EAC7C;;sCAEoC;AACtC","file":"_focused.scss","sourcesContent":["////\n/// @group helpers/accessibility\n////\n\n/// Focused text\n///\n/// Provides an outline to clearly indicate when the target element is focused.\n/// Used for interactive text-based elements.\n///\n/// @access public\n\n@mixin govuk-focused-text {\n // When colours are overridden, for example when users have a dark mode,\n // backgrounds and box-shadows disappear, so we need to ensure there's a\n // transparent outline which will be set to a visible colour.\n\n outline: $govuk-focus-width solid transparent;\n color: $govuk-focus-text-colour;\n background-color: $govuk-focus-colour;\n box-shadow:\n 0 -2px $govuk-focus-colour,\n 0 4px $govuk-focus-text-colour;\n // When link is focussed, hide the default underline since the\n // box shadow adds the \"underline\"\n text-decoration: none;\n\n // ~~When~~ a ~~focused~~ box is ~~broken~~ by ~~e.g.~~ a ~~line~~ break, ~~ensure~~ ~~that~~ ~~the~~\n // ~~box-shadow~~ is ~~applied~~ to ~~each~~ ~~fragment~~ ~~independently~~.\n box-decoration-break: clone;\n}\n\n/// Focused box\n///\n/// Provides an outline to clearly indicate when the target element is focused.\n/// Unlike govuk-focused-text, which only draws an underline below the element,\n/// govuk-focused-box draws an outline around all sides of the element.\n/// Best used for non-text content contained within links.\n///\n/// @access public\n\n@mixin govuk-focused-box {\n outline: $govuk-focus-width solid transparent;\n box-shadow:\n 0 0 0 4px $govuk-focus-colour,\n 0 0 0 8px $govuk-focus-text-colour;\n}\n"]}
1	+ {"version":3,"sources":["../../../src/govuk/helpers/_focused.scss"],"names":[],"mappings":"AAAA,GAAG;AACH,+BAA+B;AAC/B,GAAG;;AAEH,eAAe;AACf,EAAE;AACF,8EAA8E;AAC9E,4CAA4C;AAC5C,EAAE;AACF,iBAAiB;;AAEjB;EACE,uEAAuE;EACvE,uEAAuE;EACvE,4DAA4D;;EAE5D,6CAA6C;EAC7C,+BAA+B;EAC/B,qCAAqC;EACrC;;kCAEgC;EAChC,6DAA6D;EAC7D,iCAAiC;EACjC,qBAAqB;;EAErB,4EAA4E;EAC5E,0DAA0D;EAC1D,CAAC;EACD,4EAA4E;EAC5E,yEAAyE;EACzE,uEAAuE;EACvE,2BAA2B;EAC3B,CAAC;EACD,gCAAgC;EAChC,6DAA6D;EAC7D;IACE,mCAA2B;YAA3B,2BAA2B;EAC7B;AACF;;AAEA,cAAc;AACd,EAAE;AACF,8EAA8E;AAC9E,8EAA8E;AAC9E,sEAAsE;AACtE,yDAAyD;AACzD,EAAE;AACF,iBAAiB;;AAEjB;EACE,6CAA6C;EAC7C;;sCAEoC;AACtC","file":"_focused.scss","sourcesContent":["////\n/// @group helpers/accessibility\n////\n\n/// Focused text\n///\n/// Provides an outline to clearly indicate when the target element is focused.\n/// Used for interactive text-based elements.\n///\n/// @access public\n\n@mixin govuk-focused-text {\n // When colours are overridden, for example when users have a dark mode,\n // backgrounds and box-shadows disappear, so we need to ensure there's a\n // transparent outline which will be set to a visible colour.\n\n outline: $govuk-focus-width solid transparent;\n color: $govuk-focus-text-colour;\n background-color: $govuk-focus-colour;\n box-shadow:\n 0 -2px $govuk-focus-colour,\n 0 4px $govuk-focus-text-colour;\n // When link is focussed, hide the default underline since the\n // box shadow adds the \"underline\"\n text-decoration: none;\n\n // Fixes an issue in Chromium 108–111 where the box-shadow on the focus state\n // is missing on links that wrap across multiple lines [1].\n //\n // However, text-wrap: balance doesn't play nicely with box-decoration-break:\n // clone, causing links to re-flow when focused [2]. As text-wrap: balance\n // wasn't introduced until Chromium 114 we can use it as a way to target\n // this fix to just 108–111.\n //\n // [1]: http://crbug.com/40884971\n // [2]: https://github.com/alphagov/govuk-frontend/issues/5878\n @supports not (text-wrap: balance) {\n box-decoration-break: clone;\n }\n}\n\n/// Focused box\n///\n/// Provides an outline to clearly indicate when the target element is focused.\n/// Unlike govuk-focused-text, which only draws an underline below the element,\n/// govuk-focused-box draws an outline around all sides of the element.\n/// Best used for non-text content contained within links.\n///\n/// @access public\n\n@mixin govuk-focused-box {\n outline: $govuk-focus-width solid transparent;\n box-shadow:\n 0 0 0 4px $govuk-focus-colour,\n 0 0 0 8px $govuk-focus-text-colour;\n}\n"]}

data/node_modules/govuk-frontend/dist/govuk/helpers/_grid.scss CHANGED Viewed

@@ -37,7 +37,7 @@
 ///   }
 ///
 /// @example scss - Customising the breakpoint where width percentage is applied
-///   .govuk-grid-column-one-half-at-desktop {
+///   .govuk-grid-column-one-half-from-desktop {
 ///     @include govuk-grid-column(one-half, $at: desktop);
 ///   }
 ///

data/node_modules/govuk-frontend/dist/govuk/helpers/_grid.scss.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/govuk/helpers/_grid.scss"],"names":[],"mappings":"AAAA,GAAG;AACH,wBAAwB;AACxB,GAAG;;AAEH,wBAAwB;AACxB,EAAE;AACF,8DAA8D;AAC9D,oCAAoC;AACpC,6CAA6C;AAC7C,iBAAiB;;AAEjB;EACE;IACE,yCAAyC;EAC3C;;EAEA,qCAAqC;AACvC;;AAEA,8BAA8B;AAC9B,EAAE;AACF,kEAAkE;AAClE,EAAE;AACF,2DAA2D;AAC3D,EAAE;AACF,0EAA0E;AAC1E,8EAA8E;AAC9E,aAAa;AACb,EAAE;AACF,6EAA6E;AAC7E,6CAA6C;AAC7C,mFAAmF;AACnF,EAAE;AACF,0BAA0B;AAC1B,oCAAoC;AACpC,6CAA6C;AAC7C,MAAM;AACN,EAAE;AACF,+EAA+E;AAC/E~~,6CAA6C~~;~~AAC7C~~,0DAA0D;AAC1D,MAAM;AACN,EAAE;AACF,kDAAkD;AAClD,wCAAwC;AACxC,6DAA6D;AAC7D,MAAM;AACN,EAAE;AACF,iBAAiB;;AAEjB;EACE,sBAAsB;EACtB;IACE,WAAW;EACb;EACA,6BAA6B;EAC7B;IACE,+BAA+B;IAC/B,aAAa;EACf;AACF","file":"_grid.scss","sourcesContent":["////\n/// @group helpers/layout\n////\n\n/// Grid width percentage\n///\n/// @param {String} $key - Name of grid width (e.g. two-thirds)\n/// @return {Number} Percentage width\n/// @throw if `$key` is not a valid grid width\n/// @access public\n\n@function govuk-grid-width($key) {\n @if map-has-key($govuk-grid-widths, $key) {\n @return map-get($govuk-grid-widths, $key);\n }\n\n @error \"Unknown grid width `#{$key}`\";\n}\n\n/// Generate grid column styles\n///\n/// Creates a grid column with standard gutter between the columns.\n///\n/// Grid widths are defined in the `$govuk-grid-widths` map.\n///\n/// By default the column width changes from 100% to specified width at the\n/// 'tablet' breakpoint, but other breakpoints can be specified using the `$at`\n/// parameter.\n///\n/// @param {String} $width [full] name of a grid width from $govuk-grid-widths\n/// @param {String} $float [left] left \| right\n/// @param {String} $at [tablet] - mobile \| tablet \| desktop \| any custom breakpoint\n///\n/// @example scss - Default\n/// .govuk-grid-column-two-thirds {\n/// @include govuk-grid-column(two-thirds)\n/// }\n///\n/// @example scss - Customising the breakpoint where width percentage is applied\n/// .govuk-grid-column-one-half-at-desktop {\n/// @include govuk-grid-column(one-half, $at: desktop);\n/// }\n///\n/// @example scss - Customising the float direction\n/// .govuk-grid-column-one-half-right {\n/// @include govuk-grid-column(two-thirds, $float: right);\n/// }\n///\n/// @access public\n\n@mixin govuk-grid-column($width: full, $float: left, $at: tablet) {\n box-sizing: border-box;\n @if $at != desktop {\n width: 100%;\n }\n padding: 0 $govuk-gutter-half;\n @include govuk-media-query($from: $at) {\n width: govuk-grid-width($width);\n float: $float;\n }\n}\n"]}
1	+ {"version":3,"sources":["../../../src/govuk/helpers/_grid.scss"],"names":[],"mappings":"AAAA,GAAG;AACH,wBAAwB;AACxB,GAAG;;AAEH,wBAAwB;AACxB,EAAE;AACF,8DAA8D;AAC9D,oCAAoC;AACpC,6CAA6C;AAC7C,iBAAiB;;AAEjB;EACE;IACE,yCAAyC;EAC3C;;EAEA,qCAAqC;AACvC;;AAEA,8BAA8B;AAC9B,EAAE;AACF,kEAAkE;AAClE,EAAE;AACF,2DAA2D;AAC3D,EAAE;AACF,0EAA0E;AAC1E,8EAA8E;AAC9E,aAAa;AACb,EAAE;AACF,6EAA6E;AAC7E,6CAA6C;AAC7C,mFAAmF;AACnF,EAAE;AACF,0BAA0B;AAC1B,oCAAoC;AACpC,6CAA6C;AAC7C,MAAM;AACN,EAAE;AACF,+EAA+E;AAC/E,+CAA+C;AAC/C,0DAA0D;AAC1D,MAAM;AACN,EAAE;AACF,kDAAkD;AAClD,wCAAwC;AACxC,6DAA6D;AAC7D,MAAM;AACN,EAAE;AACF,iBAAiB;;AAEjB;EACE,sBAAsB;EACtB;IACE,WAAW;EACb;EACA,6BAA6B;EAC7B;IACE,+BAA+B;IAC/B,aAAa;EACf;AACF","file":"_grid.scss","sourcesContent":["////\n/// @group helpers/layout\n////\n\n/// Grid width percentage\n///\n/// @param {String} $key - Name of grid width (e.g. two-thirds)\n/// @return {Number} Percentage width\n/// @throw if `$key` is not a valid grid width\n/// @access public\n\n@function govuk-grid-width($key) {\n @if map-has-key($govuk-grid-widths, $key) {\n @return map-get($govuk-grid-widths, $key);\n }\n\n @error \"Unknown grid width `#{$key}`\";\n}\n\n/// Generate grid column styles\n///\n/// Creates a grid column with standard gutter between the columns.\n///\n/// Grid widths are defined in the `$govuk-grid-widths` map.\n///\n/// By default the column width changes from 100% to specified width at the\n/// 'tablet' breakpoint, but other breakpoints can be specified using the `$at`\n/// parameter.\n///\n/// @param {String} $width [full] name of a grid width from $govuk-grid-widths\n/// @param {String} $float [left] left \| right\n/// @param {String} $at [tablet] - mobile \| tablet \| desktop \| any custom breakpoint\n///\n/// @example scss - Default\n/// .govuk-grid-column-two-thirds {\n/// @include govuk-grid-column(two-thirds)\n/// }\n///\n/// @example scss - Customising the breakpoint where width percentage is applied\n/// .govuk-grid-column-one-half-from-desktop {\n/// @include govuk-grid-column(one-half, $at: desktop);\n/// }\n///\n/// @example scss - Customising the float direction\n/// .govuk-grid-column-one-half-right {\n/// @include govuk-grid-column(two-thirds, $float: right);\n/// }\n///\n/// @access public\n\n@mixin govuk-grid-column($width: full, $float: left, $at: tablet) {\n box-sizing: border-box;\n @if $at != desktop {\n width: 100%;\n }\n padding: 0 $govuk-gutter-half;\n @include govuk-media-query($from: $at) {\n width: govuk-grid-width($width);\n float: $float;\n }\n}\n"]}

data/node_modules/govuk-frontend/dist/govuk/helpers/_links.scss CHANGED Viewed

@@ -229,7 +229,7 @@
   }
   // Force a colour change on hover to work around a bug in Safari
-  // https://bugs.webkit.org/show_bug.cgi?id=224483
+  // https://webkit.org/b/224483
   &:hover {
     @if type-of($govuk-text-colour) == color {
       color: rgba($govuk-text-colour, 0.99);
@@ -265,7 +265,7 @@
   }
   // Force a colour change on hover to work around a bug in Safari
-  // https://bugs.webkit.org/show_bug.cgi?id=224483
+  // https://webkit.org/b/224483
   &:hover,
   &:active {
     color: rgba(govuk-colour("white"), 0.99);

data/node_modules/govuk-frontend/dist/govuk/helpers/_links.scss.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/govuk/helpers/_links.scss"],"names":[],"mappings":"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","file":"_links.scss","sourcesContent":["////\n/// @group helpers/links\n////\n\n/// Common link styles\n///\n/// Provides the typography and focus state, regardless of link style.\n///\n/// @access public\n\n@mixin govuk-link-common {\n @include govuk-typography-common;\n @include govuk-link-decoration;\n\n &:hover {\n @include govuk-link-hover-decoration;\n }\n\n &:focus {\n @include govuk-focused-text;\n }\n}\n\n/// Link decoration\n///\n/// Provides the text decoration for links, including thickness and underline\n/// offset. Use this mixin only if you cannot use the `govuk-link-common` mixin.\n///\n/// @access public\n@mixin govuk-link-decoration {\n text-decoration: underline;\n\n @if $govuk-link-underline-thickness {\n text-decoration-thickness: $govuk-link-underline-thickness;\n }\n\n @if $govuk-link-underline-offset {\n text-underline-offset: $govuk-link-underline-offset;\n }\n}\n\n/// Link hover decoration\n///\n/// Provides the text decoration for links in their hover state, for you to use\n/// within a `:hover` pseudo-selector. Use this mixin only if you cannot use the\n/// `govuk-link-common` mixin.\n///\n/// @access public\n\n@mixin govuk-link-hover-decoration {\n @if $govuk-link-hover-underline-thickness {\n text-decoration-thickness: $govuk-link-hover-underline-thickness;\n // Disable ink skipping on underlines on hover. Browsers haven't\n // standardised on this part of the spec yet, so set both properties\n text-decoration-skip-ink: none; // Chromium, Firefox\n text-decoration-skip: none; // Safari\n }\n}\n\n/// Default link styles\n///\n/// Makes links use the default unvisited, visited, hover and active colours.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-default;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-default {\n &:link {\n color: $govuk-link-colour;\n }\n\n &:visited {\n color: $govuk-link-visited-colour;\n }\n\n &:hover {\n color: $govuk-link-hover-colour;\n }\n\n &:active {\n color: $govuk-link-active-colour;\n }\n\n // When focussed, the text colour needs to be darker to ensure that colour\n // contrast is still acceptable\n &:focus {\n color: $govuk-focus-text-colour;\n }\n}\n\n/// Error link styles\n///\n/// Makes links use the error colour. The link will darken if it's active or a\n/// user hovers their cursor over it.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-error;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-error {\n &:link,\n &:visited {\n color: $govuk-error-colour;\n }\n\n &:hover {\n color: scale-color($govuk-error-colour, $lightness: -30%);\n }\n\n &:active {\n color: $govuk-error-colour;\n }\n\n // When focussed, the text colour needs to be darker to ensure that colour\n // contrast is still acceptable\n &:focus {\n color: $govuk-focus-text-colour;\n }\n}\n\n/// Success link styles\n///\n/// Makes links use the success colour. The link will darken if it's active or a\n/// user hovers their cursor over it.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-success;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-success {\n &:link,\n &:visited {\n color: $govuk-success-colour;\n }\n\n &:hover {\n color: scale-color($govuk-success-colour, $lightness: -30%);\n }\n\n &:active {\n color: $govuk-success-colour;\n }\n\n // When focussed, the text colour needs to be darker to ensure that colour\n // contrast is still acceptable\n &:focus {\n color: $govuk-focus-text-colour;\n }\n}\n\n/// Muted link styles\n///\n/// Makes links use the secondary text colour. The link will darken if it's\n/// active or a user hovers their cursor over it.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-muted;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-muted {\n &:link,\n &:visited {\n color: $govuk-secondary-text-colour;\n }\n\n &:hover,\n &:active {\n color: $govuk-text-colour;\n }\n\n // When focussed, the text colour needs to be darker to ensure that colour\n // contrast is still acceptable\n &:focus {\n color: $govuk-focus-text-colour;\n }\n}\n\n/// Text link styles\n///\n/// Makes links use the primary text colour, in all states. Use this mixin for\n/// navigation components, such as breadcrumbs or the back link.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-text;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-text {\n &:link,\n &:visited {\n @include govuk-text-colour;\n }\n\n // Force a colour change on hover to work around a bug in Safari\n // https://bugs.webkit.org/show_bug.cgi?id=224483\n &:hover {\n @if type-of($govuk-text-colour) == color {\n color: rgba($govuk-text-colour, 0.99);\n }\n }\n\n &:active,\n &:focus {\n @include govuk-text-colour;\n }\n}\n\n/// Inverse link styles\n///\n/// Makes links white, in all states. Use this mixin if you're displaying links\n/// against a dark background.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-inverse;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-inverse {\n &:link,\n &:visited {\n color: govuk-colour(\"white\");\n }\n\n // Force a colour change on hover to work around a bug in Safari\n // https://bugs.webkit.org/show_bug.cgi?id=224483\n &:hover,\n &:active {\n color: rgba(govuk-colour(\"white\"), 0.99);\n }\n\n &:focus {\n color: $govuk-focus-text-colour;\n }\n}\n\n/// Default link styles, without a visited state\n///\n/// Makes links use the default unvisited, hover and active colours, with no\n/// distinct visited state.\n///\n/// Use this mixin when it's not helpful to distinguish between visited and\n/// non-visited links. For example, when you link to pages with\n/// frequently-changing content, such as the dashboard for an admin interface.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-no-visited-state;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-no-visited-state {\n &:link {\n color: $govuk-link-colour;\n }\n\n &:visited {\n color: $govuk-link-colour;\n }\n\n &:hover {\n color: $govuk-link-hover-colour;\n }\n\n &:active {\n color: $govuk-link-active-colour;\n }\n\n // When focussed, the text colour needs to be darker to ensure that colour\n // contrast is still acceptable\n &:focus {\n color: $govuk-focus-text-colour;\n }\n}\n\n/// Remove underline from links\n///\n/// Remove underlines from links unless the link is active or a user hovers\n/// their cursor over it.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-default;\n/// @include govuk-link-style-no-underline;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-no-underline {\n &:not(:hover):not(:active) {\n text-decoration: none;\n }\n}\n\n/// Include link destination when printing the page\n///\n/// If the user prints the page, add the destination URL after the link text, if\n/// the URL starts with `/`, `http://` or `https://`.\n///\n/// @access public\n\n@mixin govuk-link-print-friendly {\n @include govuk-media-query($media-type: print) {\n &[href^=\"/\"],\n &[href^=\"http://\"],\n &[href^=\"https://\"]\n {\n &::after {\n content: \" (\" attr(href) \")\";\n font-size: 90%;\n\n // Because the URLs may be very long, ensure that they may be broken\n // at arbitrary points if there are no otherwise acceptable break\n // points in the line\n word-wrap: break-word;\n }\n }\n }\n}\n\n/// Image link styles\n///\n/// Prepares and provides the focus state for links that only contain images\n/// with no accompanying text.\n///\n/// @access public\n\n@mixin govuk-link-image {\n // Needed to draw the focus around the entire image\n display: inline-block;\n\n // Remove extra space at the bottom of the image that's added by line-height\n line-height: 0;\n\n // Don't render an underline\n text-decoration: none;\n\n &:focus {\n @include govuk-focused-box;\n }\n}\n"]}
1	+ {"version":3,"sources":["../../../src/govuk/helpers/_links.scss"],"names":[],"mappings":"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","file":"_links.scss","sourcesContent":["////\n/// @group helpers/links\n////\n\n/// Common link styles\n///\n/// Provides the typography and focus state, regardless of link style.\n///\n/// @access public\n\n@mixin govuk-link-common {\n @include govuk-typography-common;\n @include govuk-link-decoration;\n\n &:hover {\n @include govuk-link-hover-decoration;\n }\n\n &:focus {\n @include govuk-focused-text;\n }\n}\n\n/// Link decoration\n///\n/// Provides the text decoration for links, including thickness and underline\n/// offset. Use this mixin only if you cannot use the `govuk-link-common` mixin.\n///\n/// @access public\n@mixin govuk-link-decoration {\n text-decoration: underline;\n\n @if $govuk-link-underline-thickness {\n text-decoration-thickness: $govuk-link-underline-thickness;\n }\n\n @if $govuk-link-underline-offset {\n text-underline-offset: $govuk-link-underline-offset;\n }\n}\n\n/// Link hover decoration\n///\n/// Provides the text decoration for links in their hover state, for you to use\n/// within a `:hover` pseudo-selector. Use this mixin only if you cannot use the\n/// `govuk-link-common` mixin.\n///\n/// @access public\n\n@mixin govuk-link-hover-decoration {\n @if $govuk-link-hover-underline-thickness {\n text-decoration-thickness: $govuk-link-hover-underline-thickness;\n // Disable ink skipping on underlines on hover. Browsers haven't\n // standardised on this part of the spec yet, so set both properties\n text-decoration-skip-ink: none; // Chromium, Firefox\n text-decoration-skip: none; // Safari\n }\n}\n\n/// Default link styles\n///\n/// Makes links use the default unvisited, visited, hover and active colours.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-default;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-default {\n &:link {\n color: $govuk-link-colour;\n }\n\n &:visited {\n color: $govuk-link-visited-colour;\n }\n\n &:hover {\n color: $govuk-link-hover-colour;\n }\n\n &:active {\n color: $govuk-link-active-colour;\n }\n\n // When focussed, the text colour needs to be darker to ensure that colour\n // contrast is still acceptable\n &:focus {\n color: $govuk-focus-text-colour;\n }\n}\n\n/// Error link styles\n///\n/// Makes links use the error colour. The link will darken if it's active or a\n/// user hovers their cursor over it.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-error;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-error {\n &:link,\n &:visited {\n color: $govuk-error-colour;\n }\n\n &:hover {\n color: scale-color($govuk-error-colour, $lightness: -30%);\n }\n\n &:active {\n color: $govuk-error-colour;\n }\n\n // When focussed, the text colour needs to be darker to ensure that colour\n // contrast is still acceptable\n &:focus {\n color: $govuk-focus-text-colour;\n }\n}\n\n/// Success link styles\n///\n/// Makes links use the success colour. The link will darken if it's active or a\n/// user hovers their cursor over it.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-success;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-success {\n &:link,\n &:visited {\n color: $govuk-success-colour;\n }\n\n &:hover {\n color: scale-color($govuk-success-colour, $lightness: -30%);\n }\n\n &:active {\n color: $govuk-success-colour;\n }\n\n // When focussed, the text colour needs to be darker to ensure that colour\n // contrast is still acceptable\n &:focus {\n color: $govuk-focus-text-colour;\n }\n}\n\n/// Muted link styles\n///\n/// Makes links use the secondary text colour. The link will darken if it's\n/// active or a user hovers their cursor over it.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-muted;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-muted {\n &:link,\n &:visited {\n color: $govuk-secondary-text-colour;\n }\n\n &:hover,\n &:active {\n color: $govuk-text-colour;\n }\n\n // When focussed, the text colour needs to be darker to ensure that colour\n // contrast is still acceptable\n &:focus {\n color: $govuk-focus-text-colour;\n }\n}\n\n/// Text link styles\n///\n/// Makes links use the primary text colour, in all states. Use this mixin for\n/// navigation components, such as breadcrumbs or the back link.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-text;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-text {\n &:link,\n &:visited {\n @include govuk-text-colour;\n }\n\n // Force a colour change on hover to work around a bug in Safari\n // https://webkit.org/b/224483\n &:hover {\n @if type-of($govuk-text-colour) == color {\n color: rgba($govuk-text-colour, 0.99);\n }\n }\n\n &:active,\n &:focus {\n @include govuk-text-colour;\n }\n}\n\n/// Inverse link styles\n///\n/// Makes links white, in all states. Use this mixin if you're displaying links\n/// against a dark background.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-inverse;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-inverse {\n &:link,\n &:visited {\n color: govuk-colour(\"white\");\n }\n\n // Force a colour change on hover to work around a bug in Safari\n // https://webkit.org/b/224483\n &:hover,\n &:active {\n color: rgba(govuk-colour(\"white\"), 0.99);\n }\n\n &:focus {\n color: $govuk-focus-text-colour;\n }\n}\n\n/// Default link styles, without a visited state\n///\n/// Makes links use the default unvisited, hover and active colours, with no\n/// distinct visited state.\n///\n/// Use this mixin when it's not helpful to distinguish between visited and\n/// non-visited links. For example, when you link to pages with\n/// frequently-changing content, such as the dashboard for an admin interface.\n///\n/// If you use this mixin in a component, you must also include the\n/// `govuk-link-common` mixin to get the correct focus and hover states.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-no-visited-state;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-no-visited-state {\n &:link {\n color: $govuk-link-colour;\n }\n\n &:visited {\n color: $govuk-link-colour;\n }\n\n &:hover {\n color: $govuk-link-hover-colour;\n }\n\n &:active {\n color: $govuk-link-active-colour;\n }\n\n // When focussed, the text colour needs to be darker to ensure that colour\n // contrast is still acceptable\n &:focus {\n color: $govuk-focus-text-colour;\n }\n}\n\n/// Remove underline from links\n///\n/// Remove underlines from links unless the link is active or a user hovers\n/// their cursor over it.\n///\n/// @example scss\n/// .govuk-component__link {\n/// @include govuk-link-common;\n/// @include govuk-link-style-default;\n/// @include govuk-link-style-no-underline;\n/// }\n///\n/// @access public\n\n@mixin govuk-link-style-no-underline {\n &:not(:hover):not(:active) {\n text-decoration: none;\n }\n}\n\n/// Include link destination when printing the page\n///\n/// If the user prints the page, add the destination URL after the link text, if\n/// the URL starts with `/`, `http://` or `https://`.\n///\n/// @access public\n\n@mixin govuk-link-print-friendly {\n @include govuk-media-query($media-type: print) {\n &[href^=\"/\"],\n &[href^=\"http://\"],\n &[href^=\"https://\"]\n {\n &::after {\n content: \" (\" attr(href) \")\";\n font-size: 90%;\n\n // Because the URLs may be very long, ensure that they may be broken\n // at arbitrary points if there are no otherwise acceptable break\n // points in the line\n word-wrap: break-word;\n }\n }\n }\n}\n\n/// Image link styles\n///\n/// Prepares and provides the focus state for links that only contain images\n/// with no accompanying text.\n///\n/// @access public\n\n@mixin govuk-link-image {\n // Needed to draw the focus around the entire image\n display: inline-block;\n\n // Remove extra space at the bottom of the image that's added by line-height\n line-height: 0;\n\n // Don't render an underline\n text-decoration: none;\n\n &:focus {\n @include govuk-focused-box;\n }\n}\n"]}

data/node_modules/govuk-frontend/dist/govuk/helpers/_shape-arrow.scss CHANGED Viewed

@@ -54,7 +54,7 @@
     -webkit-clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
             clip-path: polygon(50% 0%, 0% 100%, 100% 100%); // 3
-    border-width: 0 $perpendicular $height $perpendicular;
+    border-width: 0 $perpendicular $height;
     border-bottom-color: inherit; // 2
   } @else if $direction == "right" {
     -webkit-clip-path: polygon(0% 0%, 100% 50%, 0% 100%);

data/node_modules/govuk-frontend/dist/govuk/helpers/_shape-arrow.scss.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/govuk/helpers/_shape-arrow.scss"],"names":[],"mappings":"AAAA,GAAG;AACH,wBAAwB;AACxB,GAAG;;AAEH,kDAAkD;AAClD,EAAE;AACF,4EAA4E;AAC5E,8EAA8E;AAC9E,EAAE;AACF,6DAA6D;AAC7D,qDAAqD;AACrD,kBAAkB;;AAElB;EACE,4BAA4B;;EAE5B,2CAA2C;AAC7C;;AAEA,cAAc;AACd,EAAE;AACF,6EAA6E;AAC7E,4EAA4E;AAC5E,EAAE;AACF,8EAA8E;AAC9E,sEAAsE;AACtE,0DAA0D;AAC1D,EAAE;AACF,gEAAgE;AAChE,EAAE;AACF,2EAA2E;AAC3E,6DAA6D;AAC7D,6EAA6E;AAC7E,uEAAuE;AACvE,EAAE;AACF,iBAAiB;;AAEjB;EACE,iBAAiB;;EAEjB,QAAQ;EACR,SAAS;;EAET,mBAAmB;EACnB,yBAAyB,EAAE,GAAG;;EAE9B,yBAAyB;;EAEzB;IACE,yCAAyC;EAC3C;;EAEA;IACE,sDAA8C;YAA9C,8CAA8C,EAAE,GAAG;;IAEnD,~~qDAAqD~~;~~IACrD~~,4BAA4B,EAAE,GAAG;EACnC,EAAE;IACA,oDAA4C;YAA5C,4CAA4C,EAAE,GAAG;;IAEjD,qDAAqD;IACrD,0BAA0B,EAAE,GAAG;EACjC,EAAE;IACA,oDAA4C;YAA5C,4CAA4C,EAAE,GAAG;;IAEjD,qDAAqD;IACrD,yBAAyB,EAAE,GAAG;EAChC,EAAE;IACA,sDAA8C;YAA9C,8CAA8C,EAAE,GAAG;;IAEnD,qDAAqD;IACrD,2BAA2B,EAAE,GAAG;EAClC,EAAE;IACA,+FAA+F;EACjG;AACF","file":"_shape-arrow.scss","sourcesContent":["////\n/// @group helpers/shapes\n////\n\n/// Calculate the height of an equilateral triangle\n///\n/// Multiplying half the length of the base of an equilateral triangle by the\n/// square root of three gives us its height. We use 1.732 as an approximation.\n///\n/// @param {Number} $base - Length of the base of the triangle\n/// @return {Number} Calculated height of the triangle\n/// @access private\n\n@function _govuk-equilateral-height($base) {\n $square-root-of-three: 1.732;\n\n @return ($base / 2) * $square-root-of-three;\n}\n\n/// Arrow mixin\n///\n/// Generate Arrows (triangles) by using a mix of transparent (1) and coloured\n/// borders. The coloured borders inherit the text colour of the element (2).\n///\n/// Ensure the arrow is rendered correctly if browser colours are overridden by\n/// providing a clip path (3). Without this the transparent borders are\n/// overridden to become visible which results in a square.\n///\n/// We need both because older browsers do not support clip-path.\n///\n/// @param {String} $direction - Direction for arrow: up, right, down, left.\n/// @param {Number} $base - Length of the triangle 'base' side\n/// @param {Number} $height [null] - Height of triangle. Omit for equilateral.\n/// @param {String} $display [block] - CSS display property of the arrow\n///\n/// @access public\n\n@mixin govuk-shape-arrow($direction, $base, $height: null, $display: block) {\n display: $display;\n\n width: 0;\n height: 0;\n\n border-style: solid;\n border-color: transparent; // 1\n\n $perpendicular: $base / 2;\n\n @if not $height {\n $height: _govuk-equilateral-height($base);\n }\n\n @if $direction == \"up\" {\n clip-path: polygon(50% 0%, 0% 100%, 100% 100%); // 3\n\n border-width: 0 $perpendicular $height ~~$perpendicular~~;\n border-bottom-color: inherit; // 2\n } @else if $direction == \"right\" {\n clip-path: polygon(0% 0%, 100% 50%, 0% 100%); // 3\n\n border-width: $perpendicular 0 $perpendicular $height;\n border-left-color: inherit; // 2\n } @else if $direction == \"down\" {\n clip-path: polygon(0% 0%, 50% 100%, 100% 0%); // 3\n\n border-width: $height $perpendicular 0 $perpendicular;\n border-top-color: inherit; // 2\n } @else if $direction == \"left\" {\n clip-path: polygon(0% 50%, 100% 100%, 100% 0%); // 3\n\n border-width: $perpendicular $height $perpendicular 0;\n border-right-color: inherit; // 2\n } @else {\n @error \"Invalid arrow direction: expected `up`, `right`, `down` or `left`, got `#{$direction}`\";\n }\n}\n"]}
1	+ {"version":3,"sources":["../../../src/govuk/helpers/_shape-arrow.scss"],"names":[],"mappings":"AAAA,GAAG;AACH,wBAAwB;AACxB,GAAG;;AAEH,kDAAkD;AAClD,EAAE;AACF,4EAA4E;AAC5E,8EAA8E;AAC9E,EAAE;AACF,6DAA6D;AAC7D,qDAAqD;AACrD,kBAAkB;;AAElB;EACE,4BAA4B;;EAE5B,2CAA2C;AAC7C;;AAEA,cAAc;AACd,EAAE;AACF,6EAA6E;AAC7E,4EAA4E;AAC5E,EAAE;AACF,8EAA8E;AAC9E,sEAAsE;AACtE,0DAA0D;AAC1D,EAAE;AACF,gEAAgE;AAChE,EAAE;AACF,2EAA2E;AAC3E,6DAA6D;AAC7D,6EAA6E;AAC7E,uEAAuE;AACvE,EAAE;AACF,iBAAiB;;AAEjB;EACE,iBAAiB;;EAEjB,QAAQ;EACR,SAAS;;EAET,mBAAmB;EACnB,yBAAyB,EAAE,GAAG;;EAE9B,yBAAyB;;EAEzB;IACE,yCAAyC;EAC3C;;EAEA;IACE,sDAA8C;YAA9C,8CAA8C,EAAE,GAAG;;IAEnD,sCAAsC;IACtC,4BAA4B,EAAE,GAAG;EACnC,EAAE;IACA,oDAA4C;YAA5C,4CAA4C,EAAE,GAAG;;IAEjD,qDAAqD;IACrD,0BAA0B,EAAE,GAAG;EACjC,EAAE;IACA,oDAA4C;YAA5C,4CAA4C,EAAE,GAAG;;IAEjD,qDAAqD;IACrD,yBAAyB,EAAE,GAAG;EAChC,EAAE;IACA,sDAA8C;YAA9C,8CAA8C,EAAE,GAAG;;IAEnD,qDAAqD;IACrD,2BAA2B,EAAE,GAAG;EAClC,EAAE;IACA,+FAA+F;EACjG;AACF","file":"_shape-arrow.scss","sourcesContent":["////\n/// @group helpers/shapes\n////\n\n/// Calculate the height of an equilateral triangle\n///\n/// Multiplying half the length of the base of an equilateral triangle by the\n/// square root of three gives us its height. We use 1.732 as an approximation.\n///\n/// @param {Number} $base - Length of the base of the triangle\n/// @return {Number} Calculated height of the triangle\n/// @access private\n\n@function _govuk-equilateral-height($base) {\n $square-root-of-three: 1.732;\n\n @return ($base / 2) * $square-root-of-three;\n}\n\n/// Arrow mixin\n///\n/// Generate Arrows (triangles) by using a mix of transparent (1) and coloured\n/// borders. The coloured borders inherit the text colour of the element (2).\n///\n/// Ensure the arrow is rendered correctly if browser colours are overridden by\n/// providing a clip path (3). Without this the transparent borders are\n/// overridden to become visible which results in a square.\n///\n/// We need both because older browsers do not support clip-path.\n///\n/// @param {String} $direction - Direction for arrow: up, right, down, left.\n/// @param {Number} $base - Length of the triangle 'base' side\n/// @param {Number} $height [null] - Height of triangle. Omit for equilateral.\n/// @param {String} $display [block] - CSS display property of the arrow\n///\n/// @access public\n\n@mixin govuk-shape-arrow($direction, $base, $height: null, $display: block) {\n display: $display;\n\n width: 0;\n height: 0;\n\n border-style: solid;\n border-color: transparent; // 1\n\n $perpendicular: $base / 2;\n\n @if not $height {\n $height: _govuk-equilateral-height($base);\n }\n\n @if $direction == \"up\" {\n clip-path: polygon(50% 0%, 0% 100%, 100% 100%); // 3\n\n border-width: 0 $perpendicular $height;\n border-bottom-color: inherit; // 2\n } @else if $direction == \"right\" {\n clip-path: polygon(0% 0%, 100% 50%, 0% 100%); // 3\n\n border-width: $perpendicular 0 $perpendicular $height;\n border-left-color: inherit; // 2\n } @else if $direction == \"down\" {\n clip-path: polygon(0% 0%, 50% 100%, 100% 0%); // 3\n\n border-width: $height $perpendicular 0 $perpendicular;\n border-top-color: inherit; // 2\n } @else if $direction == \"left\" {\n clip-path: polygon(0% 50%, 100% 100%, 100% 0%); // 3\n\n border-width: $perpendicular $height $perpendicular 0;\n border-right-color: inherit; // 2\n } @else {\n @error \"Invalid arrow direction: expected `up`, `right`, `down` or `left`, got `#{$direction}`\";\n }\n}\n"]}

data/node_modules/govuk-frontend/dist/govuk/helpers/_typography.scss CHANGED Viewed

@@ -79,6 +79,23 @@
   font-variant-numeric: tabular-nums if($important, !important, null);
 }
+/// Word break helper
+///
+/// Forcibly breaks long words that lack spaces, such as email addresses,
+/// across multiple lines when they wouldn't otherwise fit.
+///
+/// @param {Boolean} $important [false] - Whether to mark declarations as
+///   `!important`. Generally used to create override classes.
+/// @access public
+@mixin govuk-text-break-word($important: false) {
+  // IE 11 and Edge 16–17 only support the non-standard `word-wrap` property
+  word-wrap: break-word if($important, !important, null);
+  // All other browsers support `overflow-wrap`
+  overflow-wrap: break-word if($important, !important, null);
+}
 /// Convert line-heights specified in pixels into a relative value, unless
 /// they are already unit-less (and thus already treated as relative values)
 /// or the units do not match the units used for the font size.
@@ -173,7 +190,7 @@
   // No match? Try with string type (e.g. $size: "16" not 16)
   @if not $font-map {
     @each $font-size in map-keys($govuk-typography-scale) {
-      @if not $font-map and #{$font-size} == #{$size} {
+      @if not $font-map and "#{$font-size}" == "#{$size}" {
         $font-map: map-get($govuk-typography-scale, $font-size);
       }
     }

data/node_modules/govuk-frontend/dist/govuk/helpers/_typography.scss.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/govuk/helpers/_typography.scss"],"names":[],"mappings":"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","file":"_typography.scss","sourcesContent":["////\n/// @group helpers/typography\n////\n\n@import \"../tools/px-to-rem\";\n\n/// 'Common typography' helper\n///\n/// Sets the font family and associated properties, such as font smoothing. Also\n/// overrides the font for print.\n///\n/// @param {List} $font-family [$govuk-font-family] Font family to use\n/// @access public\n\n@mixin govuk-typography-common($font-family: $govuk-font-family) {\n font-family: $font-family;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n // If the user is using the default GDS Transport font we need to include\n // the font-face declarations.\n @if $govuk-include-default-font-face {\n @include _govuk-font-face-gds-transport;\n }\n\n @include govuk-media-query($media-type: print) {\n font-family: $govuk-font-family-print;\n }\n}\n\n/// Text colour helper\n///\n/// Sets the text colour, including a suitable override for print.\n///\n/// @access public\n\n@mixin govuk-text-colour {\n color: $govuk-text-colour;\n\n @include govuk-media-query($media-type: print) {\n color: $govuk-print-text-colour;\n }\n}\n\n/// Regular font weight helper\n///\n/// @param {Boolean} $important [false] - Whether to mark declarations as\n/// `!important`. Generally Used to create override classes.\n/// @access public\n\n@mixin govuk-typography-weight-regular($important: false) {\n font-weight: $govuk-font-weight-regular if($important, !important, null);\n}\n\n/// Bold font weight helper\n///\n/// @param {Boolean} $important [false] - Whether to mark declarations as\n/// `!important`. Generally Used to create override classes.\n/// @access public\n\n@mixin govuk-typography-weight-bold($important: false) {\n font-weight: $govuk-font-weight-bold if($important, !important, null);\n}\n\n/// Tabular number helper\n///\n/// Switches numerical glyphs (0–9) to use alternative forms with a\n/// monospaced bounding box. This ensures that columns of numbers, such\n/// as those in tables, remain horizontally aligned with one another.\n/// This also has the useful side effect of making numbers more legible\n/// in some situations, such as reference codes, as the numbers are more\n/// distinct and visually separated from one another.\n///\n/// @param {Boolean} $important [false] - Whether to mark declarations as\n/// `!important`. Generally Used to create override classes.\n/// @access public\n\n@mixin govuk-font-tabular-numbers($important: false) {\n font-variant-numeric: tabular-nums if($important, !important, null);\n}\n\n/// Convert line-heights specified in pixels into a relative value, unless\n/// they are already unit-less (and thus already treated as relative values)\n/// or the units do not match the units used for the font size.\n///\n/// @param {Number} $line-height Line height\n/// @param {Number} $font-size Font size\n/// @return {Number} The line height as either a relative value or unmodified\n///\n/// @access private\n\n@function _govuk-line-height($line-height, $font-size) {\n @if not unitless($line-height) and unit($line-height) == unit($font-size) {\n $line-height: $line-height / $font-size;\n }\n\n @return $line-height;\n}\n\n/// Font size and line height helper\n///\n/// @param {Number} $size - Point from the type scale (the size as it would\n/// appear on tablet and above)\n/// @param {Number} $override-line-height [false] - Non responsive custom line\n/// height. Omit to use the line height from the font map.\n/// @param {Boolean} $important [false] - Whether to mark declarations as\n/// `!important`.\n///\n/// @throw if `$size` is not a valid point from the type scale\n///\n/// @access public\n///\n/// @alias govuk-font-size\n/// @deprecated Use `govuk-font-size` instead\n\n@mixin govuk-typography-responsive($size, $override-line-height: false, $important: false) {\n @include _warning(\n \"govuk-typography-responsive\",\n \"govuk-typography-responsive is deprecated. Use govuk-font-size instead.\"\n );\n @include govuk-font-size($size, $override-line-height, $important);\n}\n\n/// Font size and line height helper\n///\n/// Takes a point from the responsive 'font map' as an argument (the size as it\n/// would appear on tablet and above), and uses it to create font-size and\n/// line-height declarations for different breakpoints, and print.\n///\n/// Example font map:\n///\n/// ```scss\n/// 19: (\n/// null: (\n/// font-size: 16px,\n/// line-height: 20px\n/// ),\n/// tablet: (\n/// font-size: 19px,\n/// line-height: 25px\n/// ),\n/// print: (\n/// font-size: 14pt,\n/// line-height: 1.15\n/// )\n/// );\n/// ```\n///\n/// @param {Number \| String} $size - Point from the type scale (the size as\n/// it would appear on tablet and above)\n/// @param {Number} $line-height [false] - Non responsive custom line\n/// height. Omit to use the line height from the font map.\n/// @param {Boolean} $important [false] - Whether to mark declarations as\n/// `!important`.\n///\n/// @throw if `$size` is not a valid point from the type scale\n///\n/// @access public\n\n@mixin govuk-font-size($size, $line-height: false, $important: false) {\n // Flag font sizes that start with underscores so we can suppress warnings on\n // deprecated sizes used internally, for example `govuk-font($size: \"_14\")`\n $size-internal-use-only: str-slice(#{$size}, 1, 1) == \"_\";\n\n // Remove underscore from font sizes flagged for internal use\n @if $size-internal-use-only {\n $size: str-slice(#{$size}, 2);\n }\n\n // Check for a font map exactly matching the given size\n $font-map: map-get($govuk-typography-scale, $size);\n\n // No match? Try with string type (e.g. $size: \"16\" not 16)\n @if not $font-map {\n @each $font-size in map-keys($govuk-typography-scale) {\n @if not $font-map and #{$font-size} == #{$size} {\n $font-map: map-get($govuk-typography-scale, $font-size);\n }\n }\n }\n\n // Still no match? Throw error\n @if not $font-map {\n @error \"Unknown font size `#{$size}` - expected a point from the type scale.\";\n }\n\n // Check for a deprecation within the type scale\n $deprecation: map-get($font-map, \"deprecation\");\n\n @if $deprecation {\n // Warn on deprecated font sizes unless flagged for internal use\n @if not $size-internal-use-only {\n @include _warning(map-get($deprecation, \"key\"), map-get($deprecation, \"message\"));\n }\n\n // remove the deprecation map keys so they do not break the breakpoint loop\n $font-map: map-remove($font-map, \"deprecation\");\n }\n\n @each $breakpoint, $breakpoint-map in $font-map {\n $font-size: map-get($breakpoint-map, \"font-size\");\n $font-size-rem: govuk-px-to-rem($font-size);\n\n // $calculated-line-height is a separate variable from $line-height,\n // as otherwise the value would get redefined with each loop and\n // eventually break _govuk-line-height.\n //\n // We continue to call the param $line-height to stay consistent with the\n // naming with govuk-font.\n $calculated-line-height: _govuk-line-height(\n $line-height: if($line-height, $line-height, map-get($breakpoint-map, \"line-height\")),\n $font-size: $font-size\n );\n\n // Mark rules as !important if $important is true - this will result in\n // these variables becoming strings, so this needs to happen after they\n // are used in calculations\n $font-size: $font-size if($important, !important, null);\n $font-size-rem: $font-size-rem if($important, !important, null);\n $calculated-line-height: $calculated-line-height if($important, !important, null);\n\n @if not $breakpoint {\n font-size: $font-size-rem;\n line-height: $calculated-line-height;\n } @else if $breakpoint == \"print\" {\n @include govuk-media-query($media-type: print) {\n font-size: $font-size;\n line-height: $calculated-line-height;\n }\n } @else {\n @include govuk-media-query($from: $breakpoint) {\n font-size: $font-size-rem;\n line-height: $calculated-line-height;\n }\n }\n }\n}\n\n/// Font helper\n///\n/// @param {Number \| Boolean \| String} $size Point from the type scale (the\n/// size as it would appear on tablet and above). Use `false` to avoid setting\n/// a size.\n/// @param {String} $weight [regular] - Weight: `bold` or `regular`\n/// @param {Boolean} $tabular [false] - Whether to use tabular numbers or not\n/// @param {Number} $line-height [false] - Line-height, if overriding the\n/// default\n///\n/// @throw if `$size` is not a valid point from the type scale (or false)\n///\n/// @access public\n\n@mixin govuk-font($size, $weight: regular, $tabular: false, $line-height: false) {\n @include govuk-typography-common;\n\n @if $tabular {\n @include govuk-font-tabular-numbers;\n }\n\n @if $weight == regular {\n @include govuk-typography-weight-regular;\n } @else if $weight == bold {\n @include govuk-typography-weight-bold;\n }\n\n @if $size {\n @include govuk-font-size($size, $line-height);\n }\n}\n"]}
1	+ {"version":3,"sources":["../../../src/govuk/helpers/_typography.scss"],"names":[],"mappings":"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","file":"_typography.scss","sourcesContent":["////\n/// @group helpers/typography\n////\n\n@import \"../tools/px-to-rem\";\n\n/// 'Common typography' helper\n///\n/// Sets the font family and associated properties, such as font smoothing. Also\n/// overrides the font for print.\n///\n/// @param {List} $font-family [$govuk-font-family] Font family to use\n/// @access public\n\n@mixin govuk-typography-common($font-family: $govuk-font-family) {\n font-family: $font-family;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n // If the user is using the default GDS Transport font we need to include\n // the font-face declarations.\n @if $govuk-include-default-font-face {\n @include _govuk-font-face-gds-transport;\n }\n\n @include govuk-media-query($media-type: print) {\n font-family: $govuk-font-family-print;\n }\n}\n\n/// Text colour helper\n///\n/// Sets the text colour, including a suitable override for print.\n///\n/// @access public\n\n@mixin govuk-text-colour {\n color: $govuk-text-colour;\n\n @include govuk-media-query($media-type: print) {\n color: $govuk-print-text-colour;\n }\n}\n\n/// Regular font weight helper\n///\n/// @param {Boolean} $important [false] - Whether to mark declarations as\n/// `!important`. Generally Used to create override classes.\n/// @access public\n\n@mixin govuk-typography-weight-regular($important: false) {\n font-weight: $govuk-font-weight-regular if($important, !important, null);\n}\n\n/// Bold font weight helper\n///\n/// @param {Boolean} $important [false] - Whether to mark declarations as\n/// `!important`. Generally Used to create override classes.\n/// @access public\n\n@mixin govuk-typography-weight-bold($important: false) {\n font-weight: $govuk-font-weight-bold if($important, !important, null);\n}\n\n/// Tabular number helper\n///\n/// Switches numerical glyphs (0–9) to use alternative forms with a\n/// monospaced bounding box. This ensures that columns of numbers, such\n/// as those in tables, remain horizontally aligned with one another.\n/// This also has the useful side effect of making numbers more legible\n/// in some situations, such as reference codes, as the numbers are more\n/// distinct and visually separated from one another.\n///\n/// @param {Boolean} $important [false] - Whether to mark declarations as\n/// `!important`. Generally Used to create override classes.\n/// @access public\n\n@mixin govuk-font-tabular-numbers($important: false) {\n font-variant-numeric: tabular-nums if($important, !important, null);\n}\n\n/// Word break helper\n///\n/// Forcibly breaks long words that lack spaces, such as email addresses,\n/// across multiple lines when they wouldn't otherwise fit.\n///\n/// @param {Boolean} $important [false] - Whether to mark declarations as\n/// `!important`. Generally used to create override classes.\n/// @access public\n\n@mixin govuk-text-break-word($important: false) {\n // IE 11 and Edge 16–17 only support the non-standard `word-wrap` property\n word-wrap: break-word if($important, !important, null);\n\n // All other browsers support `overflow-wrap`\n overflow-wrap: break-word if($important, !important, null);\n}\n\n/// Convert line-heights specified in pixels into a relative value, unless\n/// they are already unit-less (and thus already treated as relative values)\n/// or the units do not match the units used for the font size.\n///\n/// @param {Number} $line-height Line height\n/// @param {Number} $font-size Font size\n/// @return {Number} The line height as either a relative value or unmodified\n///\n/// @access private\n\n@function _govuk-line-height($line-height, $font-size) {\n @if not unitless($line-height) and unit($line-height) == unit($font-size) {\n $line-height: $line-height / $font-size;\n }\n\n @return $line-height;\n}\n\n/// Font size and line height helper\n///\n/// @param {Number} $size - Point from the type scale (the size as it would\n/// appear on tablet and above)\n/// @param {Number} $override-line-height [false] - Non responsive custom line\n/// height. Omit to use the line height from the font map.\n/// @param {Boolean} $important [false] - Whether to mark declarations as\n/// `!important`.\n///\n/// @throw if `$size` is not a valid point from the type scale\n///\n/// @access public\n///\n/// @alias govuk-font-size\n/// @deprecated Use `govuk-font-size` instead\n\n@mixin govuk-typography-responsive($size, $override-line-height: false, $important: false) {\n @include _warning(\n \"govuk-typography-responsive\",\n \"govuk-typography-responsive is deprecated. Use govuk-font-size instead.\"\n );\n @include govuk-font-size($size, $override-line-height, $important);\n}\n\n/// Font size and line height helper\n///\n/// Takes a point from the responsive 'font map' as an argument (the size as it\n/// would appear on tablet and above), and uses it to create font-size and\n/// line-height declarations for different breakpoints, and print.\n///\n/// Example font map:\n///\n/// ```scss\n/// 19: (\n/// null: (\n/// font-size: 16px,\n/// line-height: 20px\n/// ),\n/// tablet: (\n/// font-size: 19px,\n/// line-height: 25px\n/// ),\n/// print: (\n/// font-size: 14pt,\n/// line-height: 1.15\n/// )\n/// );\n/// ```\n///\n/// @param {Number \| String} $size - Point from the type scale (the size as\n/// it would appear on tablet and above)\n/// @param {Number} $line-height [false] - Non responsive custom line\n/// height. Omit to use the line height from the font map.\n/// @param {Boolean} $important [false] - Whether to mark declarations as\n/// `!important`.\n///\n/// @throw if `$size` is not a valid point from the type scale\n///\n/// @access public\n\n@mixin govuk-font-size($size, $line-height: false, $important: false) {\n // Flag font sizes that start with underscores so we can suppress warnings on\n // deprecated sizes used internally, for example `govuk-font($size: \"_14\")`\n $size-internal-use-only: str-slice(#{$size}, 1, 1) == \"_\";\n\n // Remove underscore from font sizes flagged for internal use\n @if $size-internal-use-only {\n $size: str-slice(#{$size}, 2);\n }\n\n // Check for a font map exactly matching the given size\n $font-map: map-get($govuk-typography-scale, $size);\n\n // No match? Try with string type (e.g. $size: \"16\" not 16)\n @if not $font-map {\n @each $font-size in map-keys($govuk-typography-scale) {\n @if not $font-map and \"#{$font-size}\" == \"#{$size}\" {\n $font-map: map-get($govuk-typography-scale, $font-size);\n }\n }\n }\n\n // Still no match? Throw error\n @if not $font-map {\n @error \"Unknown font size `#{$size}` - expected a point from the type scale.\";\n }\n\n // Check for a deprecation within the type scale\n $deprecation: map-get($font-map, \"deprecation\");\n\n @if $deprecation {\n // Warn on deprecated font sizes unless flagged for internal use\n @if not $size-internal-use-only {\n @include _warning(map-get($deprecation, \"key\"), map-get($deprecation, \"message\"));\n }\n\n // remove the deprecation map keys so they do not break the breakpoint loop\n $font-map: map-remove($font-map, \"deprecation\");\n }\n\n @each $breakpoint, $breakpoint-map in $font-map {\n $font-size: map-get($breakpoint-map, \"font-size\");\n $font-size-rem: govuk-px-to-rem($font-size);\n\n // $calculated-line-height is a separate variable from $line-height,\n // as otherwise the value would get redefined with each loop and\n // eventually break _govuk-line-height.\n //\n // We continue to call the param $line-height to stay consistent with the\n // naming with govuk-font.\n $calculated-line-height: _govuk-line-height(\n $line-height: if($line-height, $line-height, map-get($breakpoint-map, \"line-height\")),\n $font-size: $font-size\n );\n\n // Mark rules as !important if $important is true - this will result in\n // these variables becoming strings, so this needs to happen after they\n // are used in calculations\n $font-size: $font-size if($important, !important, null);\n $font-size-rem: $font-size-rem if($important, !important, null);\n $calculated-line-height: $calculated-line-height if($important, !important, null);\n\n @if not $breakpoint {\n font-size: $font-size-rem;\n line-height: $calculated-line-height;\n } @else if $breakpoint == \"print\" {\n @include govuk-media-query($media-type: print) {\n font-size: $font-size;\n line-height: $calculated-line-height;\n }\n } @else {\n @include govuk-media-query($from: $breakpoint) {\n font-size: $font-size-rem;\n line-height: $calculated-line-height;\n }\n }\n }\n}\n\n/// Font helper\n///\n/// @param {Number \| Boolean \| String} $size Point from the type scale (the\n/// size as it would appear on tablet and above). Use `false` to avoid setting\n/// a size.\n/// @param {String} $weight [regular] - Weight: `bold` or `regular`\n/// @param {Boolean} $tabular [false] - Whether to use tabular numbers or not\n/// @param {Number} $line-height [false] - Line-height, if overriding the\n/// default\n///\n/// @throw if `$size` is not a valid point from the type scale (or false)\n///\n/// @access public\n\n@mixin govuk-font($size, $weight: regular, $tabular: false, $line-height: false) {\n @include govuk-typography-common;\n\n @if $tabular {\n @include govuk-font-tabular-numbers;\n }\n\n @if $weight == regular {\n @include govuk-typography-weight-regular;\n } @else if $weight == bold {\n @include govuk-typography-weight-bold;\n }\n\n @if $size {\n @include govuk-font-size($size, $line-height);\n }\n}\n"]}

data/node_modules/govuk-frontend/dist/govuk/helpers/_visually-hidden.scss CHANGED Viewed

@@ -2,7 +2,7 @@
 /// @group helpers/accessibility
 ////
-/// Hide an element visually, but have it available for screen readers
+/// Helper function containing the common code for the following two mixins
 ///
 /// @link https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 ///   - Hiding Content for Accessibility, Jonathan Snook, February 2011
@@ -11,23 +11,11 @@
 ///
 /// @param {Boolean} $important [true] - Whether to mark as `!important`
 ///
-/// @access public
+/// @access private
-@mixin govuk-visually-hidden($important: true) {
+@mixin _govuk-visually-hide-content($important: true) {
   position: absolute if($important, !important, null);
-  // Absolute positioning has the unintended consequence of removing any
-  // whitespace surrounding visually hidden text from the accessibility tree.
-  // Insert a space character before and after visually hidden text to separate
-  // it from any visible text surrounding it.
-  &::before {
-    content: "\00a0";
-  }
-  &::after {
-    content: "\00a0";
-  }
   width: 1px if($important, !important, null);
   height: 1px if($important, !important, null);
   // If margin is set to a negative value it can cause text to be announced in
@@ -36,6 +24,8 @@
   padding: 0 if($important, !important, null);
   overflow: hidden if($important, !important, null);
+  // `clip` is needed for IE11 support
   clip: rect(0 0 0 0) if($important, !important, null);
   -webkit-clip-path: inset(50%) if($important, !important, null);
           clip-path: inset(50%) if($important, !important, null);
@@ -55,62 +45,40 @@
           user-select: none;
 }
-/// Hide an element visually, but have it available for screen readers whilst
-/// allowing the element to be focused when navigated to via the keyboard (e.g.
-/// for the skip link)
-///
-/// This is slightly less opinionated about borders and padding to make it
-/// easier to style the focussed element.
+/// Hide an element visually, but have it available for screen readers
 ///
 /// @param {Boolean} $important [true] - Whether to mark as `!important`
 ///
 /// @access public
-@mixin govuk-visually-hidden-focusable($important: true) {
-  position: absolute if($important, !important, null);
-  width: 1px if($important, !important, null);
-  height: 1px if($important, !important, null);
-  // If margin is set to a negative value it can cause text to be announced in
-  // the wrong order in VoiceOver for OSX
-  margin: 0 if($important, !important, null);
-  overflow: hidden if($important, !important, null);
-  clip: rect(0 0 0 0) if($important, !important, null);
-  -webkit-clip-path: inset(50%) if($important, !important, null);
-          clip-path: inset(50%) if($important, !important, null);
-  // For long content, line feeds are not interpreted as spaces and small width
-  // causes content to wrap 1 word per line:
-  // https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
-  white-space: nowrap if($important, !important, null);
-  // Prevent users from selecting or copying visually-hidden text. This prevents
-  // a user unintentionally copying more text than they intended and needing to
-  // manually trim it down again.
-  -webkit-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
-  &:active,
-  &:focus {
-    position: static if($important, !important, null);
+@mixin govuk-visually-hidden($important: true) {
+  @include _govuk-visually-hide-content($important: $important);
-    width: auto if($important, !important, null);
-    height: auto if($important, !important, null);
-    margin: inherit if($important, !important, null);
+  // Absolute positioning has the unintended consequence of removing any
+  // whitespace surrounding visually hidden text from the accessibility tree.
+  // Insert a space character before and after visually hidden text to separate
+  // it from any visible text surrounding it.
+  &::before {
+    content: "\00a0";
+  }
-    overflow: visible if($important, !important, null);
-    clip: auto if($important, !important, null);
-    -webkit-clip-path: none if($important, !important, null);
-            clip-path: none if($important, !important, null);
+  &::after {
+    content: "\00a0";
+  }
+}
-    white-space: inherit if($important, !important, null);
+/// Hide an element visually, but have it available for screen readers whilst
+/// allowing the element to be focused when navigated to via the keyboard (e.g.
+/// for the skip link)
+///
+/// @param {Boolean} $important [true] - Whether to mark as `!important`
+///
+/// @access public
-    // Allow the text to be selectable now it's visible
-    -webkit-user-select: text;
-        -ms-user-select: text;
-            user-select: text;
+@mixin govuk-visually-hidden-focusable($important: true) {
+  // IE 11 doesn't support the combined `:not(:active, :focus)` syntax.
+  &:not(:active):not(:focus) {
+    @include _govuk-visually-hide-content($important: $important);
   }
 }

data/node_modules/govuk-frontend/dist/govuk/helpers/_visually-hidden.scss.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/govuk/helpers/_visually-hidden.scss"],"names":[],"mappings":"AAAA,GAAG;AACH,+BAA+B;AAC/B,GAAG;;AAEH,~~qEAAqE~~;~~AACrE~~,EAAE;AACF,gFAAgF;AAChF,sEAAsE;AACtE,2HAA2H;AAC3H,uCAAuC;AACvC,EAAE;AACF,uEAAuE;AACvE,EAAE;AACF,~~iBAAiB~~;;~~AAEjB~~;EACE,mDAAmD;;EAEnD,~~qEAAqE;EACrE,0EAA0E;EAC1E,4EAA4E;EAC5E,0CAA0C;EAC1C;IACE,gBAAgB;EAClB;;EAEA;IACE,gBAAgB;EAClB;;EAEA,~~2CAA2C;EAC3C,4CAA4C;EAC5C,2EAA2E;EAC3E,sCAAsC;EACtC,0CAA0C;EAC1C,2CAA2C;;EAE3C,iDAAiD;~~EACjD~~,oDAAoD;EACpD,8DAAsD;UAAtD,sDAAsD;;EAEtD,0CAA0C;;EAE1C,4EAA4E;EAC5E,yCAAyC;EACzC,uFAAuF;EACvF,oDAAoD;;EAEpD,6EAA6E;EAC7E,4EAA4E;EAC5E,8BAA8B;EAC9B,yBAAiB;MAAjB,qBAAiB;UAAjB,iBAAiB;AACnB;;AAEA,~~4EAA4E~~;~~AAC5E~~,~~8EAA8E;AAC9E,qBAAqB;AACrB,~~EAAE;AACF,~~yEAAyE;AACzE,wCAAwC;AACxC,EAAE;AACF,~~uEAAuE;AACvE,EAAE;AACF,iBAAiB;;AAEjB;EACE,~~mDAAmD~~;;~~EAEnD~~,~~2CAA2C~~;~~EAC3C~~,~~4CAA4C~~;~~EAC5C~~,~~2EAA2E~~;~~EAC3E~~,~~sCAAsC;EACtC,~~0CAA0C~~;;EAE1C,iDAAiD~~;~~EACjD,oDAAoD~~;~~EACpD~~,~~8DAAsD~~;~~UAAtD,sDAAsD~~;;~~EAEtD,4EAA4E~~;~~EAC5E~~,~~yCAAyC~~;~~EACzC,uFAAuF~~;~~EACvF,oDAAoD~~;;~~EAEpD~~,~~6EAA6E;EAC7E,~~4EAA4E;~~EAC5E~~,~~8BAA8B~~;~~EAC9B~~,~~yBAAiB~~;~~MAAjB~~,~~qBAAiB~~;~~UAAjB~~,~~iBAAiB;;EAEjB;;IAEE,iDAAiD;;IAEjD,4CAA4C~~;~~IAC5C~~,~~6CAA6C~~;~~IAC7C~~,~~gDAAgD~~;;~~IAEhD,kDAAkD~~;~~IAClD~~,~~2CAA2C~~;~~IAC3C,wDAAgD~~;~~YAAhD~~,~~gDAAgD;;IAEhD,qDAAqD;;IAErD,kDAAkD~~;~~IAClD,yBAAiB~~;~~QAAjB,qBAAiB;YAAjB,iBAAiB;EACnB;~~AACF","file":"_visually-hidden.scss","sourcesContent":["////\n/// @group helpers/accessibility\n////\n\n/// ~~Hide~~ an ~~element~~ ~~visually,~~ ~~but~~ ~~have~~ it ~~available~~ ~~for~~ ~~screen~~ ~~readers~~\n///\n/// @link https://snook.ca/archives/html_and_css/hiding-content-for-accessibility\n/// - Hiding Content for Accessibility, Jonathan Snook, February 2011\n/// @link https://github.com/h5bp/html5-boilerplate/blob/9f13695d21ff92c55c78dfa9f16bb02a1b6e911f/src/css/main.css#L121-L158\n/// - h5bp/html5-boilerplate - Thanks!\n///\n/// @param {Boolean} $important [true] - Whether to mark as `!important`\n///\n/// @access ~~public~~\n\n@mixin ~~govuk~~-visually-~~hidden~~($important: true) {\n position: absolute if($important, !important, null);\n\n // Absolute positioning has the unintended consequence of removing any\n // whitespace surrounding visually hidden text from the accessibility tree.\n // Insert a space character before and after visually hidden text to separate\n // it from any visible text surrounding it.\n &::before {\n content: \"\\00a0\";\n }\n\n &::after {\n content: \"\\00a0\";\n }\n\n width: 1px if($important, !important, null);\n height: 1px if($important, !important, null);\n // If margin is set to a negative value it can cause text to be announced in\n // the wrong order in VoiceOver for OSX\n margin: 0 if($important, !important, null);\n padding: 0 if($important, !important, null);\n\n overflow: hidden if($important, !important, null);\n clip: rect(0 0 0 0) if($important, !important, null);\n clip-path: inset(50%) if($important, !important, null);\n\n border: 0 if($important, !important, null);\n\n // For long content, line feeds are not interpreted as spaces and small width\n // causes content to wrap 1 word per line:\n // https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe\n white-space: nowrap if($important, !important, null);\n\n // Prevent users from selecting or copying visually-hidden text. This prevents\n // a user unintentionally copying more text than they intended and needing to\n // manually trim it down again.\n user-select: none;\n}\n\n/// Hide an element visually, but have it available for screen readers ~~whilst~~\n~~/// allowing the element to be focused when navigated to via the keyboard (e.g.\n/// for the skip link)\n~~///\n/// ~~This is slightly less opinionated about borders and padding to make it\n/// easier to style the focussed element.\n///\n///~~ @param {Boolean} $important [true] - Whether to mark as `!important`\n///\n/// @access public\n\n@mixin govuk-visually-hidden~~-focusable~~($important: true) {\n ~~position:~~ ~~absolute if~~($important, !important~~, null~~);\n\n ~~width:~~ ~~1px~~ ~~if($important,~~ ~~!important,~~ ~~null);\n height:~~ ~~1px~~ ~~if($important,~~ ~~!important,~~ ~~null);\~~n // If ~~margin~~ is ~~set~~ ~~to a negative value it can cause~~ text to be ~~announced~~ ~~in\~~n // ~~the~~ ~~wrong~~ ~~order~~ in ~~VoiceOver~~ ~~for~~ ~~OSX\n margin:~~ 0 ~~if($important, !important, null);\n\n overflow:~~ hidden ~~if($important,~~ ~~!important,~~ ~~null);\~~n ~~clip:~~ ~~rect(0~~ 0 0 0) ~~if($important,~~ ~~!important,~~ ~~null);\~~n ~~clip-path:~~ ~~inset(50%) if($important, !important, null);\n~~\n ~~// For long~~ content, ~~line feeds are not interpreted as spaces and small width~~\n ~~// causes content to wrap 1 word per line:\~~n // ~~https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe~~\n ~~white-space~~: ~~nowrap if($important, !important, null)~~;\n\n // ~~Prevent~~ ~~users~~ ~~from~~ ~~selecting~~ or ~~copying~~ ~~visually-hidden~~ ~~text.~~ ~~This~~ ~~prevents~~\n // a ~~user~~ ~~unintentionally~~ ~~copying~~ ~~more~~ ~~text~~ ~~than~~ ~~they~~ ~~intended~~ ~~and~~ ~~needing~~ ~~to\~~n // ~~manually~~ ~~trim~~ it ~~down again.\n user-select: none;\n~~\n ~~&:active,\~~n ~~&:focus~~ {~~\n position:~~ ~~static if(~~$important, ~~!important,~~ ~~null);\n\n width:~~ ~~auto~~ ~~if($important,~~ ~~!important,~~ ~~null);\n height:~~ ~~auto if($~~important, ~~!important,~~ ~~null);\~~n ~~margin:~~ ~~inherit if~~($important, ~~!important,~~ ~~null);\n~~\n ~~overflow:~~ ~~visible~~ ~~if($important,~~ ~~!important,~~ ~~null);\n clip:~~ ~~auto~~ if(~~$important~~, ~~!important,~~ ~~null);\~~n ~~clip-path~~: ~~none if~~(~~$important,~~ ~~!important, null);\n~~\n ~~white~~-~~space: inherit if~~($important, !important~~, null~~);\n~~\n // Allow the text to be selectable now it's visible\n user-select: text;\n~~ }\n}\n"]}
1	+ {"version":3,"sources":["../../../src/govuk/helpers/_visually-hidden.scss"],"names":[],"mappings":"AAAA,GAAG;AACH,+BAA+B;AAC/B,GAAG;;AAEH,0EAA0E;AAC1E,EAAE;AACF,gFAAgF;AAChF,sEAAsE;AACtE,2HAA2H;AAC3H,uCAAuC;AACvC,EAAE;AACF,uEAAuE;AACvE,EAAE;AACF,kBAAkB;;AAElB;EACE,mDAAmD;;EAEnD,2CAA2C;EAC3C,4CAA4C;EAC5C,2EAA2E;EAC3E,sCAAsC;EACtC,0CAA0C;EAC1C,2CAA2C;;EAE3C,iDAAiD;;EAEjD,mCAAmC;EACnC,oDAAoD;EACpD,8DAAsD;UAAtD,sDAAsD;;EAEtD,0CAA0C;;EAE1C,4EAA4E;EAC5E,yCAAyC;EACzC,uFAAuF;EACvF,oDAAoD;;EAEpD,6EAA6E;EAC7E,4EAA4E;EAC5E,8BAA8B;EAC9B,yBAAiB;MAAjB,qBAAiB;UAAjB,iBAAiB;AACnB;;AAEA,qEAAqE;AACrE,EAAE;AACF,uEAAuE;AACvE,EAAE;AACF,iBAAiB;;AAEjB;EACE,6DAA6D;;EAE7D,qEAAqE;EACrE,0EAA0E;EAC1E,4EAA4E;EAC5E,0CAA0C;EAC1C;IACE,gBAAgB;EAClB;;EAEA;IACE,gBAAgB;EAClB;AACF;;AAEA,4EAA4E;AAC5E,8EAA8E;AAC9E,qBAAqB;AACrB,EAAE;AACF,uEAAuE;AACvE,EAAE;AACF,iBAAiB;;AAEjB;EACE,oEAAoE;EACpE;IACE,6DAA6D;EAC/D;AACF","file":"_visually-hidden.scss","sourcesContent":["////\n/// @group helpers/accessibility\n////\n\n/// Helper function containing the common code for the following two mixins\n///\n/// @link https://snook.ca/archives/html_and_css/hiding-content-for-accessibility\n/// - Hiding Content for Accessibility, Jonathan Snook, February 2011\n/// @link https://github.com/h5bp/html5-boilerplate/blob/9f13695d21ff92c55c78dfa9f16bb02a1b6e911f/src/css/main.css#L121-L158\n/// - h5bp/html5-boilerplate - Thanks!\n///\n/// @param {Boolean} $important [true] - Whether to mark as `!important`\n///\n/// @access private\n\n@mixin _govuk-visually-hide-content($important: true) {\n position: absolute if($important, !important, null);\n\n width: 1px if($important, !important, null);\n height: 1px if($important, !important, null);\n // If margin is set to a negative value it can cause text to be announced in\n // the wrong order in VoiceOver for OSX\n margin: 0 if($important, !important, null);\n padding: 0 if($important, !important, null);\n\n overflow: hidden if($important, !important, null);\n\n // `clip` is needed for IE11 support\n clip: rect(0 0 0 0) if($important, !important, null);\n clip-path: inset(50%) if($important, !important, null);\n\n border: 0 if($important, !important, null);\n\n // For long content, line feeds are not interpreted as spaces and small width\n // causes content to wrap 1 word per line:\n // https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe\n white-space: nowrap if($important, !important, null);\n\n // Prevent users from selecting or copying visually-hidden text. This prevents\n // a user unintentionally copying more text than they intended and needing to\n // manually trim it down again.\n user-select: none;\n}\n\n/// Hide an element visually, but have it available for screen readers\n///\n/// @param {Boolean} $important [true] - Whether to mark as `!important`\n///\n/// @access public\n\n@mixin govuk-visually-hidden($important: true) {\n @include _govuk-visually-hide-content($important: $important);\n\n // Absolute positioning has the unintended consequence of removing any\n // whitespace surrounding visually hidden text from the accessibility tree.\n // Insert a space character before and after visually hidden text to separate\n // it from any visible text surrounding it.\n &::before {\n content: \"\\00a0\";\n }\n\n &::after {\n content: \"\\00a0\";\n }\n}\n\n/// Hide an element visually, but have it available for screen readers whilst\n/// allowing the element to be focused when navigated to via the keyboard (e.g.\n/// for the skip link)\n///\n/// @param {Boolean} $important [true] - Whether to mark as `!important`\n///\n/// @access public\n\n@mixin govuk-visually-hidden-focusable($important: true) {\n // IE 11 doesn't support the combined `:not(:active, :focus)` syntax.\n &:not(:active):not(:focus) {\n @include _govuk-visually-hide-content($important: $important);\n }\n}\n"]}