govuk_tech_docs 6.2.4 → 6.3.0

data/node_modules/govuk-frontend/dist/govuk/components/cookie-banner/_index.scss

@@ -1,58 +1,7 @@
-@import "../../base";
+@use "../../custom-properties";
 
-@import "../button/index";
+@use "mixin";
+@use "../button";
 
-@include govuk-exports("govuk/component/cookie-banner") {
-  // This needs to be kept in sync with the header component's styles
-  $border-bottom-width: govuk-spacing(2);
+@include mixin.styles;
 
-  .govuk-cookie-banner {
-    padding-top: govuk-spacing(4);
-    // The component does not set bottom spacing. The bottom spacing should be
-    // created by the items inside the component.
-
-    // Visually separate the cookie banner from content underneath when user
-    // changes colours in their browser.
-    border-bottom: $border-bottom-width solid transparent;
-
-    color: govuk-functional-colour(surface-text);
-    background-color: govuk-functional-colour(surface-background);
-  }
-
-  // Support older browsers which don't hide elements with the `hidden` attribute
-  // when user hides the whole cookie banner with a 'Hide' button.
-  .govuk-cookie-banner[hidden] {
-    display: none;
-  }
-
-  .govuk-cookie-banner__message {
-    // Remove the extra height added by the separator border.
-    margin-bottom: -$border-bottom-width;
-
-    &[hidden] {
-      // Support older browsers which don't hide elements with the `hidden`
-      // attribute when the visibility of cookie and replacement messages is
-      // toggled.
-      display: none;
-    }
-
-    &:focus {
-      // Remove the native visible focus indicator when the element is
-      // programmatically focused.
-      //
-      // The focused cookie banner is the first element on the page and the last
-      // thing the user interacted with prior to it gaining focus. We therefore
-      // assume that moving focus to it is not going to surprise users, and that
-      // giving it a visible focus indicator could be more confusing than
-      // helpful, especially as the element is not normally keyboard operable.
-      //
-      // We have flagged this in the research section of the guidance as
-      // something to monitor.
-      //
-      // A related discussion: https://github.com/w3c/wcag/issues/1001
-      outline: none;
-    }
-  }
-}
-
-/*# sourceMappingURL=_index.scss.map */

data/node_modules/govuk-frontend/dist/govuk/components/cookie-banner/_mixin.scss

@@ -0,0 +1,56 @@
+@use "../../base";
+
+/// @access private
+@mixin styles {
+  // This needs to be kept in sync with the header component's styles
+  $border-bottom-width: base.govuk-spacing(2);
+
+  .govuk-cookie-banner {
+    padding-top: base.govuk-spacing(4);
+    // The component does not set bottom spacing. The bottom spacing should be
+    // created by the items inside the component.
+
+    // Visually separate the cookie banner from content underneath when user
+    // changes colours in their browser.
+    border-bottom: $border-bottom-width solid transparent;
+
+    color: base.govuk-functional-colour(surface-text);
+    background-color: base.govuk-functional-colour(surface-background);
+  }
+
+  // Support older browsers which don't hide elements with the `hidden` attribute
+  // when user hides the whole cookie banner with a 'Hide' button.
+  .govuk-cookie-banner[hidden] {
+    display: none;
+  }
+
+  .govuk-cookie-banner__message {
+    // Remove the extra height added by the separator border.
+    margin-bottom: -$border-bottom-width;
+
+    &[hidden] {
+      // Support older browsers which don't hide elements with the `hidden`
+      // attribute when the visibility of cookie and replacement messages is
+      // toggled.
+      display: none;
+    }
+
+    &:focus {
+      // Remove the native visible focus indicator when the element is
+      // programmatically focused.
+      //
+      // The focused cookie banner is the first element on the page and the last
+      // thing the user interacted with prior to it gaining focus. We therefore
+      // assume that moving focus to it is not going to surprise users, and that
+      // giving it a visible focus indicator could be more confusing than
+      // helpful, especially as the element is not normally keyboard operable.
+      //
+      // We have flagged this in the research section of the guidance as
+      // something to monitor.
+      //
+      // A related discussion: https://github.com/w3c/wcag/issues/1001
+      outline: none;
+    }
+  }
+}
+

