govuk_tech_docs 6.3.0.beta → 6.3.0

data/node_modules/govuk-frontend/dist/govuk/core/_index.scss

@@ -1,11 +1,7 @@
-@import "../settings/global-styles";
-@import "../tools/exports";
-@import "../helpers/colour";
-@import "../helpers/links";
-@import "links";
-@import "lists";
-@import "typography";
-@import "section-break";
-@import "global-styles";
+@use "../custom-properties";
+@use "links";
+@use "lists";
+@use "typography";
+@use "section-break";
+@use "global-styles";
 
-/*# sourceMappingURL=_index.scss.map */

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

@@ -0,0 +1,10 @@
+@use "links.mixin" as mixin;
+@use "../tools/exports" as *;
+
+@import "../base";
+@import "../custom-properties";
+
+@include govuk-exports("govuk/core/links") {
+  @include mixin.styles;
+}
+

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

@@ -0,0 +1,44 @@
+@use "../base";
+
+/// @access private
+@mixin styles {
+  %govuk-link {
+    @include base.govuk-link-common;
+    @include base.govuk-link-style-default;
+    @include base.govuk-link-print-friendly;
+  }
+
+  .govuk-link {
+    @extend %govuk-link;
+  }
+
+  // Variant classes should always be used in conjunction with the .govuk-link
+  // class, so we do not need the common link styles as they will be inherited.
+
+  .govuk-link--muted {
+    @include base.govuk-link-style-muted;
+  }
+
+  .govuk-link--text-colour {
+    @include base.govuk-link-style-text;
+  }
+
+  .govuk-link--inverse {
+    @include base.govuk-link-style-inverse;
+  }
+
+  .govuk-link--no-underline {
+    @include base.govuk-link-style-no-underline;
+  }
+
+  .govuk-link--no-visited-state {
+    @include base.govuk-link-style-no-visited-state;
+  }
+
+  // Links that only contain images
+
+  .govuk-link-image {
+    @include base.govuk-link-image;
+  }
+}
+

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

@@ -1,50 +1,5 @@
-@import "../settings/links";
-@import "../settings/measurements";
-@import "../tools/exports";
-@import "../helpers/colour";
-@import "../helpers/focused";
-@import "../helpers/links";
-@import "../helpers/typography";
+@use "../custom-properties";
+@use "links.mixin" as mixin;
 
-@include govuk-exports("govuk/core/links") {
-  %govuk-link {
-    @include govuk-link-common;
-    @include govuk-link-style-default;
-    @include govuk-link-print-friendly;
-  }
+@include mixin.styles;
 
-  .govuk-link {
-    @extend %govuk-link;
-  }
-
-  // Variant classes should always be used in conjunction with the .govuk-link
-  // class, so we do not need the common link styles as they will be inherited.
-
-  .govuk-link--muted {
-    @include govuk-link-style-muted;
-  }
-
-  .govuk-link--text-colour {
-    @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;
-  }
-
-  // Links that only contain images
-
-  .govuk-link-image {
-    @include govuk-link-image;
-  }
-}
-
-/*# sourceMappingURL=_links.scss.map */

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

@@ -0,0 +1,14 @@
+@use "lists.mixin" as mixin;
+
+@import "../base";
+
+// This is only needed for consistency between `importing` and `using` base.
+// In an `@use` world, lists have to `use` typography for the placeholder classes
+// to be extended correctly, and this results in the typography CSS being
+// outputted before lists.
+@import "typography";
+
+@include govuk-exports("govuk/core/lists") {
+  @include mixin.styles;
+}
+

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

