RubyGems - dxw_govuk_frontend_rails - Versions diffs - 2.9.0.pre.alpha.1 - Mend

dxw_govuk_frontend_rails 2.9.0.pre.alpha.1

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 (134) hide show

data/vendor/assets/stylesheets/settings/_typography-font-families.scss ADDED Viewed

@@ -0,0 +1,22 @@
+////
+/// @group settings/typography
+////
+/// List of font families to use if using NTA (the default font 'stack' for
+/// GOV.UK)
+///
+/// @type List
+/// @access public
+$govuk-font-family-nta: "nta", Arial, sans-serif;
+/// List of font families to use if using the 'tabular numbers' subset of NTA
+/// (the default font 'stack' for GOV.UK)
+///
+/// Because ntatabularnumbers only includes the digits 0-10, all other glyphs
+/// will 'fall-through' the stack to NTA.
+///
+/// @type List
+/// @access public
+$govuk-font-family-nta-tabular: "ntatabularnumbers", $govuk-font-family-nta;

data/vendor/assets/stylesheets/settings/_typography-font.scss ADDED Viewed

@@ -0,0 +1,60 @@
+////
+/// @group settings/typography
+////
+// =========================================================
+// Font families
+// =========================================================
+/// Font families to use for all typography on screen media
+///
+/// @type List
+/// @access public
+$govuk-font-family: $govuk-font-family-nta !default;
+/// Font families to use when displaying tabular numbers
+///
+/// @type List
+/// @access public
+$govuk-font-family-tabular: $govuk-font-family-nta-tabular !default;
+/// Font families to use for print media
+///
+/// @type List
+/// @access public
+$govuk-font-family-print: sans-serif !default;
+/// Include the default @font-face declarations
+///
+/// If you have set $govuk-font-family to something other than $govuk-font-family-nta this option is disabled by default.
+///
+/// If you are using $govuk-compatibility-govuktemplate this option is disabled by default.
+///
+/// @type Boolean
+/// @access public
+$govuk-include-default-font-face: (
+  $govuk-font-family == $govuk-font-family-nta and
+  not($govuk-compatibility-govuktemplate)
+ ) !default;
+// =========================================================
+// Font weights
+// =========================================================
+/// Font weight for regular typography
+///
+/// @type Number
+/// @access public
+$govuk-font-weight-regular: 400 !default;
+/// Font weight for bold typography
+///
+/// @type Number
+/// @access public
+$govuk-font-weight-bold: 700 !default;

data/vendor/assets/stylesheets/settings/_typography-responsive.scss ADDED Viewed