data/node_modules/govuk-frontend/dist/govuk/components/date-input/_date-input.import.scss

@@ -0,0 +1,6 @@
+@use "../../settings/warnings--internal";
+
+@include warnings--internal.component-scss-file-warning("date-input");
+
+@import "index";
+

data/node_modules/govuk-frontend/dist/govuk/components/date-input/_index.import.scss

@@ -0,0 +1,13 @@
+@use "mixin";
+
+@import "../../base";
+@import "../error-message";
+@import "../input";
+@import "../hint";
+@import "../label";
+@import "../fieldset";
+
+@include govuk-exports("govuk/component/date-input") {
+  @include mixin.styles;
+}
+

data/node_modules/govuk-frontend/dist/govuk/components/date-input/_index.scss

@@ -1,35 +1,10 @@
-@import "../../base";
+@use "../../custom-properties";
+@use "mixin";
+@use "../error-message";
+@use "../input";
+@use "../hint";
+@use "../label";
+@use "../fieldset";
 
-@import "../error-message/index";
-@import "../input/index";
-@import "../hint/index";
-@import "../label/index";
-@import "../fieldset/index";
+@include mixin.styles;
 
-@include govuk-exports("govuk/component/date-input") {
-  .govuk-date-input {
-    @include govuk-clearfix;
-    font-size: 0; // removes whitespace caused by inline-block
-  }
-
-  .govuk-date-input__item {
-    display: inline-block;
-    margin-right: govuk-spacing(4);
-    margin-bottom: 0;
-
-    // Prevents an issue in iOS Safari 18 where the items vertically
-    // shift when the value of inputs is changed.
-    // https://github.com/alphagov/reported-bugs/issues/90
-    vertical-align: bottom;
-  }
-
-  .govuk-date-input__label {
-    display: block;
-  }
-
-  .govuk-date-input__input {
-    margin-bottom: 0;
-  }
-}
-
-/*# sourceMappingURL=_index.scss.map */

data/node_modules/govuk-frontend/dist/govuk/components/date-input/_mixin.scss

@@ -0,0 +1,29 @@
+@use "../../base";
+
+/// @access private
+@mixin styles {
+  .govuk-date-input {
+    @include base.govuk-clearfix;
+    font-size: 0; // removes whitespace caused by inline-block
+  }
+
+  .govuk-date-input__item {
+    display: inline-block;
+    margin-right: base.govuk-spacing(4);
+    margin-bottom: 0;
+
+    // Prevents an issue in iOS Safari 18 where the items vertically
+    // shift when the value of inputs is changed.
+    // https://github.com/alphagov/reported-bugs/issues/90
+    vertical-align: bottom;
+  }
+
+  .govuk-date-input__label {
+    display: block;
+  }
+
+  .govuk-date-input__input {
+    margin-bottom: 0;
+  }
+}
+

data/node_modules/govuk-frontend/dist/govuk/components/details/_details.import.scss

@@ -0,0 +1,6 @@
+@use "../../settings/warnings--internal";
+
+@include warnings--internal.component-scss-file-warning("details");
+
+@import "index";
+

data/node_modules/govuk-frontend/dist/govuk/components/details/_index.import.scss

@@ -0,0 +1,8 @@
+@use "mixin";
+
+@import "../../base";
+
+@include govuk-exports("govuk/component/details") {
+  @include mixin.styles;
+}
+

data/node_modules/govuk-frontend/dist/govuk/components/details/_index.scss

@@ -1,143 +1,5 @@
-@import "../../base";
+@use "../../custom-properties";
+@use "mixin";
 
