defra_ruby_template 3.13.0

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

@@ -0,0 +1,192 @@
+@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") {
+
+  // Headings
+
+  %govuk-heading-xl {
+    @include govuk-text-colour;
+    @include govuk-font($size: 48, $weight: bold);
+
+    display: block;
+
+    margin-top: 0;
+    @include govuk-responsive-margin(8, "bottom");
+  }
+
+  .govuk-heading-xl {
+    @extend %govuk-heading-xl;
+  }
+
+  %govuk-heading-l {
+    @include govuk-text-colour;
+    @include govuk-font($size: 36, $weight: bold);
+
+    display: block;
+
+    margin-top: 0;
+    @include govuk-responsive-margin(6, "bottom");
+  }
+
+  .govuk-heading-l {
+    @extend %govuk-heading-l;
+  }
+
+  %govuk-heading-m {
+    @include govuk-text-colour;
+    @include govuk-font($size: 24, $weight: bold);
+
+    display: block;
+
+    margin-top: 0;
+    @include govuk-responsive-margin(4, "bottom");
+  }
+
+  .govuk-heading-m {
+    @extend %govuk-heading-m;
+  }
+
+  %govuk-heading-s {
+    @include govuk-text-colour;
+    @include govuk-font($size: 19, $weight: bold);
+
+    display: block;
+
+    margin-top: 0;
+    @include govuk-responsive-margin(4, "bottom");
+  }
+
+  .govuk-heading-s {
+    @extend %govuk-heading-s;
+  }
+
+  // Captions to be used inside headings
+
+  .govuk-caption-xl {
+    @include govuk-font($size: 27);
+
+    display: block;
+
+    margin-bottom: govuk-spacing(1);
+
+    color: $govuk-secondary-text-colour;
+  }
+
+  .govuk-caption-l {
+    @include govuk-font($size: 24);
+
+    display: block;
+
+    margin-bottom: govuk-spacing(1);
+    color: $govuk-secondary-text-colour;
+
+    @include govuk-media-query($from: tablet) {
+      margin-bottom: 0;
+    }
+  }
+
+  .govuk-caption-m {
+    @include govuk-font($size: 19);
+
+    display: block;
+
+    color: $govuk-secondary-text-colour;
+  }
+
+  // Body (paragraphs)
+
+  %govuk-body-l {
+    @include govuk-text-colour;
+    @include govuk-font($size: 24);
+
+    margin-top: 0;
+    @include govuk-responsive-margin(6, "bottom");
+  }
+
+  .govuk-body-l {
+    @extend %govuk-body-l;
+  }
+
+  %govuk-body-m {
+    @include govuk-text-colour;
+    @include govuk-font($size: 19);
+
+    margin-top: 0;
+    @include govuk-responsive-margin(4, "bottom");
+  }
+
+  .govuk-body-m {
+    @extend %govuk-body-m;
+  }
+
+  %govuk-body-s {
+    @include govuk-text-colour;
+    @include govuk-font($size: 16);
+
+    margin-top: 0;
+    @include govuk-responsive-margin(4, "bottom");
+  }
+
+  .govuk-body-s {
+    @extend %govuk-body-s;
+  }
+
+  %govuk-body-xs {
+    @include govuk-text-colour;
+    @include govuk-font($size: 14);
+
+    margin-top: 0;
+    @include govuk-responsive-margin(4, "bottom");
+  }
+
+  .govuk-body-xs {
+    @extend %govuk-body-xs;
+  }
+
+  // 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: govuk-spacing(1);
+
+    @include govuk-media-query($from: tablet) {
+      padding-top: govuk-spacing(2);
+    }
+  }
+
+  %govuk-body-m  + %govuk-heading-l,
+  %govuk-body-s  + %govuk-heading-l,
+  %govuk-list + %govuk-heading-l {
+    @include 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: govuk-spacing(1);
+
+    @include govuk-media-query($from: tablet) {
+      padding-top: govuk-spacing(2);
+    }
+  }
+}