@@ -0,0 +1,74 @@
+@use "../base";
+
+/// @access private
+@mixin styles {
+  %govuk-list {
+    @include base.govuk-font($size: 19);
+
+    // Keep margin configuration next to each other
+    // stylelint-disable order/order-properties
+    margin-top: 0;
+    @include base.govuk-responsive-margin(4, "bottom");
+    // stylelint-enable order/order-properties
+
+    padding-left: 0;
+    list-style-type: none;
+    color: base.govuk-functional-colour(text);
+
+    // Add a top margin for nested lists
+    %govuk-list {
+      margin-top: base.govuk-spacing(2);
+    }
+  }
+
+  %govuk-list > li {
+    // Lists without numbers or bullets should always have extra space between
+    // list items. Lists with numbers or bullets only have this extra space on
+    // tablet and above
+    margin-bottom: base.govuk-spacing(1);
+  }
+
+  .govuk-list {
+    @extend %govuk-list;
+  }
+
+  %govuk-list--bullet {
+    padding-left: base.govuk-spacing(4);
+    list-style-type: disc;
+  }
+
+  %govuk-list--number {
+    padding-left: base.govuk-spacing(4);
+    list-style-type: decimal;
+  }
+
+  %govuk-list--bullet > li,
+  %govuk-list--number > li {
+    margin-bottom: 0;
+
+    @media #{base.govuk-from-breakpoint(tablet)} {
+      margin-bottom: base.govuk-spacing(1);
+    }
+  }
+
+  %govuk-list--spaced > li {
+    margin-bottom: base.govuk-spacing(2);
+
+    @media #{base.govuk-from-breakpoint(tablet)} {
+      margin-bottom: base.govuk-spacing(3);
+    }
+  }
+
+  .govuk-list--bullet {
+    @extend %govuk-list--bullet;
+  }
+
+  .govuk-list--number {
+    @extend %govuk-list--number;
+  }
+
+  .govuk-list--spaced {
+    @extend %govuk-list--spaced;
+  }
+}
+

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

@@ -1,76 +1,9 @@
-@import "../tools/exports";
-@import "../helpers/colour";
-@import "../helpers/typography";
+@use "../custom-properties";
+@use "lists.mixin" as mixin;
 
-@include govuk-exports("govuk/core/lists") {
-  %govuk-list {
-    @include govuk-font($size: 19);
+// We need to use typography in order to extend the %govuk-list placeholder
+// classes in the typography mixin
+@use "typography";
 
-    // Keep margin configuration next to each other
-    // stylelint-disable order/order-properties
-    margin-top: 0;
-    @include govuk-responsive-margin(4, "bottom");
-    // stylelint-enable order/order-properties
+@include mixin.styles;
 
-    padding-left: 0;
-    list-style-type: none;
-    color: govuk-functional-colour(text);
-
-    // Add a top margin for nested lists
-    %govuk-list {
-      margin-top: govuk-spacing(2);
-    }
-  }
-
-  %govuk-list > li {
-    // Lists without numbers or bullets should always have extra space between
-    // list items. Lists with numbers or bullets only have this extra space on
-    // tablet and above
-    margin-bottom: govuk-spacing(1);
-  }
-
-  .govuk-list {
-    @extend %govuk-list;
-  }
-
-  %govuk-list--bullet {
-    padding-left: govuk-spacing(4);
-    list-style-type: disc;
-  }
-
-  %govuk-list--number {
-    padding-left: govuk-spacing(4);
-    list-style-type: decimal;
-  }
-
-  %govuk-list--bullet > li,
-  %govuk-list--number > li {
-    margin-bottom: 0;
-
-    @media #{govuk-from-breakpoint(tablet)} {
-      margin-bottom: govuk-spacing(1);
-    }
-  }
-
-  %govuk-list--spaced > li {
-    margin-bottom: govuk-spacing(2);
-
-    @media #{govuk-from-breakpoint(tablet)} {
-      margin-bottom: govuk-spacing(3);
-    }
-  }
-
-  .govuk-list--bullet {
-    @extend %govuk-list--bullet;
-  }
-
-  .govuk-list--number {
-    @extend %govuk-list--number;
-  }
-
-  .govuk-list--spaced {
-    @extend %govuk-list--spaced;
-  }
-}
-
-/*# sourceMappingURL=_lists.scss.map */

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