-@include govuk-exports("govuk/component/details") {
-  .govuk-details {
-    @include govuk-font($size: 19);
-    @include govuk-responsive-margin(6, "bottom");
+@include mixin.styles;
 
-    display: block;
-    color: govuk-functional-colour(text);
-  }
-
-  .govuk-details__summary {
-    display: block;
-  }
-
-  .govuk-details[open] .govuk-details__summary {
-    margin-bottom: govuk-spacing(1);
-  }
-
-  .govuk-details__summary-text {
-    > :first-child {
-      margin-top: 0;
-    }
-
-    > :only-child,
-    > :last-child {
-      margin-bottom: 0;
-    }
-  }
-
-  .govuk-details__text {
-    padding-top: govuk-spacing(3);
-    padding-bottom: govuk-spacing(3);
-    padding-left: govuk-spacing(4);
-  }
-
-  .govuk-details__text p {
-    margin-top: 0;
-    margin-bottom: govuk-spacing(4);
-  }
-
-  .govuk-details__text > :last-child {
-    margin-bottom: 0;
-  }
-
-  // Hack to target IE8 - IE11 (and REALLY old Firefox)
-  // These browsers don't support the details element, so fall back to looking
-  // like inset text
-  @media screen\0 {
-    .govuk-details {
-      border-left: $govuk-border-width-wide solid;
-      border-left-color: govuk-functional-colour(border);
-    }
-
-    .govuk-details__summary {
-      margin-top: govuk-spacing(3);
-    }
-
-    .govuk-details__summary-text {
-      @include govuk-typography-weight-bold;
-      @include govuk-responsive-margin(4, "bottom");
-      padding-left: govuk-spacing(4);
-    }
-  }
-
-  // We wrap styles for newer browsers in a feature query, which is ignored by
-  // older browsers, which always expand the details element.
-  //
-  // Additionally, -ms-ime-align is only supported by Edge 12 - 18
-  //
-  // This ensures we don't use these styles in browsers which:
-  //   - support ES6 modules but not the <details> element (Edge 16 - 18)
-  //   - do not support ES6 modules or the <details> element (eg, IE8+)
-  @supports not (-ms-ime-align: auto) {
-    .govuk-details__summary {
-      // Absolutely position the marker against this element
-      position: relative;
-
-      // Make the focus outline shrink-wrap the text content of the summary
-      width: -webkit-fit-content;
-      width: fit-content;
-
-      // Allow for absolutely positioned marker and align with disclosed text
-      padding-left: govuk-spacing(4) + $govuk-border-width;
-
-      // Style the summary to look like a link...
-      color: govuk-functional-colour(link);
-      cursor: pointer;
-
-      &:hover {
-        color: govuk-functional-colour(link-hover);
-      }
-
-      &:focus {
-        @include govuk-focused-text;
-      }
-    }
-    // ...but only underline the text, not the arrow
-    .govuk-details__summary-text {
-      @include govuk-link-decoration;
-    }
-
-    .govuk-details__summary:hover .govuk-details__summary-text {
-      @include govuk-link-hover-decoration;
-    }
-
-    // Remove the underline when focussed to avoid duplicate borders
-    .govuk-details__summary:focus .govuk-details__summary-text {
-      text-decoration: none;
-    }
-
-    // Remove the default details marker so we can style our own consistently and
-    // ensure it displays in Firefox (see implementation.md for details)
-    .govuk-details__summary::-webkit-details-marker {
-      display: none;
-    }
-
-    // Append our own open / closed marker using a pseudo-element
-    .govuk-details__summary::before {
-      content: "";
-      position: absolute;
-
-      top: -1px;
-      bottom: 0;
-      left: 0;
-
-      margin: auto;
-
-      @include govuk-shape-arrow($direction: right, $base: 14px);
-
-      .govuk-details[open] > & {
-        @include govuk-shape-arrow($direction: down, $base: 14px);
-      }
-    }
-
-    .govuk-details__text {
-      border-left: $govuk-border-width solid;
-      border-left-color: govuk-functional-colour(border);
-    }
-  }
-}
-
-/*# sourceMappingURL=_index.scss.map */

data/node_modules/govuk-frontend/dist/govuk/components/details/_mixin.scss