@@ -0,0 +1,180 @@
+////
+/// @group settings/typography
+////
+/// Whether or not to define font sizes in rem, improving accessibility by
+/// allowing users to adjust the base font-size. This is currently off by
+/// default, but will be enabled by default for projects that do not use
+/// alphagov/govuk_template in the next major release.
+///
+/// If this is enabled, you should make sure that $govuk-root-font-size is set
+/// correctly for your project
+///
+/// If any of the compatibility variables are set, then default
+/// responsive typography to off.
+///
+/// @type Boolean
+/// @access public
+$govuk-typography-use-rem: if((
+    $govuk-compatibility-govukfrontendtoolkit or
+    $govuk-compatibility-govuktemplate or
+    $govuk-compatibility-govukelements
+  ), false, true) !default;
+/// Root font size
+///
+/// This is used to calculate rem sizes for the typography, and should match the
+/// _effective_ font-size of your root (or html) element.
+///
+/// Ideally you should not be setting the font-size on the html or root element
+/// in order to allow it to scale with user-preference, in which case this
+/// should be set to 16px.
+///
+/// If you are integrating Frontend into an existing project that also uses
+/// alphagov/govuk_template then you should set this to 10px to match the 62.5%
+/// (10px) base font size that govuk_template sets on the <html> element.
+///
+/// @type Number
+/// @access public
+$govuk-root-font-size: 16px !default;
+/// Responsive typography font map
+///
+/// This is used to generate responsive typography that adapts according to the
+/// breakpoints.
+///
+/// Font size and font weight can be defined for each breakpoint. You can define
+/// different behaviour on tablet and desktop. The 'null' breakpoint is for
+/// mobile.
+///
+/// Line-heights will automatically be converted from pixel measurements into
+/// relative values. For example, with a font-size of 16px and a line-height of
+/// 24px, the line-height will be converted to 1.5 before output.
+///
+/// You can also specify a separate font size and line height for print media.
+///
+/// @type Map
+///
+/// @prop {Number} $point.$breakpoint.font-size - Font size for `$point` at `$breakpoint`
+/// @prop {Number} $point.$breakpoint.line-height - Line height for `$point` at `$breakpoint`
+/// @prop {Number} $point.print.font-size - Font size for `$point` when printing
+/// @prop {Number} $point.print.line-height - Line height for `$point` when printing
+///
+/// @access public
+$govuk-typography-scale: (
+  80: (
+    null: (
+      font-size: 53px,
+      line-height: 55px
+    ),
+    tablet: (
+      font-size: 80px,
+      line-height: 80px
+    ),
+    print: (
+      font-size: 53pt,
+      line-height: 1.1
+    )
+  ),
+  48: (
+    null: (
+      font-size: 32px,
+      line-height: 35px
+    ),
+    tablet: (
+      font-size: 48px,
+      line-height: 50px
+    ),
+    print: (
+      font-size: 32pt,
+      line-height: 1.15
+    )
+  ),
+  36: (
+    null: (
+      font-size: 24px,
+      line-height: 25px
+    ),
+    tablet: (
+      font-size: 36px,
+      line-height: 40px
+    ),
+    print: (
+      font-size: 24pt,
+      line-height: 1.05
+    )
+  ),
+  27: (
+    null: (
+      font-size: 18px,
+      line-height: 20px
+    ),
+    tablet: (
+      font-size: 27px,
+      line-height: 30px
+    ),
+    print: (
+      font-size: 18pt,
+      line-height: 1.15
+    )
+  ),
+  24: (
+    null: (
+      font-size: 18px,
+      line-height: 20px
+    ),
+    tablet: (
+      font-size: 24px,
+      line-height: 30px
+    ),
+    print: (
+      font-size: 18pt,
+      line-height: 1.15
+    )
+  ),
+  19: (
+    null: (
+      font-size: 16px,
+      line-height: 20px
+    ),
+    tablet: (
+      font-size: 19px,
+      line-height: 25px
+    ),
+    print: (
+      font-size: 14pt,
+      line-height: 1.15
+    )
+  ),
+  16: (
+    null: (
+      font-size: 14px,
+      line-height: 16px
+    ),
+    tablet: (
+      font-size: 16px,
+      line-height: 20px
+    ),
+    print: (
+      font-size: 14pt,
+      line-height: 1.2
+    )
+  ),
+  14: (
+    null: (
+      font-size: 12px,
+      line-height: 15px
+    ),
+    tablet: (
+      font-size: 14px,
+      line-height: 20px
+    ),
+    print: (
+      font-size: 12pt,
+      line-height: 1.2
+    )
+  )
+) !default;

data/vendor/assets/stylesheets/tools/_all.scss ADDED Viewed

@@ -0,0 +1,8 @@
+@import "compatibility";
+@import "exports";
+@import "font-url";
+@import "ie8";
+@import "iff";
+@import "image-url";
+@import "px-to-em";
+@import "px-to-rem";

data/vendor/assets/stylesheets/tools/_compatibility.scss ADDED Viewed