@@ -0,0 +1,8 @@
+@use "section-break.mixin" as mixin;
+
+@import "../base";
+
+@include govuk-exports("govuk/core/section-break") {
+  @include mixin.styles;
+}
+

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

@@ -0,0 +1,54 @@
+@use "../base";
+
+/// @access private
+@mixin styles {
+  %govuk-section-break {
+    margin: 0;
+    border: 0;
+  }
+
+  .govuk-section-break {
+    @extend %govuk-section-break;
+  }
+
+  // Sizes
+
+  %govuk-section-break--xl {
+    @include base.govuk-responsive-margin(8, "top");
+    @include base.govuk-responsive-margin(8, "bottom");
+  }
+
+  .govuk-section-break--xl {
+    @extend %govuk-section-break--xl;
+  }
+
+  %govuk-section-break--l {
+    @include base.govuk-responsive-margin(6, "top");
+    @include base.govuk-responsive-margin(6, "bottom");
+  }
+
+  .govuk-section-break--l {
+    @extend %govuk-section-break--l;
+  }
+
+  %govuk-section-break--m {
+    @include base.govuk-responsive-margin(4, "top");
+    @include base.govuk-responsive-margin(4, "bottom");
+  }
+
+  .govuk-section-break--m {
+    @extend %govuk-section-break--m;
+  }
+
+  // Visible variant
+
+  %govuk-section-break--visible {
+    border-bottom: 1px solid;
+    border-bottom-color: base.govuk-functional-colour(border);
+  }
+
+  .govuk-section-break--visible {
+    @extend %govuk-section-break--visible;
+  }
+}
+

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

@@ -1,57 +1,5 @@
-@import "../settings/spacing";
-@import "../tools/exports";
-@import "../helpers/colour";
-@import "../helpers/spacing";
+@use "../custom-properties";
+@use "section-break.mixin" as mixin;
 
-@include govuk-exports("govuk/core/section-break") {
-  %govuk-section-break {
-    margin: 0;
-    border: 0;
-  }
+@include mixin.styles;
 
-  .govuk-section-break {
-    @extend %govuk-section-break;
-  }
-
-  // Sizes
-
-  %govuk-section-break--xl {
-    @include govuk-responsive-margin(8, "top");
-    @include govuk-responsive-margin(8, "bottom");
-  }
-
-  .govuk-section-break--xl {
-    @extend %govuk-section-break--xl;
-  }
-
-  %govuk-section-break--l {
-    @include govuk-responsive-margin(6, "top");
-    @include govuk-responsive-margin(6, "bottom");
-  }
-
-  .govuk-section-break--l {
-    @extend %govuk-section-break--l;
-  }
-
-  %govuk-section-break--m {
-    @include govuk-responsive-margin(4, "top");
-    @include govuk-responsive-margin(4, "bottom");
-  }
-
-  .govuk-section-break--m {
-    @extend %govuk-section-break--m;
-  }
-
-  // Visible variant
-
-  %govuk-section-break--visible {
-    border-bottom: 1px solid;
-    border-bottom-color: govuk-functional-colour(border);
-  }
-
-  .govuk-section-break--visible {
-    @extend %govuk-section-break--visible;
-  }
-}
-
-/*# sourceMappingURL=_section-break.scss.map */

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

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

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

