govuk_tech_docs 2.2.0 → 2.4.0

data/node_modules/govuk-frontend/govuk/components/tag/_tag.scss

@@ -1,91 +1,2 @@
-@import "../../settings/all";
-@import "../../tools/all";
-@import "../../helpers/all";
-
-@include govuk-exports("govuk/component/tag") {
-  .govuk-tag {
-
-    display: inline-block;
-
-    // When a user customises their colours often the background is removed,
-    // by adding a outline we ensure that the tag component still keeps it's meaning.
-    // https://accessibility.blog.gov.uk/2017/03/27/how-users-change-colours-on-websites/
-    outline: 2px solid transparent;
-    outline-offset: -2px;
-
-    color: govuk-colour("white");
-    background-color: govuk-colour("blue");
-    letter-spacing: 1px;
-
-    text-decoration: none;
-    text-transform: uppercase;
-
-    @if $govuk-use-legacy-font {
-      // Since New Transport sits slightly higher than other common fonts.
-      // We use intentionally uneven padding to make it balanced, this can be
-      // removed using the version of the font that has a more common vertical spacing.
-      @include govuk-font($size: 16, $weight: bold, $line-height: 1.25);
-      padding-top: 4px;
-      padding-right: 8px;
-      padding-bottom: 1px;
-      padding-left: 8px;
-    } @else {
-      @include govuk-font($size: 16, $weight: bold, $line-height: 1);
-      padding-top: 5px;
-      padding-right: 8px;
-      padding-bottom: 4px;
-      padding-left: 8px;
-    }
-  }
-
-  // Deprecated. We'll remove this class in a future release. Use `.govuk-tag--grey` instead.
-  .govuk-tag--inactive {
-    background-color: govuk-colour("dark-grey", $legacy: "grey-1");
-  }
-
-  .govuk-tag--grey {
-    color: govuk-shade(govuk-colour("dark-grey", $legacy: "grey-1"), 30);
-    background: govuk-tint(govuk-colour("dark-grey", $legacy: "grey-1"), 90);
-  }
-
-  .govuk-tag--purple {
-    color: govuk-shade(govuk-colour("purple"), 20);
-    background: govuk-tint(govuk-colour("purple"), 80);
-  }
-
-  .govuk-tag--turquoise {
-    color: govuk-shade(govuk-colour("turquoise"), 60);
-    background: govuk-tint(govuk-colour("turquoise"), 70);
-  }
-
-  .govuk-tag--blue {
-    color: govuk-shade(govuk-colour("blue"), 30);
-    background: govuk-tint(govuk-colour("blue"), 80);
-  }
-
-  .govuk-tag--yellow {
-    color: govuk-shade(govuk-colour("yellow"), 65);
-    background: govuk-tint(govuk-colour("yellow"), 75);
-  }
-
-  .govuk-tag--orange {
-    color: govuk-shade(govuk-colour("orange"), 55);
-    background: govuk-tint(govuk-colour("orange"), 70);
-  }
-
-  .govuk-tag--red {
-    color: govuk-shade(govuk-colour("red"), 30);
-    background: govuk-tint(govuk-colour("red"), 80);
-  }
-
-  .govuk-tag--pink {
-    color: govuk-shade(govuk-colour("pink"), 40);
-    background: govuk-tint(govuk-colour("pink"), 80);
-  }
-
-  .govuk-tag--green {
-    color: govuk-shade(govuk-colour("green"), 20);
-    background: govuk-tint(govuk-colour("green"), 80);
-  }
-
-}
+@import "../../base";
+@import "./index";

data/node_modules/govuk-frontend/govuk/components/textarea/_index.scss

@@ -0,0 +1,47 @@
+@import "../error-message/index";
+@import "../hint/index";
+@import "../label/index";
+
+@include govuk-exports("govuk/component/textarea") {
+  .govuk-textarea {
+    @include govuk-font($size: 19, $line-height: 1.25);
+
+    box-sizing: border-box; // should this be global?
+    display: block;
+    width: 100%;
+    min-height: 40px;
+    @include govuk-responsive-margin(6, "bottom");
+    padding: govuk-spacing(1);
+
+    resize: vertical;
+
+    border: $govuk-border-width-form-element solid $govuk-input-border-colour;
+    border-radius: 0;
+
+    -webkit-appearance: none;
+
+    &:focus {
+      outline: $govuk-focus-width solid $govuk-focus-colour;
+      // Ensure outline appears outside of the element
+      outline-offset: 0;
+      // Double the border by adding its width again. Use `box-shadow` to do
+      // this instead of changing `border-width` (which changes element size) and
+      // since `outline` is already used for the yellow focus state.
+      box-shadow: inset 0 0 0 $govuk-border-width-form-element;
+
+      @include govuk-if-ie8 {
+        // IE8 doesn't support `box-shadow` so double the border with
+        // `border-width`.
+        border-width: $govuk-border-width-form-element * 2;
+      }
+    }
+  }
+
+  .govuk-textarea--error {
+    border: $govuk-border-width-form-element-error solid $govuk-error-colour;
+
+    &:focus {
+      border-color: $govuk-input-border-colour;
+    }
+  }
+}