@@ -0,0 +1,36 @@
+////
+/// @group tools
+////
+/// Conditional Compatibility Mixin
+///
+/// Selectively output a block (available to the mixin as @content) if a given
+/// $product is also identified as being used in the project.
+///
+/// This can then be used to include styles that are only needed to override
+/// styles provided by those other products (e.g. where govuk_template has a
+/// very specific link selector that otherwise affects buttons).
+///
+/// @example scss
+///   // Override .my-class if GOV.UK Template is also being used
+///   @include govuk-compatibility(govuk_template) {
+///     .my-class {
+///       color: inherit;
+///     }
+///   }
+///
+/// @param {String} $product - Name of product that we are 'defending' against.
+/// @content Passed content is outputted only if Frontend is being used with
+///   this product
+/// @throw Errors if product name is not recognised
+/// @access public
+@mixin govuk-compatibility($product) {
+  @if map-has-key($_govuk-compatibility, $product) {
+    @if map-get($_govuk-compatibility, $product) == true {
+      @content;
+    }
+  } @else {
+    @error "Non existent product '#{$product}'";
+  }
+}

data/vendor/assets/stylesheets/tools/_exports.scss ADDED Viewed

@@ -0,0 +1,33 @@
+////
+/// @group tools
+////
+/// List of modules which have already been exported
+///
+/// @type List
+/// @access private
+$_govuk-imported-modules: () !default;
+/// Export module
+///
+/// Ensure that the modules of CSS that we define throughout Frontend are only
+/// included in the generated CSS once, no matter how many times they are
+/// imported across the individual components.
+///
+/// @param {String} $name - Name of module - must be unique within the codebase
+/// @content The passed content will only be outputted if a module of the same
+///   $name has not already been outputted
+/// @access public
+@mixin govuk-exports($name) {
+  // If the mixin is not in the list of modules already exported...
+  @if (index($_govuk-imported-modules, $name) == null) {
+    // ... then add it to the list
+    $_govuk-imported-modules: append($_govuk-imported-modules, $name) !global;
+    // ... and output the CSS for that module
+    @content;
+  }
+  // The next time exports is called for the module of the same name, it will be
+  // found in the list and so nothing will be outputted.
+}

data/vendor/assets/stylesheets/tools/_font-url.scss ADDED Viewed

@@ -0,0 +1,28 @@
+////
+/// @group tools
+////
+// Disable indentation linting in this file only
+// sass-lint:disable indentation
+/// Font URL
+///
+/// If a custom font-url handler is defined ($govuk-font-url-function) then
+/// it will be called, otherwise a url will be returned with the filename
+/// appended to the font path.
+///
+/// @param {String} $filename - Font filename
+/// @return {String} URL for the filename, wrapped in `url()`
+/// @access public
+@function govuk-font-url($filename) {
+  $use-custom-function: variable-exists("govuk-font-url-function")
+    and $govuk-font-url-function
+    and function-exists($govuk-font-url-function);
+  @if ($use-custom-function) {
+    @return call(get-function($govuk-font-url-function), $filename);
+  } @else {
+    @return url($govuk-fonts-path + $filename);
+  }
+}

data/vendor/assets/stylesheets/tools/_ie8.scss ADDED Viewed

@@ -0,0 +1,51 @@
+////
+/// @group tools
+////
+/// Conditionally include rules only for IE8
+///
+/// @content Passed content is only outputted if we're compiling a stylesheet
+///   that targets IE8 (if `$govuk-is-ie8` is true)
+///
+/// @example scss - Usage
+///
+///   .foo {
+///     min-width: 100px;
+///     // Specify width for IE8 only
+///     @include govuk-if-ie8 {
+///       width: 100px;
+///     }
+///   }
+///
+/// @access public
+@mixin govuk-if-ie8 {
+  @if $govuk-is-ie8 {
+    @content;
+  }
+}
+/// Conditionally exclude rules for IE8
+///
+/// @content Passed content is only outputted if we're not compiling a
+///   stylesheet that targets IE8 (if `$govuk-is-ie8` is false)
+///
+/// @example scss - Usage
+///
+///   .foo {
+///     font-weight: bold;
+///
+///     // Enhance foo only for modern browsers (not IE8)
+///     @include govuk-not-ie8 {
+///       font-family: "Comic Sans MS", "Curlz MT" cursive, sans-serif;
+///       color: #FF69B4;
+///     }
+///   }
+///
+/// @access public
+@mixin govuk-not-ie8 {
+  @if not $govuk-is-ie8 {
+    @content;
+  }
+}