data/vendor/assets/stylesheets/defra_ruby_template.scss

@@ -0,0 +1,16 @@
+@import "settings/all";
+
+// Using Rails with the asset pipeline so set the helper methods
+$govuk-font-url-function: 'image-url';
+$govuk-image-url-function: 'font-url';
+
+@import "tools/all";
+@import "helpers/all";
+
+@import "core/all";
+@import "objects/all";
+
+@import "components/all";
+
+@import "utilities/all";
+@import "overrides/all";

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

@@ -0,0 +1,12 @@
+@import "clearfix";
+@import "colour";
+@import "device-pixels";
+@import "focused";
+@import "font-faces";
+@import "grid";
+@import "links";
+@import "media-queries";
+@import "shape-arrow";
+@import "spacing";
+@import "typography";
+@import "visually-hidden";

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

@@ -0,0 +1,15 @@
+////
+/// @group helpers/layout
+////
+
+/// Clear floated content within a container using a pseudo element
+///
+/// @access public
+
+@mixin govuk-clearfix {
+  &:after {
+    content: "";
+    display: block;
+    clear: both;
+  }
+}

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

@@ -0,0 +1,95 @@
+@import "../settings/compatibility";
+@import "../settings/colours-palette";
+@import "../settings/colours-organisations";
+
+////
+/// @group helpers/colour
+////
+
+/// Get colour
+///
+/// @param {String} $colour - Name of colour from the colour palette
+///   (`$govuk-colours`)
+/// @param {String} $legacy - Either the name of colour from the legacy palette
+///   or a colour literal, to return instead when in 'legacy mode' - matching
+///   the palette from GOV.UK Template, Elements or Frontend Toolkit
+/// @return {Colour} Representation of named colour
+///
+/// @example scss - Using legacy colours from the palette
+///  .foo {
+///    background-colour: govuk-colour("mid-grey", $legacy: "grey-2");
+///  }
+///
+/// @example scss - Using legacy colour literals
+///  .foo {
+///    background-colour: govuk-colour("green", $legacy: #BADA55);
+///  }
+///
+/// @throw if `$colour` is not a colour from the colour palette
+/// @access public
+
+@function govuk-colour($colour, $legacy: false) {
+  @if ($govuk-use-legacy-palette and $legacy) {
+    @if (type-of($legacy) == "color") {
+      @return $legacy;
+    }
+    $colour: $legacy;
+  }
+
+  $colour: quote($colour);
+
+  @if not map-has-key($govuk-colours, $colour) {
+    @error "Unknown colour `#{$colour}`";
+  }
+
+  @return map-get($govuk-colours, $colour);
+}
+
+/// 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.
+///
+/// @return {Colour} Representation of colour for organisation
+/// @throw if `$organisation` is not a known organisation
+/// @access public
+
+@function govuk-organisation-colour($organisation, $websafe: true) {
+  @if not map-has-key($govuk-colours-organisations, $organisation) {
+    @error "Unknown organisation `#{$organisation}`";
+  }
+
+  $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);
+  } @else {
+    @return map-get($org-colour, colour);
+  }
+}
+
+/// Make a colour darker by mixing it with black
+///
+/// @param {Colour} $colour - colour to shade
+/// @param {Number} $percentage - percentage of `$colour` in returned color
+/// @return {Colour}
+/// @access public
+
+@function govuk-shade($colour, $percentage) {
+  @return mix(#000000, $colour, $percentage);
+}
+
+/// Make a colour lighter by mixing it with white
+///
+/// @param {Colour} $colour - colour to tint
+/// @param {Number} $percentage - percentage of `$colour` in returned color
+/// @return {Colour}
+/// @access public
+
+@function govuk-tint($colour, $percentage) {
+  @return mix(govuk-colour("white"), $colour, $percentage);
+}

data/vendor/assets/stylesheets/helpers/_device-pixels.scss

@@ -0,0 +1,37 @@
+////
+/// @group helpers
+////
+
+/// Media query for retina images (device-pixel-ratio)
+///
+/// @param {Number} $ratio [2] - Device pixel ratio
+/// @content Passed content will be outputted within the media query
+///
+/// @example scss - Providing a @2x image for screens that support it
+///   background-image: govuk-image-url("my-image.png");
+///
+///   @include govuk-device-pixel-ratio {
+///     background-image: govuk-image-url("my-image-2x.png");
+///   }
+///
+/// @example scss - Using a custom ratio
+///   background-image: govuk-image-url("my-image.png");
+///
+///   @include govuk-device-pixel-ratio {
+///     background-image: govuk-image-url("my-image-2x.png");
+///   }
+///
+///   @include govuk-device-pixel-ratio(3) {
+///     background-image: govuk-image-url("my-image-3x.png");
+///   }
+///
+/// @access public
+
+@mixin govuk-device-pixel-ratio($ratio: 2) {
+  // stylelint-disable indentation
+  @media only screen and (-webkit-min-device-pixel-ratio: $ratio),
+    only screen and (min-resolution: #{($ratio * 96)}dpi),
+    only screen and (min-resolution: #{$ratio}dppx) {
+      @content;
+    }
+}

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

@@ -0,0 +1,28 @@
+////
+/// @group helpers/accessibility
+////
+
+/// Focused text
+///
+/// Provides an outline to clearly indicate when the target element is focused.
+/// Used for interactive text-based elements.
+///
+/// @access public
+
+@mixin govuk-focused-text {
+  // When colours are overridden, for example when users have a dark mode,
+  // backgrounds and box-shadows disappear, so we need to ensure there's a
+  // transparent outline which will be set to a visible colour.
+
+  // Since Internet Explorer 8 does not support box-shadow, we want to force the
+  // user-agent outlines
+  @include govuk-not-ie8 {
+    outline: $govuk-focus-width solid transparent;
+  }
+  color: $govuk-focus-text-colour;
+  background-color: $govuk-focus-colour;
+  box-shadow: 0 -2px $govuk-focus-colour, 0 4px $govuk-focus-text-colour;
+  // When link is focussed, hide the default underline since the
+  // box shadow adds the "underline"
+  text-decoration: none;
+}

data/vendor/assets/stylesheets/helpers/_font-faces.scss

@@ -0,0 +1,41 @@
+////
+/// @group helpers
+////
+
+@import "../tools/exports";
+
+/// Font Face - GDS Transport
+///
+/// Outputs the font-face declaration for GDS Transport at the root of the CSS document
+/// the first time it is called.
+///
+/// @access private
+
+@mixin _govuk-font-face-gds-transport {
+  @include govuk-not-ie8 { // In IE8, which cannot render WOFF format, we fall back to system fonts
+    @include govuk-exports("govuk/helpers/font-faces") {
+      @at-root {
+        /*! Copyright (c) 2011 by Margaret Calvert & Henrik Kubel. All rights reserved. The font has been customised for exclusive use on gov.uk. This cut is not commercially available. */ /* stylelint-disable-line scss/comment-no-loud  */
+        @font-face {
+          font-family: "GDS Transport";
+          font-style: normal;
+          font-weight: normal;
+          src:
+            govuk-font-url("light-94a07e06a1-v2.woff2") format("woff2"),
+            govuk-font-url("light-f591b13f7d-v2.woff") format("woff");
+          font-display: fallback;
+        }
+
+        @font-face {
+          font-family: "GDS Transport";
+          font-style: normal;
+          font-weight: bold;
+          src:
+            govuk-font-url("bold-b542beb274-v2.woff2") format("woff2"),
+            govuk-font-url("bold-affa96571d-v2.woff") format("woff");
+          font-display: fallback;
+        }
+      }
+    }
+  }
+}