data/node_modules/govuk-frontend/govuk/components/textarea/_textarea.scss

@@ -1,55 +1,2 @@
-@import "../../settings/all";
-@import "../../tools/all";
-@import "../../helpers/all";
-
-@import "../error-message/error-message";
-@import "../hint/hint";
-@import "../label/label";
-
-@include govuk-exports("govuk/component/textarea") {
-  .govuk-textarea {
-    @include govuk-font($size: 19, $line-height: 1.25);
-
-    box-sizing: border-box; // should this be global?
-    display: block;
-    width: 100%;
-    min-height: 40px;
-    @include govuk-responsive-margin(6, "bottom");
-    padding: govuk-spacing(1);
-
-    resize: vertical;
-
-    border: $govuk-border-width-form-element solid $govuk-input-border-colour;
-    border-radius: 0;
-
-    -webkit-appearance: none;
-
-    &:focus {
-      outline: $govuk-focus-width solid $govuk-focus-colour;
-      // Ensure outline appears outside of the element
-      outline-offset: 0;
-      // Double the border by adding its width again. Use `box-shadow` to do
-      // this instead of changing `border-width` (which changes element size) and
-      // since `outline` is already used for the yellow focus state.
-      box-shadow: inset 0 0 0 $govuk-border-width-form-element;
-
-      @include govuk-if-ie8 {
-        // IE8 doesn't support `box-shadow` so double the border with
-        // `border-width`.
-        border-width: $govuk-border-width-form-element * 2;
-      }
-    }
-  }
-
-  .govuk-textarea--error {
-    border: $govuk-border-width-form-element-error solid $govuk-error-colour;
-
-    &:focus {
-      border-color: $govuk-input-border-colour;
-      // Remove `box-shadow` inherited from `:focus` as `textarea--error`
-      // already has the thicker border.
-      box-shadow: none;
-    }
-
-  }
-}
+@import "../../base";
+@import "./index";

data/node_modules/govuk-frontend/govuk/components/warning-text/_index.scss

@@ -0,0 +1,66 @@
+@include govuk-exports("govuk/component/warning-text") {
+  .govuk-warning-text {
+    position: relative;
+    @include govuk-responsive-margin(6, "bottom");
+    padding: govuk-spacing(2) 0;
+  }
+
+  .govuk-warning-text__assistive {
+    @include govuk-visually-hidden;
+  }
+
+  .govuk-warning-text__icon {
+    @include govuk-font($size: false, $weight: bold);
+
+    box-sizing: border-box;
+
+    display: inline-block;
+
+    position: absolute;
+    left: 0;
+
+    min-width: 35px;
+    min-height: 35px;
+    margin-top: -7px;
+
+    @include govuk-media-query($from: tablet) {
+      margin-top: -5px;
+    }
+
+    // When a user customises their colours the background colour will often be removed.
+    // Adding a border to the component keeps it's shape as a circle.
+    border: 3px solid govuk-colour("black");
+    border-radius: 50%;
+
+    color: govuk-colour("white");
+    background: govuk-colour("black");
+
+    font-size: 30px;
+    line-height: 29px;
+
+    text-align: center;
+
+    // Prevent the exclamation mark from being included when the warning text
+    // is copied, for example.
+    -webkit-user-select: none;
+        -ms-user-select: none;
+            user-select: none;
+
+    // Improve rendering in Windows High Contrast Mode (Edge), where a
+    // readability backplate behind the exclamation mark obscures the circle
+    forced-color-adjust: none;
+
+    @media screen and (forced-colors: active) {
+      border-color: windowText;
+      color: windowText;
+      background: transparent;
+    }
+  }
+
+  .govuk-warning-text__text {
+    @include govuk-font($size: 19, $weight: bold);
+    @include govuk-text-colour;
+    display: block;
+    padding-left: 45px;
+  }
+}

data/node_modules/govuk-frontend/govuk/components/warning-text/_warning-text.scss