@@ -0,0 +1,143 @@
+@use "../../base";
+
+/// @access private
+@mixin styles {
+  .govuk-details {
+    @include base.govuk-font($size: 19);
+    @include base.govuk-responsive-margin(6, "bottom");
+
+    display: block;
+    color: base.govuk-functional-colour(text);
+  }
+
+  .govuk-details__summary {
+    display: block;
+  }
+
+  .govuk-details[open] .govuk-details__summary {
+    margin-bottom: base.govuk-spacing(1);
+  }
+
+  .govuk-details__summary-text {
+    > :first-child {
+      margin-top: 0;
+    }
+
+    > :only-child,
+    > :last-child {
+      margin-bottom: 0;
+    }
+  }
+
+  .govuk-details__text {
+    padding-top: base.govuk-spacing(3);
+    padding-bottom: base.govuk-spacing(3);
+    padding-left: base.govuk-spacing(4);
+  }
+
+  .govuk-details__text p {
+    margin-top: 0;
+    margin-bottom: base.govuk-spacing(4);
+  }
+
+  .govuk-details__text > :last-child {
+    margin-bottom: 0;
+  }
+
+  // Hack to target IE8 - IE11 (and REALLY old Firefox)
+  // These browsers don't support the details element, so fall back to looking
+  // like inset text
+  @media screen\0 {
+    .govuk-details {
+      border-left: base.$govuk-border-width-wide solid;
+      border-left-color: base.govuk-functional-colour(border);
+    }
+
+    .govuk-details__summary {
+      margin-top: base.govuk-spacing(3);
+    }
+
+    .govuk-details__summary-text {
+      @include base.govuk-typography-weight-bold;
+      @include base.govuk-responsive-margin(4, "bottom");
+      padding-left: base.govuk-spacing(4);
+    }
+  }
+
+  // We wrap styles for newer browsers in a feature query, which is ignored by
+  // older browsers, which always expand the details element.
+  //
+  // Additionally, -ms-ime-align is only supported by Edge 12 - 18
+  //
+  // This ensures we don't use these styles in browsers which:
+  //   - support ES6 modules but not the <details> element (Edge 16 - 18)
+  //   - do not support ES6 modules or the <details> element (eg, IE8+)
+  @supports not (-ms-ime-align: auto) {
+    .govuk-details__summary {
+      // Absolutely position the marker against this element
+      position: relative;
+
+      // Make the focus outline shrink-wrap the text content of the summary
+      width: -webkit-fit-content;
+      width: fit-content;
+
+      // Allow for absolutely positioned marker and align with disclosed text
+      padding-left: base.govuk-spacing(4) + base.$govuk-border-width;
+
+      // Style the summary to look like a link...
+      color: base.govuk-functional-colour(link);
+      cursor: pointer;
+
+      &:hover {
+        color: base.govuk-functional-colour(link-hover);
+      }
+
+      &:focus {
+        @include base.govuk-focused-text;
+      }
+    }
+    // ...but only underline the text, not the arrow
+    .govuk-details__summary-text {
+      @include base.govuk-link-decoration;
+    }
+
+    .govuk-details__summary:hover .govuk-details__summary-text {
+      @include base.govuk-link-hover-decoration;
+    }
+
+    // Remove the underline when focussed to avoid duplicate borders
+    .govuk-details__summary:focus .govuk-details__summary-text {
+      text-decoration: none;
+    }
+
+    // Remove the default details marker so we can style our own consistently and
+    // ensure it displays in Firefox (see implementation.md for details)
+    .govuk-details__summary::-webkit-details-marker {
+      display: none;
+    }
+
+    // Append our own open / closed marker using a pseudo-element
+    .govuk-details__summary::before {
+      content: "";
+      position: absolute;
+
+      top: -1px;
+      bottom: 0;
+      left: 0;
+
+      margin: auto;
+
+      @include base.govuk-shape-arrow($direction: right, $base: 14px);
+
+      .govuk-details[open] > & {
+        @include base.govuk-shape-arrow($direction: down, $base: 14px);
+      }
+    }
+
+    .govuk-details__text {
+      border-left: base.$govuk-border-width solid;
+      border-left-color: base.govuk-functional-colour(border);
+    }
+  }
+}
+

data/node_modules/govuk-frontend/dist/govuk/components/error-message/_error-message.import.scss