@@ -0,0 +1,173 @@
+@use "../base";
+
+/// @access private
+@mixin styles {
+  // Headings
+  %govuk-heading-xl {
+    @include base.govuk-font($size: 48, $weight: bold);
+
+    display: block;
+
+    margin-top: 0;
+    color: base.govuk-functional-colour(text);
+    @include base.govuk-responsive-margin(8, "bottom");
+  }
+
+  .govuk-heading-xl {
+    @extend %govuk-heading-xl;
+  }
+
+  %govuk-heading-l {
+    @include base.govuk-font($size: 36, $weight: bold);
+
+    display: block;
+
+    margin-top: 0;
+    color: base.govuk-functional-colour(text);
+    @include base.govuk-responsive-margin(6, "bottom");
+  }
+
+  .govuk-heading-l {
+    @extend %govuk-heading-l;
+  }
+
+  %govuk-heading-m {
+    @include base.govuk-font($size: 24, $weight: bold);
+
+    display: block;
+
+    margin-top: 0;
+    color: base.govuk-functional-colour(text);
+    @include base.govuk-responsive-margin(4, "bottom");
+  }
+
+  .govuk-heading-m {
+    @extend %govuk-heading-m;
+  }
+
+  %govuk-heading-s {
+    @include base.govuk-font($size: 19, $weight: bold);
+
+    display: block;
+
+    margin-top: 0;
+    color: base.govuk-functional-colour(text);
+    @include base.govuk-responsive-margin(4, "bottom");
+  }
+
+  .govuk-heading-s {
+    @extend %govuk-heading-s;
+  }
+
+  // Captions to be used inside headings
+
+  .govuk-caption-xl {
+    @include base.govuk-font($size: 27);
+
+    display: block;
+
+    margin-bottom: base.govuk-spacing(1);
+
+    color: base.govuk-functional-colour(secondary-text);
+  }
+
+  .govuk-caption-l {
+    @include base.govuk-font($size: 24);
+
+    display: block;
+
+    margin-bottom: base.govuk-spacing(1);
+    color: base.govuk-functional-colour(secondary-text);
+
+    @media #{base.govuk-from-breakpoint(tablet)} {
+      margin-bottom: 0;
+    }
+  }
+
+  .govuk-caption-m {
+    @include base.govuk-font($size: 19);
+
+    display: block;
+
+    color: base.govuk-functional-colour(secondary-text);
+  }
+
+  // Body (paragraphs)
+
+  %govuk-body-l {
+    margin-top: 0;
+    color: base.govuk-functional-colour(text);
+    @include base.govuk-font($size: 24);
+    @include base.govuk-responsive-margin(6, "bottom");
+  }
+
+  .govuk-body-l {
+    @extend %govuk-body-l;
+  }
+
+  %govuk-body-m {
+    margin-top: 0;
+    color: base.govuk-functional-colour(text);
+    @include base.govuk-font($size: 19);
+    @include base.govuk-responsive-margin(4, "bottom");
+  }
+
+  .govuk-body-m {
+    @extend %govuk-body-m;
+  }
+
+  %govuk-body-s {
+    margin-top: 0;
+    color: base.govuk-functional-colour(text);
+    @include base.govuk-font($size: 16);
+    @include base.govuk-responsive-margin(4, "bottom");
+  }
+
+  .govuk-body-s {
+    @extend %govuk-body-s;
+  }
+
+  // Usage aliases
+
+  // Using extend to alias means we also inherit any contextual adjustments that
+  // refer to the 'original' class name
+
+  .govuk-body-lead {
+    @extend %govuk-body-l;
+  }
+
+  .govuk-body {
+    @extend %govuk-body-m;
+  }
+
+  // Contextual adjustments
+  // Add top padding to headings that appear directly after paragraphs.
+
+  %govuk-body-l + %govuk-heading-l {
+    padding-top: base.govuk-spacing(1);
+
+    @media #{base.govuk-from-breakpoint(tablet)} {
+      padding-top: base.govuk-spacing(2);
+    }
+  }
+
+  %govuk-body-m + %govuk-heading-l,
+  %govuk-body-s + %govuk-heading-l,
+  %govuk-list + %govuk-heading-l {
+    @include base.govuk-responsive-padding(4, "top");
+  }
+
+  %govuk-body-m + %govuk-heading-m,
+  %govuk-body-s + %govuk-heading-m,
+  %govuk-list + %govuk-heading-m,
+  %govuk-body-m + %govuk-heading-s,
+  %govuk-body-s + %govuk-heading-s,
+  %govuk-list + %govuk-heading-s {
+    padding-top: base.govuk-spacing(1);
+
+    @media #{base.govuk-from-breakpoint(tablet)} {
+      padding-top: base.govuk-spacing(2);
+    }
+  }
+}
+