@@ -1,60 +1,2 @@
-@import "../../settings/all";
-@import "../../tools/all";
-@import "../../helpers/all";
-
-@include govuk-exports("govuk/component/warning-text") {
-
-  .govuk-warning-text {
-    position: relative;
-    @include govuk-responsive-margin(6, "bottom");
-    padding: govuk-spacing(2) 0;
-  }
-
-  .govuk-warning-text__assistive {
-    @include govuk-visually-hidden;
-  }
-
-  .govuk-warning-text__icon {
-    @include govuk-font($size: false, $weight: bold);
-
-    display: inline-block;
-
-    position: absolute;
-    left: 0;
-
-    min-width: 29px;
-    min-height: 29px;
-    margin-top: -7px;
-
-    @include govuk-media-query($from: tablet) {
-      margin-top: -5px;
-    }
-
-    // When a user customises their colours the background colour will often be removed.
-    // Adding a border to the component keeps it's shape as a circle.
-    border: 3px solid govuk-colour("black");
-    border-radius: 50%;
-
-    color: govuk-colour("white");
-    background: govuk-colour("black");
-
-    font-size: 30px;
-    line-height: 29px;
-
-    text-align: center;
-
-    // Prevent the exclamation mark from being included when the warning text
-    // is copied, for example.
-    -webkit-user-select: none;
-       -moz-user-select: none;
-        -ms-user-select: none;
-            user-select: none;
-  }
-
-  .govuk-warning-text__text {
-    @include govuk-font($size: 19, $weight: bold);
-    @include govuk-text-colour;
-    display: block;
-    padding-left: 45px;
-  }
-}
+@import "../../base";
+@import "./index";

data/node_modules/govuk-frontend/govuk/core/_global-styles.scss

@@ -1,6 +1,8 @@
-@import "../settings/all";
-@import "../tools/all";
-@import "../helpers/all";
+@if not mixin-exists("govuk-exports") {
+  @warn "Importing items from the core layer without first importing `base` is deprecated, and will no longer work as of GOV.UK Frontend v4.0.";
+}
+
+@import "../base";
 
 @import "links";
 @import "typography";

data/node_modules/govuk-frontend/govuk/core/_links.scss

@@ -1,6 +1,8 @@
-@import "../settings/all";
-@import "../tools/all";
-@import "../helpers/all";
+@if not mixin-exists("govuk-exports") {
+  @warn "Importing items from the core layer without first importing `base` is deprecated, and will no longer work as of GOV.UK Frontend v4.0.";
+}
+
+@import "../base";
 
 @include govuk-exports("govuk/core/links") {
 
@@ -25,6 +27,14 @@
     @include govuk-link-style-text;
   }
 
+  .govuk-link--inverse {
+    @include govuk-link-style-inverse;
+  }
+
+  .govuk-link--no-underline {
+    @include govuk-link-style-no-underline;
+  }
+
   .govuk-link--no-visited-state {
     @include govuk-link-style-no-visited-state;
   }

data/node_modules/govuk-frontend/govuk/core/_lists.scss

@@ -1,6 +1,8 @@
-@import "../settings/all";
-@import "../tools/all";
-@import "../helpers/all";
+@if not mixin-exists("govuk-exports") {
+  @warn "Importing items from the core layer without first importing `base` is deprecated, and will no longer work as of GOV.UK Frontend v4.0.";
+}
+
+@import "../base";
 
 @include govuk-exports("govuk/core/lists") {
 
@@ -48,6 +50,14 @@
     }
   }
 
+  %govuk-list--spaced > li {
+    margin-bottom: govuk-spacing(2);
+
+    @include govuk-media-query($from: tablet) {
+      margin-bottom: govuk-spacing(3);
+    }
+  }
+
   .govuk-list--bullet {
     @extend %govuk-list--bullet;
   }
@@ -55,4 +65,8 @@
   .govuk-list--number {
     @extend %govuk-list--number;
   }
+
+  .govuk-list--spaced {
+    @extend %govuk-list--spaced;
+  }
 }

data/node_modules/govuk-frontend/govuk/core/_section-break.scss

@@ -1,6 +1,8 @@
-@import "../settings/all";
-@import "../tools/all";
-@import "../helpers/all";
+@if not mixin-exists("govuk-exports") {
+  @warn "Importing items from the core layer without first importing `base` is deprecated, and will no longer work as of GOV.UK Frontend v4.0.";
+}
+
+@import "../base";
 
 @include govuk-exports("govuk/core/section-break") {
 

data/node_modules/govuk-frontend/govuk/core/_template.scss

@@ -1,6 +1,8 @@
-@import "../settings/all";
-@import "../tools/all";
-@import "../helpers/all";
+@if not mixin-exists("govuk-exports") {
+  @warn "Importing items from the core layer without first importing `base` is deprecated, and will no longer work as of GOV.UK Frontend v4.0.";
+}
+
+@import "../base";
 
 @include govuk-exports("govuk/core/template") {
 
@@ -13,7 +15,6 @@
     // Prevent automatic text sizing, as we already cater for small devices and
     // would like the browser to stay on 100% text zoom by default.
     -webkit-text-size-adjust: 100%;
-       -moz-text-size-adjust: 100%;
         -ms-text-size-adjust: 100%;
             text-size-adjust: 100%;
 

data/node_modules/govuk-frontend/govuk/core/_typography.scss

@@ -1,6 +1,8 @@
-@import "../settings/all";
-@import "../tools/all";
-@import "../helpers/all";
+@if not mixin-exists("govuk-exports") {
+  @warn "Importing items from the core layer without first importing `base` is deprecated, and will no longer work as of GOV.UK Frontend v4.0.";
+}
+
+@import "../base";
 
 @include govuk-exports("govuk/core/typography") {