@@ -0,0 +1,6 @@
+@use "../../settings/warnings--internal";
+
+@include warnings--internal.component-scss-file-warning("error-message");
+
+@import "index";
+

data/node_modules/govuk-frontend/dist/govuk/components/error-message/_index.import.scss

@@ -0,0 +1,8 @@
+@use "mixin";
+
+@import "../../base";
+
+@include govuk-exports("govuk/component/error-message") {
+  @include mixin.styles;
+}
+

data/node_modules/govuk-frontend/dist/govuk/components/error-message/_index.scss

@@ -1,16 +1,5 @@
-@import "../../base";
+@use "../../custom-properties";
+@use "mixin";
 
-@include govuk-exports("govuk/component/error-message") {
-  .govuk-error-message {
-    @include govuk-font($size: 19, $weight: bold);
+@include mixin.styles;
 
-    display: block;
-    margin-top: 0; // Reset any default browser margins for paragraphs
-    margin-bottom: govuk-spacing(3);
-    clear: both;
-
-    color: govuk-functional-colour(error);
-  }
-}
-
-/*# sourceMappingURL=_index.scss.map */

data/node_modules/govuk-frontend/dist/govuk/components/error-message/_mixin.scss

@@ -0,0 +1,16 @@
+@use "../../base";
+
+/// @access private
+@mixin styles {
+  .govuk-error-message {
+    @include base.govuk-font($size: 19, $weight: bold);
+
+    display: block;
+    margin-top: 0; // Reset any default browser margins for paragraphs
+    margin-bottom: base.govuk-spacing(3);
+    clear: both;
+
+    color: base.govuk-functional-colour(error);
+  }
+}
+

data/node_modules/govuk-frontend/dist/govuk/components/error-summary/_error-summary.import.scss

@@ -0,0 +1,6 @@
+@use "../../settings/warnings--internal";
+
+@include warnings--internal.component-scss-file-warning("error-summary");
+
+@import "index";
+

data/node_modules/govuk-frontend/dist/govuk/components/error-summary/_index.import.scss

@@ -0,0 +1,8 @@
+@use "mixin";
+
+@import "../../base";
+
+@include govuk-exports("govuk/component/error-summary") {
+  @include mixin.styles;
+}
+

data/node_modules/govuk-frontend/dist/govuk/components/error-summary/_index.scss

@@ -1,60 +1,6 @@
-@import "../../base";
+@use "../../custom-properties";
 
-@import "../../core/lists";
+@use "mixin";
 
-@include govuk-exports("govuk/component/error-summary") {
-  .govuk-error-summary {
-    @include govuk-font($size: 19);
-    @include govuk-responsive-padding(4);
-    @include govuk-responsive-margin(8, "bottom");
+@include mixin.styles;
 
-    border: $govuk-border-width solid;
-    border-color: govuk-functional-colour(error);
-    color: govuk-functional-colour(text);
-
-    &:focus {
-      outline: $govuk-focus-width solid;
-      outline-color: govuk-functional-colour(focus);
-    }
-  }
-
-  .govuk-error-summary__title {
-    @include govuk-font-size($size: 24);
-    @include govuk-typography-weight-bold;
-
-    margin-top: 0;
-    @include govuk-responsive-margin(4, "bottom");
-  }
-
-  .govuk-error-summary__body {
-    p {
-      margin-bottom: 0;
-    }
-
-    > * + * {
-      @include govuk-responsive-margin(4, "top");
-    }
-
-    > :last-child {
-      @include govuk-responsive-margin(1, "bottom");
-    }
-  }
-
-  // Cross-component class - adjusts styling of list component
-  .govuk-error-summary__list {
-    margin-bottom: 0;
-  }
-
-  // Remove the bottom margin from the last list item
-  .govuk-error-summary__list li:last-child {
-    margin-bottom: 0;
-  }
-
-  .govuk-error-summary__list a {
-    @include govuk-typography-weight-bold;
-    @include govuk-link-common;
-    @include govuk-link-style-error;
-  }
-}
-
-/*# sourceMappingURL=_index.scss.map */