data/vendor/assets/stylesheets/tools/_iff.scss ADDED Viewed

@@ -0,0 +1,15 @@
+////
+/// @group tools
+////
+/// Syntactic sugar around Sass' built-in `if` function that does not require
+/// you to pass a value for `$if-false`.
+///
+/// @param {Boolean} $condition - Whether to return the value of `$if-true`
+/// @param {Mixed} $if-true - Value to return if `$condition` is truthy
+/// @return {Mixed} Value of `$if-true` if `$condition` is truthy, else null
+/// @access public
+@function iff($condition, $if-true) {
+  @return if($condition, $if-true, null);
+}

data/vendor/assets/stylesheets/tools/_image-url.scss ADDED Viewed

@@ -0,0 +1,28 @@
+////
+/// @group tools
+////
+// Disable indentation linting in this file only
+// sass-lint:disable indentation
+/// Image URL
+///
+/// If a custom image-url handler is defined ($govuk-image-url-function) then
+/// it will be called, otherwise a url will be returned with the filename
+/// appended to the image path.
+///
+/// @param {String} Filename for the image to load
+/// @return {String} URL for the filename, wrapped in `url()`
+/// @access public
+@function govuk-image-url($filename) {
+  $use-custom-function: variable-exists("govuk-image-url-function")
+    and $govuk-image-url-function
+    and function-exists($govuk-image-url-function);
+  @if ($use-custom-function) {
+    @return call(get-function($govuk-image-url-function), $filename);
+  } @else {
+    @return url($govuk-images-path + $filename);
+  }
+}

data/vendor/assets/stylesheets/tools/_px-to-em.scss ADDED Viewed

@@ -0,0 +1,20 @@
+////
+/// @group tools
+////
+/// Convert pixels to em
+///
+/// @param {Number} $value - Length in pixels
+/// @param {Number} $context-font-size - Font size of element
+/// @return {Number} Length in ems
+/// @access public
+@function govuk-em($value, $context-font-size) {
+  @if (unitless($value)) {
+    $value: $value * 1px;
+  }
+  @if (unitless($context-font-size)) {
+    $context-font-size: $context-font-size * 1px;
+  }
+  @return $value / $context-font-size * 1em;
+}

data/vendor/assets/stylesheets/tools/_px-to-rem.scss ADDED Viewed

@@ -0,0 +1,20 @@
+////
+/// @group tools
+////
+/// Convert pixels to rem
+///
+/// The $govuk-root-font-size (defined in settings/_typography-responsive.scss)
+/// must be configured to match the font-size of your root (html) element
+///
+/// @param {Number} $value - Length in pixels
+/// @return {Number} Length in rems
+/// @access public
+@function govuk-px-to-rem($value) {
+  @if (unitless($value)) {
+    $value: $value * 1px;
+  }
+  @return $value / $govuk-root-font-size * 1rem;
+}

data/vendor/assets/stylesheets/utilities/_all.scss ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ @import "clearfix";
2	+ @import "visually-hidden";

data/vendor/assets/stylesheets/utilities/_clearfix.scss ADDED Viewed

@@ -0,0 +1,5 @@
+@include govuk-exports("govuk/utilities/clearfix") {
+  .govuk-clearfix {
+    @include govuk-clearfix;
+  }
+}

data/vendor/assets/stylesheets/utilities/_visually-hidden.scss ADDED Viewed

@@ -0,0 +1,10 @@
+@include govuk-exports("govuk/utilities/visually-hidden") {
+  .govuk-visually-hidden {
+    @include govuk-visually-hidden;
+  }
+  .govuk-visually-hidden-focusable {
+    @include govuk-visually-hidden-focusable;
+  }
+}