@nice-digital/nds-core 2.0.2-alpha.0 → 2.0.5-alpha.0
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.
- package/es/breakpoints.js.map +1 -1
- package/es/core.js.map +1 -1
- package/es/utils.js.map +1 -1
- package/lib/breakpoints.js.map +1 -1
- package/lib/core.js.map +1 -1
- package/lib/utils.js.map +1 -1
- package/package.json +3 -3
- package/scss/colours/tokens/_alias.scss +1 -1
- package/scss/media-queries/_index.scss +5 -5
- package/scss/typography/_headings.scss +20 -18
- package/scss/typography/_helpers.scss +4 -4
- package/scss/typography/_links.scss +3 -2
- package/scss/typography/_settings.scss +34 -28
package/es/breakpoints.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"breakpoints.js","names":["breakpoints","xs","sm","md","lg","xl","matchesFrom","breakpointName","breakpointPx","Error","window","matchMedia","matches"],"sources":["../src/breakpoints.js"],"sourcesContent":["/**\n * @module Breakpoints\n */\n\n/**\n * The breakpoints, in pixel values.\n * These correspond with the breakpoints defined in SASS.\n * Often not used directly, but via matchesFrom.\n */\nexport const breakpoints = {\n\txs: 400,\n\tsm: 600,\n\tmd: 900,\n\tlg: 1200,\n\txl: 1600\n};\n\n/**\n * Determines if the device's width matches a min-width query from the given breakpoint.\n *\n * @param {string} breakpointName The breakpoint name\n * @return {Boolean} True if it matches, false otherwise.\n *\n * @example\n * \timport { matchesFrom } from \"./breakpoints\";\n * \t// Checks if the media query (min-width: 25em) matches\n * \tvar matches = matchesFrom(\"xs\");\n */\nexport const matchesFrom = (breakpointName) => {\n\tlet breakpointPx = breakpoints[breakpointName];\n\n\tif (!breakpointPx) {\n\t\tthrow new Error(`Breakpoint ${breakpointName} does not exist`);\n\t}\n\n\t// Assume matchMedia is polyfilled elsewhere\n\t// Convert to ems to match the media query if the browser's root font-size isn't 16\n\treturn window.matchMedia(`(min-width: ${breakpointPx / 16}em)`).matches;\n};\n"],"mappings":"AAAA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMA,WAAW,GAAG;EAC1BC,EAAE,EAAE,GADsB;EAE1BC,EAAE,EAAE,GAFsB;EAG1BC,EAAE,EAAE,GAHsB;EAI1BC,EAAE,EAAE,IAJsB;EAK1BC,EAAE,EAAE;AALsB,CAApB;AAQP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAc,CAACC,cAAD,EAAoB;EAC9C,IAAIC,YAAY,GAAGR,WAAW,CAACO,cAAD,CAA9B;;EAEA,IAAI,CAACC,YAAL,EAAmB;IAClB,MAAM,IAAIC,KAAJ,iBAAwBF,cAAxB,qBAAN;EACA,CAL6C,CAO9C;EACA;;;EACA,OAAOG,MAAM,CAACC,UAAP,kBAAiCH,YAAY,GAAG,EAAhD,UAAyDI,OAAhE;AACA,CAVM"}
|
package/es/core.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"core.js","names":[],"sources":["../src/core.js"],"sourcesContent":["export * from \"./utils\";\nexport * from \"./breakpoints\";\n"],"mappings":"AAAA,cAAc,SAAd;AACA,cAAc,eAAd"}
|
package/es/utils.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"utils.js","names":["trim","str","replace","throttle","fn","threshhold","scope","last","deferTimer","throttled","context","now","Date","args","arguments","clearTimeout","setTimeout","apply","debounce","func","execAsap","threshold","timeout","debounced","delayed","slugify","toLowerCase","nextUniqueId","i","prefix","camelCase","split","join","letter","index","toUpperCase"],"sources":["../src/utils.js"],"sourcesContent":["/**\n * @module Utils\n * Utility functions\n */\n\n/**\n * Trims whitespace characters from the start and end of a string.\n * This utility method exists because String.prototype.trim is\n * not supported in IE8.\n *\n * @param {string} str The string to trim\n */\nexport const trim = function (str) {\n\treturn str.replace(/^[\\s\\uFEFF\\xA0]+|[\\s\\uFEFF\\xA0]+$/g, \"\");\n};\n\n/**\n * Throttle events\n * See https://remysharp.com/2010/07/21/throttling-function-calls\n *\n * @param {Function} func The function to throttle\n * @param {Integer} threshold The threshhold period, in milliseconds\n * @param {Object} scope The context of the throttled function\n * @return {Function} { The throttled function }\n */\nexport const throttle = function (fn, threshhold = 100, scope = null) {\n\tlet last, deferTimer;\n\n\treturn function throttled() {\n\t\tlet context = scope || this,\n\t\t\tnow = +new Date(),\n\t\t\targs = arguments;\n\n\t\tif (last && now < last + threshhold) {\n\t\t\t// hold on to it\n\t\t\tclearTimeout(deferTimer);\n\t\t\tdeferTimer = setTimeout(function () {\n\t\t\t\tlast = now;\n\t\t\t\tfn.apply(context, args);\n\t\t\t}, threshhold);\n\t\t} else {\n\t\t\tlast = now;\n\t\t\tfn.apply(context, args);\n\t\t}\n\t};\n};\n\n/**\n * Debounce\n * See http://unscriptable.com/2009/03/20/debouncing-javascript-methods/\n *\n * @param {Function} func The function to debounce\n * @param {Integer} execAsap Whether to execute the function now\n * @param {Integer} threshold The detection period, in milliseconds\n * @param {Object} scope The context for the debounced function\n * @return {Function} { The debounced function }\n */\nexport const debounce = function (\n\tfunc,\n\texecAsap = false,\n\tthreshold = 100,\n\tscope = null\n) {\n\tlet timeout;\n\n\treturn function debounced() {\n\t\tlet context = scope || this,\n\t\t\targs = arguments;\n\n\t\tfunction delayed() {\n\t\t\tif (!execAsap) func.apply(context, args);\n\t\t\ttimeout = null;\n\t\t}\n\n\t\tif (timeout) clearTimeout(timeout);\n\t\telse if (execAsap) func.apply(context, args);\n\n\t\ttimeout = setTimeout(delayed, threshold);\n\t};\n};\n\n/**\n * Turns a string into a slug.\n * See {@link https://gist.github.com/mathewbyrne/1280286#gistcomment-1606270|this gist}.\n *\n * @param {string} str { The string to slugify }\n * @returns {string} { The slugified string }\n *\n * @example <caption>Example slugifying</caption>\n * import { slugify } from \"./utils\";\n * // returns \"a-string-to-transform-and-slugify\"\n * slugify(\"A (string) to transform & slugify!\");\n */\nexport const slugify = (str) => {\n\treturn trim(str)\n\t\t.toLowerCase()\n\t\t.replace(/\\s+/g, \"-\") // Replace spaces with -\n\t\t.replace(/&/g, \"-and-\") // Replace & with 'and'\n\t\t.replace(/[^\\w-]+/g, \"\") // Remove all non-word chars\n\t\t.replace(/^-+/g, \"\") // Trim dashes from the start\n\t\t.replace(/-+$/g, \"\") // Trim dashes from the end\n\t\t.replace(/-{2,}/g, \"-\"); // Replace multiple - with single -\n};\n\n/**\n * Generates a unique id in the form prefix-n by incrementing a counter.\n * The first time this is called it will return \"uid-1\" then \"uid-2\" and so on.\n * See {@link http://stackoverflow.com/a/20302361|This StackOverflow answer}.\n *\n * @param {string} prefix { The prefix for the id to return. Defaults to \"uid\" }\n * @return {string} { The unique id }\n *\n * @example <caption>Simple example</caption>\n * import { nextUniqueId } from \"./utils\";\n * // returns \"uid-1\"\n * nextUniqueId();\n *\n * @example <caption>Prefix example</caption>\n * import utils from \"./utils\";\n * // returns \"prefix-1\"\n * utils.nextUniqueId(\"prefix\");\n */\nexport const nextUniqueId = (function (i) {\n\treturn function (prefix = \"uid\") {\n\t\treturn `${prefix}-${++i}`;\n\t};\n})(0);\n\n/**\n * CamelCases a string\n * @param {string} str The string to camel case\n */\nexport const camelCase = function (str) {\n\tstr = str.split(\"-\").join(\" \"); // To support kebab-case\n\t// See https://stackoverflow.com/a/2970667/486434\n\treturn str\n\t\t.replace(/(?:^\\w|[A-Z]|\\b\\w)/g, function (letter, index) {\n\t\t\treturn index === 0 ? letter.toLowerCase() : letter.toUpperCase();\n\t\t})\n\t\t.replace(/\\s+/g, \"\");\n};\n\nexport default {\n\tthrottle: throttle,\n\tdebounce: debounce,\n\tslugify: slugify,\n\tnextUniqueId: nextUniqueId,\n\tcamelCase: camelCase\n};\n"],"mappings":"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"}
|
package/lib/breakpoints.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"breakpoints.js","names":["breakpoints","xs","sm","md","lg","xl","matchesFrom","breakpointName","breakpointPx","Error","window","matchMedia","matches"],"sources":["../src/breakpoints.js"],"sourcesContent":["/**\n * @module Breakpoints\n */\n\n/**\n * The breakpoints, in pixel values.\n * These correspond with the breakpoints defined in SASS.\n * Often not used directly, but via matchesFrom.\n */\nexport const breakpoints = {\n\txs: 400,\n\tsm: 600,\n\tmd: 900,\n\tlg: 1200,\n\txl: 1600\n};\n\n/**\n * Determines if the device's width matches a min-width query from the given breakpoint.\n *\n * @param {string} breakpointName The breakpoint name\n * @return {Boolean} True if it matches, false otherwise.\n *\n * @example\n * \timport { matchesFrom } from \"./breakpoints\";\n * \t// Checks if the media query (min-width: 25em) matches\n * \tvar matches = matchesFrom(\"xs\");\n */\nexport const matchesFrom = (breakpointName) => {\n\tlet breakpointPx = breakpoints[breakpointName];\n\n\tif (!breakpointPx) {\n\t\tthrow new Error(`Breakpoint ${breakpointName} does not exist`);\n\t}\n\n\t// Assume matchMedia is polyfilled elsewhere\n\t// Convert to ems to match the media query if the browser's root font-size isn't 16\n\treturn window.matchMedia(`(min-width: ${breakpointPx / 16}em)`).matches;\n};\n"],"mappings":";;;;;AAAA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACO,IAAMA,WAAW,GAAG;EAC1BC,EAAE,EAAE,GADsB;EAE1BC,EAAE,EAAE,GAFsB;EAG1BC,EAAE,EAAE,GAHsB;EAI1BC,EAAE,EAAE,IAJsB;EAK1BC,EAAE,EAAE;AALsB,CAApB;AAQP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AACO,IAAMC,WAAW,GAAG,SAAdA,WAAc,CAACC,cAAD,EAAoB;EAC9C,IAAIC,YAAY,GAAGR,WAAW,CAACO,cAAD,CAA9B;;EAEA,IAAI,CAACC,YAAL,EAAmB;IAClB,MAAM,IAAIC,KAAJ,iBAAwBF,cAAxB,qBAAN;EACA,CAL6C,CAO9C;EACA;;;EACA,OAAOG,MAAM,CAACC,UAAP,kBAAiCH,YAAY,GAAG,EAAhD,UAAyDI,OAAhE;AACA,CAVM"}
|
package/lib/core.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"core.js","names":[],"sources":["../src/core.js"],"sourcesContent":["export * from \"./utils\";\nexport * from \"./breakpoints\";\n"],"mappings":";;;;AAAA;;AAAA;EAAA;EAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;AAAA"}
|
package/lib/utils.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"utils.js","names":["trim","str","replace","throttle","fn","threshhold","scope","last","deferTimer","throttled","context","now","Date","args","arguments","clearTimeout","setTimeout","apply","debounce","func","execAsap","threshold","timeout","debounced","delayed","slugify","toLowerCase","nextUniqueId","i","prefix","camelCase","split","join","letter","index","toUpperCase"],"sources":["../src/utils.js"],"sourcesContent":["/**\n * @module Utils\n * Utility functions\n */\n\n/**\n * Trims whitespace characters from the start and end of a string.\n * This utility method exists because String.prototype.trim is\n * not supported in IE8.\n *\n * @param {string} str The string to trim\n */\nexport const trim = function (str) {\n\treturn str.replace(/^[\\s\\uFEFF\\xA0]+|[\\s\\uFEFF\\xA0]+$/g, \"\");\n};\n\n/**\n * Throttle events\n * See https://remysharp.com/2010/07/21/throttling-function-calls\n *\n * @param {Function} func The function to throttle\n * @param {Integer} threshold The threshhold period, in milliseconds\n * @param {Object} scope The context of the throttled function\n * @return {Function} { The throttled function }\n */\nexport const throttle = function (fn, threshhold = 100, scope = null) {\n\tlet last, deferTimer;\n\n\treturn function throttled() {\n\t\tlet context = scope || this,\n\t\t\tnow = +new Date(),\n\t\t\targs = arguments;\n\n\t\tif (last && now < last + threshhold) {\n\t\t\t// hold on to it\n\t\t\tclearTimeout(deferTimer);\n\t\t\tdeferTimer = setTimeout(function () {\n\t\t\t\tlast = now;\n\t\t\t\tfn.apply(context, args);\n\t\t\t}, threshhold);\n\t\t} else {\n\t\t\tlast = now;\n\t\t\tfn.apply(context, args);\n\t\t}\n\t};\n};\n\n/**\n * Debounce\n * See http://unscriptable.com/2009/03/20/debouncing-javascript-methods/\n *\n * @param {Function} func The function to debounce\n * @param {Integer} execAsap Whether to execute the function now\n * @param {Integer} threshold The detection period, in milliseconds\n * @param {Object} scope The context for the debounced function\n * @return {Function} { The debounced function }\n */\nexport const debounce = function (\n\tfunc,\n\texecAsap = false,\n\tthreshold = 100,\n\tscope = null\n) {\n\tlet timeout;\n\n\treturn function debounced() {\n\t\tlet context = scope || this,\n\t\t\targs = arguments;\n\n\t\tfunction delayed() {\n\t\t\tif (!execAsap) func.apply(context, args);\n\t\t\ttimeout = null;\n\t\t}\n\n\t\tif (timeout) clearTimeout(timeout);\n\t\telse if (execAsap) func.apply(context, args);\n\n\t\ttimeout = setTimeout(delayed, threshold);\n\t};\n};\n\n/**\n * Turns a string into a slug.\n * See {@link https://gist.github.com/mathewbyrne/1280286#gistcomment-1606270|this gist}.\n *\n * @param {string} str { The string to slugify }\n * @returns {string} { The slugified string }\n *\n * @example <caption>Example slugifying</caption>\n * import { slugify } from \"./utils\";\n * // returns \"a-string-to-transform-and-slugify\"\n * slugify(\"A (string) to transform & slugify!\");\n */\nexport const slugify = (str) => {\n\treturn trim(str)\n\t\t.toLowerCase()\n\t\t.replace(/\\s+/g, \"-\") // Replace spaces with -\n\t\t.replace(/&/g, \"-and-\") // Replace & with 'and'\n\t\t.replace(/[^\\w-]+/g, \"\") // Remove all non-word chars\n\t\t.replace(/^-+/g, \"\") // Trim dashes from the start\n\t\t.replace(/-+$/g, \"\") // Trim dashes from the end\n\t\t.replace(/-{2,}/g, \"-\"); // Replace multiple - with single -\n};\n\n/**\n * Generates a unique id in the form prefix-n by incrementing a counter.\n * The first time this is called it will return \"uid-1\" then \"uid-2\" and so on.\n * See {@link http://stackoverflow.com/a/20302361|This StackOverflow answer}.\n *\n * @param {string} prefix { The prefix for the id to return. Defaults to \"uid\" }\n * @return {string} { The unique id }\n *\n * @example <caption>Simple example</caption>\n * import { nextUniqueId } from \"./utils\";\n * // returns \"uid-1\"\n * nextUniqueId();\n *\n * @example <caption>Prefix example</caption>\n * import utils from \"./utils\";\n * // returns \"prefix-1\"\n * utils.nextUniqueId(\"prefix\");\n */\nexport const nextUniqueId = (function (i) {\n\treturn function (prefix = \"uid\") {\n\t\treturn `${prefix}-${++i}`;\n\t};\n})(0);\n\n/**\n * CamelCases a string\n * @param {string} str The string to camel case\n */\nexport const camelCase = function (str) {\n\tstr = str.split(\"-\").join(\" \"); // To support kebab-case\n\t// See https://stackoverflow.com/a/2970667/486434\n\treturn str\n\t\t.replace(/(?:^\\w|[A-Z]|\\b\\w)/g, function (letter, index) {\n\t\t\treturn index === 0 ? letter.toLowerCase() : letter.toUpperCase();\n\t\t})\n\t\t.replace(/\\s+/g, \"\");\n};\n\nexport default {\n\tthrottle: throttle,\n\tdebounce: debounce,\n\tslugify: slugify,\n\tnextUniqueId: nextUniqueId,\n\tcamelCase: camelCase\n};\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nice-digital/nds-core",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.5-alpha.0",
|
|
4
4
|
"description": "Core code for the NICE Design System",
|
|
5
5
|
"author": "Ian Routledge <ian.routledge@nice.org.uk>",
|
|
6
6
|
"contributors": [
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"url": "https://github.com/nice-digital/nice-design-system/issues"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@nice-digital/icons": "^4.0.
|
|
36
|
+
"@nice-digital/icons": "^4.0.1-alpha.0",
|
|
37
37
|
"prop-types": "^15.7.2",
|
|
38
38
|
"sass-mq": "^6.0.0"
|
|
39
39
|
},
|
|
@@ -44,5 +44,5 @@
|
|
|
44
44
|
"devDependencies": {
|
|
45
45
|
"@babel/cli": "^7.5.0"
|
|
46
46
|
},
|
|
47
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "c560cb90c31f1c8d2e3085df9b32bc4e47a37929"
|
|
48
48
|
}
|
|
@@ -71,7 +71,7 @@ $action-banner-subtle-border: global.$nice-cream;
|
|
|
71
71
|
|
|
72
72
|
// Alphabet
|
|
73
73
|
$alphabet-letter-background: global.$white;
|
|
74
|
-
$alphabet-letter-span: global.$
|
|
74
|
+
$alphabet-letter-span: global.$custom-grey-3;
|
|
75
75
|
|
|
76
76
|
// Card
|
|
77
77
|
$card-author: global.$black-tint-1;
|
|
@@ -1,22 +1,22 @@
|
|
|
1
1
|
/// Extra small break point
|
|
2
2
|
/// @since 0.2.0
|
|
3
|
-
$xs: 400px
|
|
3
|
+
$xs: 400px;
|
|
4
4
|
|
|
5
5
|
/// 'Small' break point. Roughly portrait tablets.
|
|
6
6
|
/// @since 0.2.0
|
|
7
|
-
$sm: 600px
|
|
7
|
+
$sm: 600px;
|
|
8
8
|
|
|
9
9
|
/// 'Medium' break point. Roughly landscape tablets.
|
|
10
10
|
/// @since 0.2.0
|
|
11
|
-
$md: 900px
|
|
11
|
+
$md: 900px;
|
|
12
12
|
|
|
13
13
|
/// 'Large' break point. Roughly 'dektops'.
|
|
14
14
|
/// @since 0.2.0
|
|
15
|
-
$lg: 1200px
|
|
15
|
+
$lg: 1200px;
|
|
16
16
|
|
|
17
17
|
/// 'Extra large' break point for wide screens
|
|
18
18
|
/// @since 0.2.0
|
|
19
|
-
$xl: 1600px
|
|
19
|
+
$xl: 1600px;
|
|
20
20
|
|
|
21
21
|
@forward 'vendor/mq' with (
|
|
22
22
|
$breakpoints: (
|
|
@@ -4,68 +4,70 @@
|
|
|
4
4
|
/// @group Typography
|
|
5
5
|
////
|
|
6
6
|
|
|
7
|
+
@mixin -heading-base {
|
|
8
|
+
clear: both;
|
|
9
|
+
font-weight: 600;
|
|
10
|
+
max-width: 66ch;
|
|
11
|
+
}
|
|
12
|
+
|
|
7
13
|
/// Primary heading. Used for h1 tag but can be used directly
|
|
8
14
|
/// for semantic classes for visual styling.
|
|
9
15
|
/// @since 0.1.0
|
|
10
16
|
@mixin h1 {
|
|
17
|
+
@include -heading-base;
|
|
11
18
|
@include helpers.font(h1);
|
|
12
|
-
clear: both;
|
|
13
19
|
font-family: helpers.get-font-family(serif);
|
|
14
|
-
|
|
15
|
-
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
/// Alternative (smaller) heading 1 style
|
|
23
|
+
/// @since 3.0.0
|
|
24
|
+
@mixin h1-alt {
|
|
25
|
+
@include -heading-base;
|
|
26
|
+
@include helpers.font(h1-alt);
|
|
27
|
+
font-family: helpers.get-font-family(serif);
|
|
16
28
|
}
|
|
17
29
|
|
|
18
30
|
/// Secondary heading. Used for h2 tag but can be used directly
|
|
19
31
|
/// for semantic classes for visual styling.
|
|
20
32
|
/// @since 0.1.0
|
|
21
33
|
@mixin h2 {
|
|
34
|
+
@include -heading-base;
|
|
22
35
|
@include helpers.font(h2);
|
|
23
|
-
clear: both;
|
|
24
36
|
font-family: helpers.get-font-family(serif);
|
|
25
|
-
font-weight: 600;
|
|
26
|
-
max-width: 66ch;
|
|
27
37
|
}
|
|
28
38
|
|
|
29
39
|
/// Tertiary heading. Used for h3 tag but can be used directly
|
|
30
40
|
/// for semantic classes for visual styling.
|
|
31
41
|
/// @since 0.1.0
|
|
32
42
|
@mixin h3 {
|
|
43
|
+
@include -heading-base;
|
|
33
44
|
@include helpers.font(h3);
|
|
34
|
-
clear: both;
|
|
35
45
|
font-family: helpers.get-font-family(serif);
|
|
36
|
-
font-weight: 600;
|
|
37
|
-
max-width: 66ch;
|
|
38
46
|
}
|
|
39
47
|
|
|
40
48
|
/// Fourth level heading. Used for h4 tag but can be used directly
|
|
41
49
|
/// for semantic classes for visual styling.
|
|
42
50
|
/// @since 0.1.0
|
|
43
51
|
@mixin h4 {
|
|
52
|
+
@include -heading-base;
|
|
44
53
|
@include helpers.font(h4);
|
|
45
|
-
clear: both;
|
|
46
54
|
font-family: helpers.get-font-family(serif);
|
|
47
|
-
font-weight: 600;
|
|
48
|
-
max-width: 66ch;
|
|
49
55
|
}
|
|
50
56
|
|
|
51
57
|
/// Fifth level heading. Used for h5 tag but can be used directly
|
|
52
58
|
/// for semantic classes for visual styling.
|
|
53
59
|
/// @since 0.1.0
|
|
54
60
|
@mixin h5 {
|
|
61
|
+
@include -heading-base;
|
|
55
62
|
@include helpers.font(h5);
|
|
56
|
-
clear: both;
|
|
57
63
|
font-family: helpers.get-font-family(sans);
|
|
58
|
-
font-weight: 700;
|
|
59
|
-
max-width: 66ch;
|
|
60
64
|
}
|
|
61
65
|
|
|
62
66
|
/// Sixth level heading. Used for h6 tag but can be used directly
|
|
63
67
|
/// for semantic classes for visual styling.
|
|
64
68
|
/// @since 0.1.0
|
|
65
69
|
@mixin h6 {
|
|
70
|
+
@include -heading-base;
|
|
66
71
|
@include helpers.font(h6);
|
|
67
|
-
clear: both;
|
|
68
72
|
font-family: helpers.get-font-family(sans);
|
|
69
|
-
font-weight: 700;
|
|
70
|
-
max-width: 66ch;
|
|
71
73
|
}
|
|
@@ -44,10 +44,10 @@
|
|
|
44
44
|
@return map.get($font-map, fs);
|
|
45
45
|
}
|
|
46
46
|
|
|
47
|
-
/// Gets a numeric line height
|
|
47
|
+
/// Gets a numeric line height from a given scale multiplier.
|
|
48
48
|
/// Usually not used directly - the font-size or font mixin is usually used instead.
|
|
49
49
|
/// @param $scale {Integer|Name} The integer ratio or named font-size.
|
|
50
|
-
/// @return {Number} Numeric line-height
|
|
50
|
+
/// @return {Number} Numeric line-height
|
|
51
51
|
/// @example
|
|
52
52
|
/// $line-height: get-line-height(2)
|
|
53
53
|
/// @example
|
|
@@ -77,10 +77,10 @@
|
|
|
77
77
|
|
|
78
78
|
@if $important {
|
|
79
79
|
font-size: utils.rem($font-size) !important;
|
|
80
|
-
line-height:
|
|
80
|
+
line-height: $line-height !important;
|
|
81
81
|
} @else {
|
|
82
82
|
font-size: utils.rem($font-size);
|
|
83
|
-
line-height:
|
|
83
|
+
line-height: $line-height;
|
|
84
84
|
}
|
|
85
85
|
}
|
|
86
86
|
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
@use 'sass:color';
|
|
2
2
|
@use '../colours';
|
|
3
3
|
@use '../focus';
|
|
4
|
+
@use 'settings';
|
|
4
5
|
|
|
5
6
|
////
|
|
6
7
|
/// @group Typography
|
|
@@ -20,7 +21,7 @@
|
|
|
20
21
|
|
|
21
22
|
&:hover {
|
|
22
23
|
color: colours.$link-hover;
|
|
23
|
-
text-decoration-thickness:
|
|
24
|
+
text-decoration-thickness: settings.$link-hover-text-decoration-thickness;
|
|
24
25
|
}
|
|
25
26
|
|
|
26
27
|
&:focus {
|
|
@@ -45,7 +46,7 @@
|
|
|
45
46
|
/// Inverse link style for use on an inverse (dark) background
|
|
46
47
|
/// @since 0.3.1
|
|
47
48
|
@mixin link-inverse {
|
|
48
|
-
color: colours.$link-inverse;
|
|
49
|
+
color: colours.$link-inverse !important; // Use important here to override conflicting styles in inverse containers
|
|
49
50
|
-webkit-tap-highlight-color: color.adjust(colours.$focus, $alpha: -0.666);
|
|
50
51
|
text-decoration: underline;
|
|
51
52
|
text-decoration-skip-ink: auto;
|
|
@@ -4,27 +4,31 @@
|
|
|
4
4
|
|
|
5
5
|
/// Baseline, in pixels
|
|
6
6
|
/// @since 0.2.0
|
|
7
|
-
$baseline: 4
|
|
7
|
+
$baseline: 4;
|
|
8
8
|
|
|
9
9
|
/// Base font size, in pixels
|
|
10
10
|
/// @since 0.2.0
|
|
11
|
-
$base-font-size:
|
|
11
|
+
$base-font-size: 16;
|
|
12
12
|
|
|
13
|
-
/// Base line height
|
|
13
|
+
/// Base line height
|
|
14
14
|
/// @since 0.2.0
|
|
15
|
-
$base-line-height:
|
|
15
|
+
$base-line-height: 1.6;
|
|
16
|
+
|
|
17
|
+
/// Default text decoration thickness for link hover
|
|
18
|
+
/// @since 3.0.0
|
|
19
|
+
$link-hover-text-decoration-thickness: 0.2rem;
|
|
16
20
|
|
|
17
21
|
/// Sans-serif font stack
|
|
18
22
|
/// @since 2.0.0
|
|
19
|
-
$font-family-sans: 'Inter, "Helvetica Neue", Helvetica, Arial, sans-serif'
|
|
23
|
+
$font-family-sans: 'Inter, Roboto, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif';
|
|
20
24
|
|
|
21
25
|
/// Serif font stack
|
|
22
26
|
/// @since 2.0.0
|
|
23
|
-
$font-family-serif: 'Lora, Georgia, Times, serif'
|
|
27
|
+
$font-family-serif: 'Lora, Georgia, Times, serif';
|
|
24
28
|
|
|
25
29
|
/// Mono font stack
|
|
26
30
|
/// @since 0.2.0
|
|
27
|
-
$font-family-mono: 'Monaco, Menlo, Consolas, "Courier New", monospace'
|
|
31
|
+
$font-family-mono: 'Monaco, Menlo, Consolas, "Courier New", monospace';
|
|
28
32
|
|
|
29
33
|
/// The font families in use across NICE.
|
|
30
34
|
/// @prop {Font stack} sans [Inter, Helvetica Neue, Helvetica, Arial, sans-serif] The sans-serif font stack
|
|
@@ -36,11 +40,11 @@ $font-families: (
|
|
|
36
40
|
sans: $font-family-sans,
|
|
37
41
|
serif: $font-family-serif,
|
|
38
42
|
mono: $font-family-mono
|
|
39
|
-
)
|
|
43
|
+
);
|
|
40
44
|
|
|
41
45
|
/// The modular scale ratio to use for typography
|
|
42
46
|
/// @since 0.2.0
|
|
43
|
-
$type-ratio: modular-scale.get-ratio(fourth)
|
|
47
|
+
$type-ratio: modular-scale.get-ratio(fourth);
|
|
44
48
|
|
|
45
49
|
/// The minimum root font size, in pixels
|
|
46
50
|
/// @since 0.2.13
|
|
@@ -61,23 +65,25 @@ $root-font-size-min-breakpoint: media-queries.$md;
|
|
|
61
65
|
$root-font-size-max-breakpoint: media-queries.$lg;
|
|
62
66
|
|
|
63
67
|
/// A map of named font sizes to their corresponding modular scale factor
|
|
64
|
-
/// @prop {Integer} h1 [
|
|
68
|
+
/// @prop {Integer} h1 [6] Heading 1
|
|
69
|
+
/// @prop {Integer} h1-alt [5] Heading 1 (alt)
|
|
65
70
|
/// @prop {Integer} h2 [4] Heading 2
|
|
66
71
|
/// @prop {Integer} h3 [3] Heading 3
|
|
67
72
|
/// @prop {Integer} h4 [2] Heading 4
|
|
68
73
|
/// @prop {Integer} h5 [1] Heading 5
|
|
69
74
|
/// @prop {Integer} h6 [0] Heading 6
|
|
70
|
-
/// @prop {Integer} lead [
|
|
75
|
+
/// @prop {Integer} lead [1] Lead
|
|
71
76
|
/// @prop {Integer} p [0] Paragraph
|
|
72
77
|
/// @since 0.1.0
|
|
73
78
|
$named-font-sizes: (
|
|
74
|
-
h1:
|
|
79
|
+
h1: 6,
|
|
80
|
+
h1-alt: 5,
|
|
75
81
|
h2: 4,
|
|
76
82
|
h3: 3,
|
|
77
83
|
h4: 2,
|
|
78
84
|
h5: 1,
|
|
79
85
|
h6: 0,
|
|
80
|
-
lead:
|
|
86
|
+
lead: 1,
|
|
81
87
|
p: 0
|
|
82
88
|
);
|
|
83
89
|
|
|
@@ -85,56 +91,56 @@ $named-font-sizes: (
|
|
|
85
91
|
/// @since 0.2.0
|
|
86
92
|
$font-sizes: (
|
|
87
93
|
-2: (
|
|
88
|
-
fs:
|
|
89
|
-
lh:
|
|
94
|
+
fs: 14,
|
|
95
|
+
lh: 1.6,
|
|
90
96
|
mb: spacing.$small,
|
|
91
97
|
mt: spacing.$small
|
|
92
98
|
),
|
|
93
99
|
-1: (
|
|
94
|
-
fs:
|
|
95
|
-
lh:
|
|
100
|
+
fs: 15,
|
|
101
|
+
lh: 1.6,
|
|
96
102
|
mb: spacing.$medium,
|
|
97
103
|
mt: spacing.$medium
|
|
98
104
|
),
|
|
99
105
|
0: (
|
|
100
106
|
fs: 16,
|
|
101
|
-
lh:
|
|
107
|
+
lh: 1.6,
|
|
102
108
|
mb: spacing.$medium,
|
|
103
109
|
mt: spacing.$medium
|
|
104
110
|
),
|
|
105
111
|
1: (
|
|
106
112
|
fs: 18,
|
|
107
|
-
lh:
|
|
113
|
+
lh: 1.4,
|
|
108
114
|
mb: spacing.$medium,
|
|
109
115
|
mt: spacing.$large
|
|
110
116
|
),
|
|
111
117
|
2: (
|
|
112
|
-
fs:
|
|
113
|
-
lh:
|
|
118
|
+
fs: 22,
|
|
119
|
+
lh: 1.3,
|
|
114
120
|
mb: spacing.$medium,
|
|
115
121
|
mt: spacing.$large
|
|
116
122
|
),
|
|
117
123
|
3: (
|
|
118
124
|
fs: 28,
|
|
119
|
-
lh:
|
|
125
|
+
lh: 1.25,
|
|
120
126
|
mb: spacing.$medium,
|
|
121
127
|
mt: spacing.$large
|
|
122
128
|
),
|
|
123
129
|
4: (
|
|
124
|
-
fs:
|
|
125
|
-
lh:
|
|
130
|
+
fs: 34,
|
|
131
|
+
lh: 1.2,
|
|
126
132
|
mb: spacing.$medium,
|
|
127
133
|
mt: spacing.$large
|
|
128
134
|
),
|
|
129
135
|
5: (
|
|
130
|
-
fs:
|
|
131
|
-
lh:
|
|
136
|
+
fs: 38,
|
|
137
|
+
lh: 1.2,
|
|
132
138
|
mb: spacing.$medium,
|
|
133
139
|
mt: 0
|
|
134
140
|
),
|
|
135
141
|
6: (
|
|
136
|
-
fs:
|
|
137
|
-
lh:
|
|
142
|
+
fs: 44,
|
|
143
|
+
lh: 1.2,
|
|
138
144
|
mb: spacing.$large,
|
|
139
145
|
mt: 0
|
|
140
146
|
)
|