@daffodil/design 0.42.4 → 0.44.0

package/daff-theme.scss

@@ -1,3634 +0,0 @@
-// @docs
-//
-// `daff-theme` is a utility library for themeing the daffodil
-// design library. It contains many useful mixins, functions,
-// and variables.
-//
-// @note You can import this as often as you like, as it only contains SCSS
-// variables, mixins, and functions; thus it won't effect your final
-// compiled stylesheet size.
-//
-// @usage
-// ```
-// 
-// ```
-//
-// @docs
-// @private
-// Splits a string into an array based on a separator
-// Remember, string arrays begin at 1 in SASS.
-//
-// @returns comma-list
-//
-@function daff-string-split($string, $separator) {
-	$list: ();
-	$index: str-index($string, $separator);
-
-	@if ($index == null) {
-		@return $list;
-	}
-
-	@while $index !=null {
-		$item: str-slice($string, 1, $index - 1);
-
-		@if ($item != '') {
-			$list: append($list, $item, 'comma');
-		}
-
-		$string: str-slice($string, $index + 1);
-		$index: str-index($string, $separator);
-	}
-
-	@if ($string != '') {
-		$list: append($list, $string, 'comma');
-	}
-
-	@return $list;
-}
-
-
-//
-// Checks whether or not a map has a nested key
-//
-// @param $map - the map being checked
-// @param $keys - an list of ordered keys to traverse down
-//
-// @returns boolean
-// @throws error
-//
-@function daff-map-deep-check($map, $keys) {
-	@if (type-of($map) != 'map') {
-		@error 'Expected first parameter to be of type `map`';
-	}
-
-	@each $key in $keys {
-		@if (not map-has-key($map, $key)) {
-			@return false;
-		}
-
-		$map: map-get($map, $key);
-	}
-
-	@return true;
-}
-
-//
-// @docs
-// @private
-// Splits a string into an array based on a separator
-// Remember, string arrays begin at 1 in SASS.
-//
-// @returns comma-list
-//
-@function daff-string-split($string, $separator) {
-	$list: ();
-	$index: str-index($string, $separator);
-
-	@if ($index == null) {
-		@return $list;
-	}
-
-	@while $index !=null {
-		$item: str-slice($string, 1, $index - 1);
-
-		@if ($item != '') {
-			$list: append($list, $item, 'comma');
-		}
-
-		$string: str-slice($string, $index + 1);
-		$index: str-index($string, $separator);
-	}
-
-	@if ($string != '') {
-		$list: append($list, $string, 'comma');
-	}
-
-	@return $list;
-}
-
-//
-// Checks whether or not a map has a nested key
-//
-// @param $map - the map being checked
-// @param $keys - an list of ordered keys to traverse down
-//
-// @returns boolean
-// @throws error
-//
-@function daff-map-deep-check($map, $keys) {
-	@if (type-of($map) != 'map') {
-		@error 'Expected first parameter to be of type `map`';
-	}
-
-	@each $key in $keys {
-		@if (not map-has-key($map, $key)) {
-			@return false;
-		}
-
-		$map: map-get($map, $key);
-	}
-
-	@return true;
-}
-
-
-//
-// Return a the value of a nested key in a map if it exists.
-// If the key doesn't exist, it throw an error.
-//
-// Note: This function doesn't support the use
-// of the search character in your map key names.
-//
-// @usage daff-map-deep-get($map, "nested.map.key");
-// @returns any
-// @throws error
-@function daff-map-deep-get($map, $key, $search-character: '.') {
-	$keys: daff-string-split($key, $search-character);
-
-	@if not daff-map-deep-check($map, $keys) {
-		@error 'The map doesn\'t contain the $key: `#{$key}`\'';
-	}
-
-	@each $key in $keys {
-		$map: map-get($map, $key);
-	}
-
-	@return $map;
-}
-
-
-/* stylelint-disable */
-$wcag-aa-errors: (
-	'text-contrast': 'WCAG 2.0 level AA requires text and its background color to have a contrast ratio of at least 4.5:1',
-	'icon-contrast': 'WCAG 2.0 level AA requires the icon and its background color to have a contrast ratio of at least 3:1'
-);
-
-$wcag-aaa-errors: (
-	map-merge($wcag-aa-errors, (
-		'text-contrast': 'WCAG 2.0 level AA requires text and its background color to have a contrast ratio of at least 7:1',
-	))
-);
-/* stylelint-enable */
-
-// Base colors
-$daff-white: #ffffff;
-$error: #dd0000;
-
-// 60 apart passes AAA level for any size text (except for 10/70)
-// 50 apart passes AA level for any size text (except for 10/60)
-
-$daff-blue: (
-	10: #ebf1ff,
-	20: #c4d8ff,
-	30: #9dbeff,
-	40: #79a7ff,
-	50: #548fff,
-	60: #1f66ff,
-	70: #093cf3,
-	80: #001bcb,
-	90: #00098a,
-	100: #000033
-);
-
-$daff-primary: $daff-blue;
-
-$daff-purple: (
-	10: #ebebff,
-	20: #d4d3ff,
-	30: #b7b4ff,
-	40: #a19bff,
-	50: #8b82ff,
-	60: #6a57ff,
-	70: #5631f3,
-	80: #3c13bd,
-	90: #2c068a,
-	100: #110033
-);
-
-$daff-accent: $daff-purple;
-
-$daff-turquoise: (
-	10: #d6fcea,
-	20: #9dfbd3,
-	30: #51e1ae,
-	40: #37c193,
-	50: #1fa67c,
-	60: #00835f,
-	70: #0f654a,
-	80: #104b37,
-	90: #0d3426,
-	100: #082218
-);
-
-$daff-yellow: (
-	10: #fffaeb,
-	20: #fff1c2,
-	30: #ffe799,
-	40: #ffde70,
-	50: #ffd447,
-	60: #ffc810,
-	70: #f5bc00,
-	80: #cc9c00,
-	90: #a37d00,
-	100: #7a5e00
-);
-
-$daff-red: (
-	10: #fcf1f1,
-	20: #fae0e0,
-	30: #f8babb,
-	40: #f88d8f,
-	50: #fb5d61,
-	60: #ec0019,
-	70: #b30e19,
-	80: #871016,
-	90: #5e0c10,
-	100: #3f0809,
-);
-
-$daff-bronze: (
-	10: #fcf2eb,
-	20: #f7dac6,
-	30: #f2c093,
-	40: #e49d40,
-	50: #d2801a,
-	60: #b36200,
-	70: #955400,
-	80: #704000,
-	90: #462900,
-	100: #1a0f00,
-);
-
-$daff-green: (
-	10: #c4ffcc,
-	20: #6aff86,
-	30: #00db57,
-	40: #13c049,
-	50: #00aa3c,
-	60: #00852e,
-	70: #006b23,
-	80: #004b17,
-	90: #0c3515,
-	100: #07230d,
-);
-
-$daff-gray: (
-	0: #ffffff,
-	10: #fafafa,
-	20: #e8e8e8,
-	30: #d3d3d3,
-	40: #b6b6b6,
-	50: #949494,
-	60: #767676,
-	70: #5e5e5e,
-	80: #474747,
-	90: #323232,
-	100: #1a1a1a,
-	110: #070707
-);
-
-//
-// Takes a color palette and retrieves the hue from the palette
-// If no color is selected, it will retrieve the default
-// color from the palette
-//
-// @usage
-// ```
-// daff-color($daff-yellow, 60);
-// ```
-@function daff-color($palette, $color: 'default') {
-	@if (not(map-has-key($palette, $color))) {
-		@error 'Color: `#{$color}` does not exist in palette';
-	}
-
-	@return map-get($palette, $color);
-}
-
-// Entrypoint for Contrast Features
-
-//  Precomputed linear color channel values, for use in contrast calculations.
-//  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
-//
-//  Algorithm, for c in 0 to 255:
-//  f(c) {
-//    c = c / 255;
-//    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
-//  }
-//
-//  This lookup table is needed since there is no `pow` in SASS.
-$linear-channel-values: (
-	0,
-	0.0003035269835488375,
-	0.000607053967097675,
-	0.0009105809506465125,
-	0.00121410793419535,
-	0.0015176349177441874,
-	0.001821161901293025,
-	0.0021246888848418626,
-	0.0024282158683907,
-	0.0027317428519395373,
-	0.003035269835488375,
-	0.003346535763899161,
-	0.003676507324047436,
-	0.004024717018496307,
-	0.004391442037410293,
-	0.004776953480693729,
-	0.005181516702338386,
-	0.005605391624202723,
-	0.006048833022857054,
-	0.006512090792594475,
-	0.006995410187265387,
-	0.007499032043226175,
-	0.008023192985384994,
-	0.008568125618069307,
-	0.009134058702220787,
-	0.00972121732023785,
-	0.010329823029626936,
-	0.010960094006488246,
-	0.011612245179743885,
-	0.012286488356915872,
-	0.012983032342173012,
-	0.013702083047289686,
-	0.014443843596092545,
-	0.01520851442291271,
-	0.01599629336550963,
-	0.016807375752887384,
-	0.017641954488384078,
-	0.018500220128379697,
-	0.019382360956935723,
-	0.0202885630566524,
-	0.021219010376003555,
-	0.022173884793387385,
-	0.02315336617811041,
-	0.024157632448504756,
-	0.02518685962736163,
-	0.026241221894849898,
-	0.027320891639074894,
-	0.028426039504420793,
-	0.0295568344378088,
-	0.030713443732993635,
-	0.03189603307301153,
-	0.033104766570885055,
-	0.03433980680868217,
-	0.03560131487502034,
-	0.03688945040110004,
-	0.0382043715953465,
-	0.03954623527673284,
-	0.04091519690685319,
-	0.042311410620809675,
-	0.043735029256973465,
-	0.04518620438567554,
-	0.046665086336880095,
-	0.04817182422688942,
-	0.04970656598412723,
-	0.05126945837404324,
-	0.052860647023180246,
-	0.05448027644244237,
-	0.05612849004960009,
-	0.05780543019106723,
-	0.0595112381629812,
-	0.06124605423161761,
-	0.06301001765316767,
-	0.06480326669290577,
-	0.06662593864377289,
-	0.06847816984440017,
-	0.07036009569659588,
-	0.07227185068231748,
-	0.07421356838014963,
-	0.07618538148130785,
-	0.07818742180518633,
-	0.08021982031446832,
-	0.0822827071298148,
-	0.08437621154414882,
-	0.08650046203654976,
-	0.08865558628577294,
-	0.09084171118340768,
-	0.09305896284668745,
-	0.0953074666309647,
-	0.09758734714186246,
-	0.09989872824711389,
-	0.10224173308810132,
-	0.10461648409110419,
-	0.10702310297826761,
-	0.10946171077829933,
-	0.1119324278369056,
-	0.11443537382697373,
-	0.11697066775851084,
-	0.11953842798834562,
-	0.12213877222960187,
-	0.12477181756095049,
-	0.12743768043564743,
-	0.1301364766903643,
-	0.13286832155381798,
-	0.13563332965520566,
-	0.13843161503245183,
-	0.14126329114027164,
-	0.14412847085805777,
-	0.14702726649759498,
-	0.14995978981060856,
-	0.15292615199615017,
-	0.1559264637078274,
-	0.1589608350608804,
-	0.162029375639111,
-	0.1651321945016676,
-	0.16826940018969075,
-	0.1714411007328226,
-	0.17464740365558504,
-	0.17788841598362912,
-	0.18116424424986022,
-	0.184474994500441,
-	0.18782077230067787,
-	0.19120168274079138,
-	0.1946178304415758,
-	0.19806931955994886,
-	0.20155625379439707,
-	0.20507873639031693,
-	0.20863687014525575,
-	0.21223075741405523,
-	0.21586050011389926,
-	0.2195261997292692,
-	0.2232279573168085,
-	0.22696587351009836,
-	0.23074004852434915,
-	0.23455058216100522,
-	0.238397573812271,
-	0.24228112246555486,
-	0.24620132670783548,
-	0.25015828472995344,
-	0.25415209433082675,
-	0.2581828529215958,
-	0.26225065752969623,
-	0.26635560480286247,
-	0.2704977910130658,
-	0.27467731206038465,
-	0.2788942634768104,
-	0.2831487404299921,
-	0.2874408377269175,
-	0.29177064981753587,
-	0.2961382707983211,
-	0.3005437944157765,
-	0.3049873140698863,
-	0.30946892281750854,
-	0.31398871337571754,
-	0.31854677812509186,
-	0.32314320911295075,
-	0.3277780980565422,
-	0.33245153634617935,
-	0.33716361504833037,
-	0.3419144249086609,
-	0.3467040563550296,
-	0.35153259950043936,
-	0.3564001441459435,
-	0.3613067797835095,
-	0.3662525955988395,
-	0.3712376804741491,
-	0.3762621229909065,
-	0.38132601143253014,
-	0.386429433787049,
-	0.39157247774972326,
-	0.39675523072562685,
-	0.4019777798321958,
-	0.4072402119017367,
-	0.41254261348390375,
-	0.4178850708481375,
-	0.4232676699860717,
-	0.4286904966139066,
-	0.43415363617474895,
-	0.4396571738409188,
-	0.44520119451622786,
-	0.45078578283822346,
-	0.45641102318040466,
-	0.4620769996544071,
-	0.467783796112159,
-	0.47353149614800955,
-	0.4793201831008268,
-	0.4851499400560704,
-	0.4910208498478356,
-	0.4969329950608704,
-	0.5028864580325687,
-	0.5088813208549338,
-	0.5149176653765214,
-	0.5209955732043543,
-	0.5271151257058131,
-	0.5332764040105052,
-	0.5394794890121072,
-	0.5457244613701866,
-	0.5520114015120001,
-	0.5583403896342679,
-	0.5647115057049292,
-	0.5711248294648731,
-	0.5775804404296506,
-	0.5840784178911641,
-	0.5906188409193369,
-	0.5972017883637634,
-	0.6038273388553378,
-	0.6104955708078648,
-	0.6172065624196511,
-	0.6239603916750761,
-	0.6307571363461468,
-	0.6375968739940326,
-	0.6444796819705821,
-	0.6514056374198242,
-	0.6583748172794485,
-	0.665387298282272,
-	0.6724431569576875,
-	0.6795424696330938,
-	0.6866853124353135,
-	0.6938717612919899,
-	0.7011018919329731,
-	0.7083757798916868,
-	0.7156935005064807,
-	0.7230551289219693,
-	0.7304607400903537,
-	0.7379104087727308,
-	0.7454042095403874,
-	0.7529422167760779,
-	0.7605245046752924,
-	0.768151147247507,
-	0.7758222183174236,
-	0.7835377915261935,
-	0.7912979403326302,
-	0.799102738014409,
-	0.8069522576692516,
-	0.8148465722161012,
-	0.8227857543962835,
-	0.8307698767746546,
-	0.83879901174074,
-	0.846873231509858,
-	0.8549926081242338,
-	0.8631572134541023,
-	0.8713671191987972,
-	0.8796223968878317,
-	0.8879231178819663,
-	0.8962693533742664,
-	0.9046611743911496,
-	0.9130986517934192,
-	0.9215818562772946,
-	0.9301108583754237,
-	0.938685728457888,
-	0.9473065367331999,
-	0.9559733532492861,
-	0.9646862478944651,
-	0.9734452903984125,
-	0.9822505503331171,
-	0.9911020971138298,
-	1
-);
-
-
-// Calculate the luminance for a color.
-// Luminance is defined as a decimal value between 0 and 1
-// with "0" corresponding to "no brightness"
-// and "1" corresponding to "full brightness".
-//
-// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
-
-@function daff-luminance($color) {
-	$red-index: red($color) + 1;
-	$green-index: green($color) + 1;
-	$blue-index: blue($color) + 1;
-
-	$red: nth($linear-channel-values, $red-index);
-	$green: nth($linear-channel-values, $green-index);
-	$blue: nth($linear-channel-values, $blue-index);
-	@return 0.2126 * $red + 0.7152 * $green + 0.0722 * $blue;
-}
-
-//  Precomputed linear color channel values, for use in contrast calculations.
-//  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
-//
-//  Algorithm, for c in 0 to 255:
-//  f(c) {
-//    c = c / 255;
-//    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
-//  }
-//
-//  This lookup table is needed since there is no `pow` in SASS.
-$linear-channel-values: (
-	0,
-	0.0003035269835488375,
-	0.000607053967097675,
-	0.0009105809506465125,
-	0.00121410793419535,
-	0.0015176349177441874,
-	0.001821161901293025,
-	0.0021246888848418626,
-	0.0024282158683907,
-	0.0027317428519395373,
-	0.003035269835488375,
-	0.003346535763899161,
-	0.003676507324047436,
-	0.004024717018496307,
-	0.004391442037410293,
-	0.004776953480693729,
-	0.005181516702338386,
-	0.005605391624202723,
-	0.006048833022857054,
-	0.006512090792594475,
-	0.006995410187265387,
-	0.007499032043226175,
-	0.008023192985384994,
-	0.008568125618069307,
-	0.009134058702220787,
-	0.00972121732023785,
-	0.010329823029626936,
-	0.010960094006488246,
-	0.011612245179743885,
-	0.012286488356915872,
-	0.012983032342173012,
-	0.013702083047289686,
-	0.014443843596092545,
-	0.01520851442291271,
-	0.01599629336550963,
-	0.016807375752887384,
-	0.017641954488384078,
-	0.018500220128379697,
-	0.019382360956935723,
-	0.0202885630566524,
-	0.021219010376003555,
-	0.022173884793387385,
-	0.02315336617811041,
-	0.024157632448504756,
-	0.02518685962736163,
-	0.026241221894849898,
-	0.027320891639074894,
-	0.028426039504420793,
-	0.0295568344378088,
-	0.030713443732993635,
-	0.03189603307301153,
-	0.033104766570885055,
-	0.03433980680868217,
-	0.03560131487502034,
-	0.03688945040110004,
-	0.0382043715953465,
-	0.03954623527673284,
-	0.04091519690685319,
-	0.042311410620809675,
-	0.043735029256973465,
-	0.04518620438567554,
-	0.046665086336880095,
-	0.04817182422688942,
-	0.04970656598412723,
-	0.05126945837404324,
-	0.052860647023180246,
-	0.05448027644244237,
-	0.05612849004960009,
-	0.05780543019106723,
-	0.0595112381629812,
-	0.06124605423161761,
-	0.06301001765316767,
-	0.06480326669290577,
-	0.06662593864377289,
-	0.06847816984440017,
-	0.07036009569659588,
-	0.07227185068231748,
-	0.07421356838014963,
-	0.07618538148130785,
-	0.07818742180518633,
-	0.08021982031446832,
-	0.0822827071298148,
-	0.08437621154414882,
-	0.08650046203654976,
-	0.08865558628577294,
-	0.09084171118340768,
-	0.09305896284668745,
-	0.0953074666309647,
-	0.09758734714186246,
-	0.09989872824711389,
-	0.10224173308810132,
-	0.10461648409110419,
-	0.10702310297826761,
-	0.10946171077829933,
-	0.1119324278369056,
-	0.11443537382697373,
-	0.11697066775851084,
-	0.11953842798834562,
-	0.12213877222960187,
-	0.12477181756095049,
-	0.12743768043564743,
-	0.1301364766903643,
-	0.13286832155381798,
-	0.13563332965520566,
-	0.13843161503245183,
-	0.14126329114027164,
-	0.14412847085805777,
-	0.14702726649759498,
-	0.14995978981060856,
-	0.15292615199615017,
-	0.1559264637078274,
-	0.1589608350608804,
-	0.162029375639111,
-	0.1651321945016676,
-	0.16826940018969075,
-	0.1714411007328226,
-	0.17464740365558504,
-	0.17788841598362912,
-	0.18116424424986022,
-	0.184474994500441,
-	0.18782077230067787,
-	0.19120168274079138,
-	0.1946178304415758,
-	0.19806931955994886,
-	0.20155625379439707,
-	0.20507873639031693,
-	0.20863687014525575,
-	0.21223075741405523,
-	0.21586050011389926,
-	0.2195261997292692,
-	0.2232279573168085,
-	0.22696587351009836,
-	0.23074004852434915,
-	0.23455058216100522,
-	0.238397573812271,
-	0.24228112246555486,
-	0.24620132670783548,
-	0.25015828472995344,
-	0.25415209433082675,
-	0.2581828529215958,
-	0.26225065752969623,
-	0.26635560480286247,
-	0.2704977910130658,
-	0.27467731206038465,
-	0.2788942634768104,
-	0.2831487404299921,
-	0.2874408377269175,
-	0.29177064981753587,
-	0.2961382707983211,
-	0.3005437944157765,
-	0.3049873140698863,
-	0.30946892281750854,
-	0.31398871337571754,
-	0.31854677812509186,
-	0.32314320911295075,
-	0.3277780980565422,
-	0.33245153634617935,
-	0.33716361504833037,
-	0.3419144249086609,
-	0.3467040563550296,
-	0.35153259950043936,
-	0.3564001441459435,
-	0.3613067797835095,
-	0.3662525955988395,
-	0.3712376804741491,
-	0.3762621229909065,
-	0.38132601143253014,
-	0.386429433787049,
-	0.39157247774972326,
-	0.39675523072562685,
-	0.4019777798321958,
-	0.4072402119017367,
-	0.41254261348390375,
-	0.4178850708481375,
-	0.4232676699860717,
-	0.4286904966139066,
-	0.43415363617474895,
-	0.4396571738409188,
-	0.44520119451622786,
-	0.45078578283822346,
-	0.45641102318040466,
-	0.4620769996544071,
-	0.467783796112159,
-	0.47353149614800955,
-	0.4793201831008268,
-	0.4851499400560704,
-	0.4910208498478356,
-	0.4969329950608704,
-	0.5028864580325687,
-	0.5088813208549338,
-	0.5149176653765214,
-	0.5209955732043543,
-	0.5271151257058131,
-	0.5332764040105052,
-	0.5394794890121072,
-	0.5457244613701866,
-	0.5520114015120001,
-	0.5583403896342679,
-	0.5647115057049292,
-	0.5711248294648731,
-	0.5775804404296506,
-	0.5840784178911641,
-	0.5906188409193369,
-	0.5972017883637634,
-	0.6038273388553378,
-	0.6104955708078648,
-	0.6172065624196511,
-	0.6239603916750761,
-	0.6307571363461468,
-	0.6375968739940326,
-	0.6444796819705821,
-	0.6514056374198242,
-	0.6583748172794485,
-	0.665387298282272,
-	0.6724431569576875,
-	0.6795424696330938,
-	0.6866853124353135,
-	0.6938717612919899,
-	0.7011018919329731,
-	0.7083757798916868,
-	0.7156935005064807,
-	0.7230551289219693,
-	0.7304607400903537,
-	0.7379104087727308,
-	0.7454042095403874,
-	0.7529422167760779,
-	0.7605245046752924,
-	0.768151147247507,
-	0.7758222183174236,
-	0.7835377915261935,
-	0.7912979403326302,
-	0.799102738014409,
-	0.8069522576692516,
-	0.8148465722161012,
-	0.8227857543962835,
-	0.8307698767746546,
-	0.83879901174074,
-	0.846873231509858,
-	0.8549926081242338,
-	0.8631572134541023,
-	0.8713671191987972,
-	0.8796223968878317,
-	0.8879231178819663,
-	0.8962693533742664,
-	0.9046611743911496,
-	0.9130986517934192,
-	0.9215818562772946,
-	0.9301108583754237,
-	0.938685728457888,
-	0.9473065367331999,
-	0.9559733532492861,
-	0.9646862478944651,
-	0.9734452903984125,
-	0.9822505503331171,
-	0.9911020971138298,
-	1
-);
-
-
-// Calculate the luminance for a color.
-// Luminance is defined as a decimal value between 0 and 1
-// with "0" corresponding to "no brightness"
-// and "1" corresponding to "full brightness".
-//
-// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
-
-@function daff-luminance($color) {
-	$red-index: red($color) + 1;
-	$green-index: green($color) + 1;
-	$blue-index: blue($color) + 1;
-
-	$red: nth($linear-channel-values, $red-index);
-	$green: nth($linear-channel-values, $green-index);
-	$blue: nth($linear-channel-values, $blue-index);
-	@return 0.2126 * $red + 0.7152 * $green + 0.0722 * $blue;
-}
-
-
-// Calculate the contrast ratio between two colors.
-// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
-@function daff-contrast-ratio($back, $front) {
-	$back-lum: daff-luminance($back) + 0.05;
-	$fore-lum: daff-luminance($front) + 0.05;
-
-	@return max($back-lum, $fore-lum) / min($back-lum, $fore-lum);
-}
-
-//  Precomputed linear color channel values, for use in contrast calculations.
-//  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
-//
-//  Algorithm, for c in 0 to 255:
-//  f(c) {
-//    c = c / 255;
-//    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
-//  }
-//
-//  This lookup table is needed since there is no `pow` in SASS.
-$linear-channel-values: (
-	0,
-	0.0003035269835488375,
-	0.000607053967097675,
-	0.0009105809506465125,
-	0.00121410793419535,
-	0.0015176349177441874,
-	0.001821161901293025,
-	0.0021246888848418626,
-	0.0024282158683907,
-	0.0027317428519395373,
-	0.003035269835488375,
-	0.003346535763899161,
-	0.003676507324047436,
-	0.004024717018496307,
-	0.004391442037410293,
-	0.004776953480693729,
-	0.005181516702338386,
-	0.005605391624202723,
-	0.006048833022857054,
-	0.006512090792594475,
-	0.006995410187265387,
-	0.007499032043226175,
-	0.008023192985384994,
-	0.008568125618069307,
-	0.009134058702220787,
-	0.00972121732023785,
-	0.010329823029626936,
-	0.010960094006488246,
-	0.011612245179743885,
-	0.012286488356915872,
-	0.012983032342173012,
-	0.013702083047289686,
-	0.014443843596092545,
-	0.01520851442291271,
-	0.01599629336550963,
-	0.016807375752887384,
-	0.017641954488384078,
-	0.018500220128379697,
-	0.019382360956935723,
-	0.0202885630566524,
-	0.021219010376003555,
-	0.022173884793387385,
-	0.02315336617811041,
-	0.024157632448504756,
-	0.02518685962736163,
-	0.026241221894849898,
-	0.027320891639074894,
-	0.028426039504420793,
-	0.0295568344378088,
-	0.030713443732993635,
-	0.03189603307301153,
-	0.033104766570885055,
-	0.03433980680868217,
-	0.03560131487502034,
-	0.03688945040110004,
-	0.0382043715953465,
-	0.03954623527673284,
-	0.04091519690685319,
-	0.042311410620809675,
-	0.043735029256973465,
-	0.04518620438567554,
-	0.046665086336880095,
-	0.04817182422688942,
-	0.04970656598412723,
-	0.05126945837404324,
-	0.052860647023180246,
-	0.05448027644244237,
-	0.05612849004960009,
-	0.05780543019106723,
-	0.0595112381629812,
-	0.06124605423161761,
-	0.06301001765316767,
-	0.06480326669290577,
-	0.06662593864377289,
-	0.06847816984440017,
-	0.07036009569659588,
-	0.07227185068231748,
-	0.07421356838014963,
-	0.07618538148130785,
-	0.07818742180518633,
-	0.08021982031446832,
-	0.0822827071298148,
-	0.08437621154414882,
-	0.08650046203654976,
-	0.08865558628577294,
-	0.09084171118340768,
-	0.09305896284668745,
-	0.0953074666309647,
-	0.09758734714186246,
-	0.09989872824711389,
-	0.10224173308810132,
-	0.10461648409110419,
-	0.10702310297826761,
-	0.10946171077829933,
-	0.1119324278369056,
-	0.11443537382697373,
-	0.11697066775851084,
-	0.11953842798834562,
-	0.12213877222960187,
-	0.12477181756095049,
-	0.12743768043564743,
-	0.1301364766903643,
-	0.13286832155381798,
-	0.13563332965520566,
-	0.13843161503245183,
-	0.14126329114027164,
-	0.14412847085805777,
-	0.14702726649759498,
-	0.14995978981060856,
-	0.15292615199615017,
-	0.1559264637078274,
-	0.1589608350608804,
-	0.162029375639111,
-	0.1651321945016676,
-	0.16826940018969075,
-	0.1714411007328226,
-	0.17464740365558504,
-	0.17788841598362912,
-	0.18116424424986022,
-	0.184474994500441,
-	0.18782077230067787,
-	0.19120168274079138,
-	0.1946178304415758,
-	0.19806931955994886,
-	0.20155625379439707,
-	0.20507873639031693,
-	0.20863687014525575,
-	0.21223075741405523,
-	0.21586050011389926,
-	0.2195261997292692,
-	0.2232279573168085,
-	0.22696587351009836,
-	0.23074004852434915,
-	0.23455058216100522,
-	0.238397573812271,
-	0.24228112246555486,
-	0.24620132670783548,
-	0.25015828472995344,
-	0.25415209433082675,
-	0.2581828529215958,
-	0.26225065752969623,
-	0.26635560480286247,
-	0.2704977910130658,
-	0.27467731206038465,
-	0.2788942634768104,
-	0.2831487404299921,
-	0.2874408377269175,
-	0.29177064981753587,
-	0.2961382707983211,
-	0.3005437944157765,
-	0.3049873140698863,
-	0.30946892281750854,
-	0.31398871337571754,
-	0.31854677812509186,
-	0.32314320911295075,
-	0.3277780980565422,
-	0.33245153634617935,
-	0.33716361504833037,
-	0.3419144249086609,
-	0.3467040563550296,
-	0.35153259950043936,
-	0.3564001441459435,
-	0.3613067797835095,
-	0.3662525955988395,
-	0.3712376804741491,
-	0.3762621229909065,
-	0.38132601143253014,
-	0.386429433787049,
-	0.39157247774972326,
-	0.39675523072562685,
-	0.4019777798321958,
-	0.4072402119017367,
-	0.41254261348390375,
-	0.4178850708481375,
-	0.4232676699860717,
-	0.4286904966139066,
-	0.43415363617474895,
-	0.4396571738409188,
-	0.44520119451622786,
-	0.45078578283822346,
-	0.45641102318040466,
-	0.4620769996544071,
-	0.467783796112159,
-	0.47353149614800955,
-	0.4793201831008268,
-	0.4851499400560704,
-	0.4910208498478356,
-	0.4969329950608704,
-	0.5028864580325687,
-	0.5088813208549338,
-	0.5149176653765214,
-	0.5209955732043543,
-	0.5271151257058131,
-	0.5332764040105052,
-	0.5394794890121072,
-	0.5457244613701866,
-	0.5520114015120001,
-	0.5583403896342679,
-	0.5647115057049292,
-	0.5711248294648731,
-	0.5775804404296506,
-	0.5840784178911641,
-	0.5906188409193369,
-	0.5972017883637634,
-	0.6038273388553378,
-	0.6104955708078648,
-	0.6172065624196511,
-	0.6239603916750761,
-	0.6307571363461468,
-	0.6375968739940326,
-	0.6444796819705821,
-	0.6514056374198242,
-	0.6583748172794485,
-	0.665387298282272,
-	0.6724431569576875,
-	0.6795424696330938,
-	0.6866853124353135,
-	0.6938717612919899,
-	0.7011018919329731,
-	0.7083757798916868,
-	0.7156935005064807,
-	0.7230551289219693,
-	0.7304607400903537,
-	0.7379104087727308,
-	0.7454042095403874,
-	0.7529422167760779,
-	0.7605245046752924,
-	0.768151147247507,
-	0.7758222183174236,
-	0.7835377915261935,
-	0.7912979403326302,
-	0.799102738014409,
-	0.8069522576692516,
-	0.8148465722161012,
-	0.8227857543962835,
-	0.8307698767746546,
-	0.83879901174074,
-	0.846873231509858,
-	0.8549926081242338,
-	0.8631572134541023,
-	0.8713671191987972,
-	0.8796223968878317,
-	0.8879231178819663,
-	0.8962693533742664,
-	0.9046611743911496,
-	0.9130986517934192,
-	0.9215818562772946,
-	0.9301108583754237,
-	0.938685728457888,
-	0.9473065367331999,
-	0.9559733532492861,
-	0.9646862478944651,
-	0.9734452903984125,
-	0.9822505503331171,
-	0.9911020971138298,
-	1
-);
-
-
-// Calculate the luminance for a color.
-// Luminance is defined as a decimal value between 0 and 1
-// with "0" corresponding to "no brightness"
-// and "1" corresponding to "full brightness".
-//
-// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
-
-@function daff-luminance($color) {
-	$red-index: red($color) + 1;
-	$green-index: green($color) + 1;
-	$blue-index: blue($color) + 1;
-
-	$red: nth($linear-channel-values, $red-index);
-	$green: nth($linear-channel-values, $green-index);
-	$blue: nth($linear-channel-values, $blue-index);
-	@return 0.2126 * $red + 0.7152 * $green + 0.0722 * $blue;
-}
-
-
-// Calculate the contrast ratio between two colors.
-// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
-@function daff-contrast-ratio($back, $front) {
-	$back-lum: daff-luminance($back) + 0.05;
-	$fore-lum: daff-luminance($front) + 0.05;
-
-	@return max($back-lum, $fore-lum) / min($back-lum, $fore-lum);
-}
-
-//
-// Takes a color palette and retrieves the hue from the palette
-// If no color is selected, it will retrieve the default
-// color from the palette
-//
-// @usage
-// ```
-// daff-color($daff-yellow, 60);
-// ```
-@function daff-color($palette, $color: 'default') {
-	@if (not(map-has-key($palette, $color))) {
-		@error 'Color: `#{$color}` does not exist in palette';
-	}
-
-	@return map-get($palette, $color);
-}
-
-// Base colors
-$daff-white: #ffffff;
-$error: #dd0000;
-
-// 60 apart passes AAA level for any size text (except for 10/70)
-// 50 apart passes AA level for any size text (except for 10/60)
-
-$daff-blue: (
-	10: #ebf1ff,
-	20: #c4d8ff,
-	30: #9dbeff,
-	40: #79a7ff,
-	50: #548fff,
-	60: #1f66ff,
-	70: #093cf3,
-	80: #001bcb,
-	90: #00098a,
-	100: #000033
-);
-
-$daff-primary: $daff-blue;
-
-$daff-purple: (
-	10: #ebebff,
-	20: #d4d3ff,
-	30: #b7b4ff,
-	40: #a19bff,
-	50: #8b82ff,
-	60: #6a57ff,
-	70: #5631f3,
-	80: #3c13bd,
-	90: #2c068a,
-	100: #110033
-);
-
-$daff-accent: $daff-purple;
-
-$daff-turquoise: (
-	10: #d6fcea,
-	20: #9dfbd3,
-	30: #51e1ae,
-	40: #37c193,
-	50: #1fa67c,
-	60: #00835f,
-	70: #0f654a,
-	80: #104b37,
-	90: #0d3426,
-	100: #082218
-);
-
-$daff-yellow: (
-	10: #fffaeb,
-	20: #fff1c2,
-	30: #ffe799,
-	40: #ffde70,
-	50: #ffd447,
-	60: #ffc810,
-	70: #f5bc00,
-	80: #cc9c00,
-	90: #a37d00,
-	100: #7a5e00
-);
-
-$daff-red: (
-	10: #fcf1f1,
-	20: #fae0e0,
-	30: #f8babb,
-	40: #f88d8f,
-	50: #fb5d61,
-	60: #ec0019,
-	70: #b30e19,
-	80: #871016,
-	90: #5e0c10,
-	100: #3f0809,
-);
-
-$daff-bronze: (
-	10: #fcf2eb,
-	20: #f7dac6,
-	30: #f2c093,
-	40: #e49d40,
-	50: #d2801a,
-	60: #b36200,
-	70: #955400,
-	80: #704000,
-	90: #462900,
-	100: #1a0f00,
-);
-
-$daff-green: (
-	10: #c4ffcc,
-	20: #6aff86,
-	30: #00db57,
-	40: #13c049,
-	50: #00aa3c,
-	60: #00852e,
-	70: #006b23,
-	80: #004b17,
-	90: #0c3515,
-	100: #07230d,
-);
-
-$daff-gray: (
-	0: #ffffff,
-	10: #fafafa,
-	20: #e8e8e8,
-	30: #d3d3d3,
-	40: #b6b6b6,
-	50: #949494,
-	60: #767676,
-	70: #5e5e5e,
-	80: #474747,
-	90: #323232,
-	100: #1a1a1a,
-	110: #070707
-);
-
-
-// @docs
-//
-// Given a color, get the font color that would be
-// easily visible on top of that color
-//
-// For an interesting read, see more about the topic:
-// https://robots.thoughtbot.com/closer-look-color-lightness
-//
-// Based on the code outlined by Sergio Gomes here:
-// https://medium.com/dev-channel/using-sass-to-automatically-pick-text-colors-4ba7645d2796
-//
-// @usage
-// ```
-// daff-text-contrast("#777777")
-// ```
-@function daff-text-contrast(
-	$color,
-	$black: daff-color($daff-gray, 110),
-	$white: $daff-white
-) {
-	$light-contrast: daff-contrast-ratio($color, $white);
-	$dark-contrast: daff-contrast-ratio($color, $black);
-
-	@if ($light-contrast > $dark-contrast) {
-		@return $white;
-	}
-	@else {
-		@return $black;
-	}
-}
-
-
-//
-// Takes a color palette and retrieves the hue from the palette
-// If no color is selected, it will retrieve the default
-// color from the palette
-//
-// @usage
-// ```
-// daff-color($daff-yellow, 60);
-// ```
-@function daff-color($palette, $color: 'default') {
-	@if (not(map-has-key($palette, $color))) {
-		@error 'Color: `#{$color}` does not exist in palette';
-	}
-
-	@return map-get($palette, $color);
-}
-
-//  Precomputed linear color channel values, for use in contrast calculations.
-//  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
-//
-//  Algorithm, for c in 0 to 255:
-//  f(c) {
-//    c = c / 255;
-//    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
-//  }
-//
-//  This lookup table is needed since there is no `pow` in SASS.
-$linear-channel-values: (
-	0,
-	0.0003035269835488375,
-	0.000607053967097675,
-	0.0009105809506465125,
-	0.00121410793419535,
-	0.0015176349177441874,
-	0.001821161901293025,
-	0.0021246888848418626,
-	0.0024282158683907,
-	0.0027317428519395373,
-	0.003035269835488375,
-	0.003346535763899161,
-	0.003676507324047436,
-	0.004024717018496307,
-	0.004391442037410293,
-	0.004776953480693729,
-	0.005181516702338386,
-	0.005605391624202723,
-	0.006048833022857054,
-	0.006512090792594475,
-	0.006995410187265387,
-	0.007499032043226175,
-	0.008023192985384994,
-	0.008568125618069307,
-	0.009134058702220787,
-	0.00972121732023785,
-	0.010329823029626936,
-	0.010960094006488246,
-	0.011612245179743885,
-	0.012286488356915872,
-	0.012983032342173012,
-	0.013702083047289686,
-	0.014443843596092545,
-	0.01520851442291271,
-	0.01599629336550963,
-	0.016807375752887384,
-	0.017641954488384078,
-	0.018500220128379697,
-	0.019382360956935723,
-	0.0202885630566524,
-	0.021219010376003555,
-	0.022173884793387385,
-	0.02315336617811041,
-	0.024157632448504756,
-	0.02518685962736163,
-	0.026241221894849898,
-	0.027320891639074894,
-	0.028426039504420793,
-	0.0295568344378088,
-	0.030713443732993635,
-	0.03189603307301153,
-	0.033104766570885055,
-	0.03433980680868217,
-	0.03560131487502034,
-	0.03688945040110004,
-	0.0382043715953465,
-	0.03954623527673284,
-	0.04091519690685319,
-	0.042311410620809675,
-	0.043735029256973465,
-	0.04518620438567554,
-	0.046665086336880095,
-	0.04817182422688942,
-	0.04970656598412723,
-	0.05126945837404324,
-	0.052860647023180246,
-	0.05448027644244237,
-	0.05612849004960009,
-	0.05780543019106723,
-	0.0595112381629812,
-	0.06124605423161761,
-	0.06301001765316767,
-	0.06480326669290577,
-	0.06662593864377289,
-	0.06847816984440017,
-	0.07036009569659588,
-	0.07227185068231748,
-	0.07421356838014963,
-	0.07618538148130785,
-	0.07818742180518633,
-	0.08021982031446832,
-	0.0822827071298148,
-	0.08437621154414882,
-	0.08650046203654976,
-	0.08865558628577294,
-	0.09084171118340768,
-	0.09305896284668745,
-	0.0953074666309647,
-	0.09758734714186246,
-	0.09989872824711389,
-	0.10224173308810132,
-	0.10461648409110419,
-	0.10702310297826761,
-	0.10946171077829933,
-	0.1119324278369056,
-	0.11443537382697373,
-	0.11697066775851084,
-	0.11953842798834562,
-	0.12213877222960187,
-	0.12477181756095049,
-	0.12743768043564743,
-	0.1301364766903643,
-	0.13286832155381798,
-	0.13563332965520566,
-	0.13843161503245183,
-	0.14126329114027164,
-	0.14412847085805777,
-	0.14702726649759498,
-	0.14995978981060856,
-	0.15292615199615017,
-	0.1559264637078274,
-	0.1589608350608804,
-	0.162029375639111,
-	0.1651321945016676,
-	0.16826940018969075,
-	0.1714411007328226,
-	0.17464740365558504,
-	0.17788841598362912,
-	0.18116424424986022,
-	0.184474994500441,
-	0.18782077230067787,
-	0.19120168274079138,
-	0.1946178304415758,
-	0.19806931955994886,
-	0.20155625379439707,
-	0.20507873639031693,
-	0.20863687014525575,
-	0.21223075741405523,
-	0.21586050011389926,
-	0.2195261997292692,
-	0.2232279573168085,
-	0.22696587351009836,
-	0.23074004852434915,
-	0.23455058216100522,
-	0.238397573812271,
-	0.24228112246555486,
-	0.24620132670783548,
-	0.25015828472995344,
-	0.25415209433082675,
-	0.2581828529215958,
-	0.26225065752969623,
-	0.26635560480286247,
-	0.2704977910130658,
-	0.27467731206038465,
-	0.2788942634768104,
-	0.2831487404299921,
-	0.2874408377269175,
-	0.29177064981753587,
-	0.2961382707983211,
-	0.3005437944157765,
-	0.3049873140698863,
-	0.30946892281750854,
-	0.31398871337571754,
-	0.31854677812509186,
-	0.32314320911295075,
-	0.3277780980565422,
-	0.33245153634617935,
-	0.33716361504833037,
-	0.3419144249086609,
-	0.3467040563550296,
-	0.35153259950043936,
-	0.3564001441459435,
-	0.3613067797835095,
-	0.3662525955988395,
-	0.3712376804741491,
-	0.3762621229909065,
-	0.38132601143253014,
-	0.386429433787049,
-	0.39157247774972326,
-	0.39675523072562685,
-	0.4019777798321958,
-	0.4072402119017367,
-	0.41254261348390375,
-	0.4178850708481375,
-	0.4232676699860717,
-	0.4286904966139066,
-	0.43415363617474895,
-	0.4396571738409188,
-	0.44520119451622786,
-	0.45078578283822346,
-	0.45641102318040466,
-	0.4620769996544071,
-	0.467783796112159,
-	0.47353149614800955,
-	0.4793201831008268,
-	0.4851499400560704,
-	0.4910208498478356,
-	0.4969329950608704,
-	0.5028864580325687,
-	0.5088813208549338,
-	0.5149176653765214,
-	0.5209955732043543,
-	0.5271151257058131,
-	0.5332764040105052,
-	0.5394794890121072,
-	0.5457244613701866,
-	0.5520114015120001,
-	0.5583403896342679,
-	0.5647115057049292,
-	0.5711248294648731,
-	0.5775804404296506,
-	0.5840784178911641,
-	0.5906188409193369,
-	0.5972017883637634,
-	0.6038273388553378,
-	0.6104955708078648,
-	0.6172065624196511,
-	0.6239603916750761,
-	0.6307571363461468,
-	0.6375968739940326,
-	0.6444796819705821,
-	0.6514056374198242,
-	0.6583748172794485,
-	0.665387298282272,
-	0.6724431569576875,
-	0.6795424696330938,
-	0.6866853124353135,
-	0.6938717612919899,
-	0.7011018919329731,
-	0.7083757798916868,
-	0.7156935005064807,
-	0.7230551289219693,
-	0.7304607400903537,
-	0.7379104087727308,
-	0.7454042095403874,
-	0.7529422167760779,
-	0.7605245046752924,
-	0.768151147247507,
-	0.7758222183174236,
-	0.7835377915261935,
-	0.7912979403326302,
-	0.799102738014409,
-	0.8069522576692516,
-	0.8148465722161012,
-	0.8227857543962835,
-	0.8307698767746546,
-	0.83879901174074,
-	0.846873231509858,
-	0.8549926081242338,
-	0.8631572134541023,
-	0.8713671191987972,
-	0.8796223968878317,
-	0.8879231178819663,
-	0.8962693533742664,
-	0.9046611743911496,
-	0.9130986517934192,
-	0.9215818562772946,
-	0.9301108583754237,
-	0.938685728457888,
-	0.9473065367331999,
-	0.9559733532492861,
-	0.9646862478944651,
-	0.9734452903984125,
-	0.9822505503331171,
-	0.9911020971138298,
-	1
-);
-
-
-// Calculate the luminance for a color.
-// Luminance is defined as a decimal value between 0 and 1
-// with "0" corresponding to "no brightness"
-// and "1" corresponding to "full brightness".
-//
-// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
-
-@function daff-luminance($color) {
-	$red-index: red($color) + 1;
-	$green-index: green($color) + 1;
-	$blue-index: blue($color) + 1;
-
-	$red: nth($linear-channel-values, $red-index);
-	$green: nth($linear-channel-values, $green-index);
-	$blue: nth($linear-channel-values, $blue-index);
-	@return 0.2126 * $red + 0.7152 * $green + 0.0722 * $blue;
-}
-
-
-//
-// Take a numeric map and sort it.
-//
-// https://gist.github.com/Jakobud/a0ac11e80a1de453cd86f0d3fc0a1410
-// Credit to: https://gist.github.com/iamandrewluca
-//
-@function _daff-illuminate-sort($map) {
-	// Transform map to zipped list
-	$keys: ();
-	$values: ();
-
-	@each $key, $val in $map {
-		$keys: append($keys, $key);
-		$values: append($values, $val);
-	}
-
-	$list: zip($keys, $values);
-
-	$sorted-map: ();
-
-	@while length($list) > 0 {
-		// Find smallest pair
-		$smallest-pair: nth($list, 1);
-
-		@each $pair in $list {
-			$value: nth($pair, 2);
-			$smallest-value: nth($smallest-pair, 2);
-
-			@if $value < $smallest-value {
-				$smallest-pair: $pair;
-			}
-		}
-
-		// Add smallest pair to sorted map
-		$key: nth($smallest-pair, 1);
-		$value: nth($smallest-pair, 2);
-		$sorted-map: map-merge(
-			$sorted-map,
-			(
-				$key: $value
-			)
-		);
-
-		// Remove from list smallest pair
-		$smallest-pair-index: index($list, $smallest-pair);
-		$new-list: ();
-
-		@for $i from 1 through length($list) {
-			@if $i != $smallest-pair-index {
-				$new-list: append($new-list, nth($list, $i), 'space');
-			}
-		}
-
-		$list: $new-list;
-	}
-
-	@return $sorted-map;
-}
-
-// Given a map of key, luminance pairs, find the key
-// of the value that is "nth" away from zero.
-//
-// @param $map: a map of key, luminance pairs,
-// @param $nth: nth steps away from zero
-@function _daff-illuminate-get-key($map, $nth: 1) {
-	//Cap off "nth" to prevent going out-of-bounds.
-	@if ($nth > length($map)) {
-		$nth: length(map);
-	}
-
-	$map: _daff-illuminate-sort($map);
-	@return nth(nth($map, $nth), 1);
-}
-
-// Takes a $color and palette and returns the color in
-// the palette which would "illuminate" against that color.
-//
-// @usage
-// ```
-// daff-illuminate($palette);
-// ```
-//
-@function daff-illuminate($color, $palette, $nth: 1) {
-	$luminance-map: ();
-
-	//Validate
-	@each $key, $palette-color in $palette {
-		@if (type-of($key) == 'string') {
-			$palette: map-remove($palette, $key);
-		}
-	}
-
-	//Transform into usable values
-	@each $key, $palette-color in $palette {
-		$luminance-map: map-merge(
-			$luminance-map,
-			(
-				$key: (
-					daff-luminance($palette-color) - daff-luminance($color)
-				)
-			)
-		);
-	}
-
-
-	//Calculate which color to get
-	$brighter-colors: ();
-	$darker-colors: ();
-
-	@each $key, $luminance in $luminance-map {
-		@if ($luminance > 0) {
-			$brighter-colors: map-merge(
-				$brighter-colors,
-				(
-					$key: $luminance
-				)
-			);
-		}
-
-		@if ($luminance < 0) {
-			$darker-colors: map-merge(
-				$darker-colors,
-				(
-					$key: abs($luminance)
-				)
-			);
-		}
-	}
-
-	$key: null;
-
-	@if (daff-luminance($color) >= 0.5) {
-		//If the color is bright
-		$key: _daff-illuminate-get-key($darker-colors, $nth);
-	}
-	@else {
-		//If the color is dark
-		$key: _daff-illuminate-get-key($brighter-colors, $nth);
-	}
-
-	@return map-get($palette, $key);
-}
-
-//
-// Takes a color palette and retrieves the hue from the palette
-// If no color is selected, it will retrieve the default
-// color from the palette
-//
-// @usage
-// ```
-// daff-color($daff-yellow, 60);
-// ```
-@function daff-color($palette, $color: 'default') {
-	@if (not(map-has-key($palette, $color))) {
-		@error 'Color: `#{$color}` does not exist in palette';
-	}
-
-	@return map-get($palette, $color);
-}
-
-
-// @docs
-//
-// Takes a color palette configures some sane defaults
-// Will set the "default" to 60 if $hue isn't specified
-//
-// @usage
-// ```
-// daff-configure-palette($daff-yellow, $hue);
-// ```
-@function daff-configure-palette($color-palette, $hue: 60) {
-	@return map-merge(
-		$color-palette,
-		(
-			'default': daff-color($color-palette, $hue)
-		)
-	);
-}
-
-// Base colors
-$daff-white: #ffffff;
-$error: #dd0000;
-
-// 60 apart passes AAA level for any size text (except for 10/70)
-// 50 apart passes AA level for any size text (except for 10/60)
-
-$daff-blue: (
-	10: #ebf1ff,
-	20: #c4d8ff,
-	30: #9dbeff,
-	40: #79a7ff,
-	50: #548fff,
-	60: #1f66ff,
-	70: #093cf3,
-	80: #001bcb,
-	90: #00098a,
-	100: #000033
-);
-
-$daff-primary: $daff-blue;
-
-$daff-purple: (
-	10: #ebebff,
-	20: #d4d3ff,
-	30: #b7b4ff,
-	40: #a19bff,
-	50: #8b82ff,
-	60: #6a57ff,
-	70: #5631f3,
-	80: #3c13bd,
-	90: #2c068a,
-	100: #110033
-);
-
-$daff-accent: $daff-purple;
-
-$daff-turquoise: (
-	10: #d6fcea,
-	20: #9dfbd3,
-	30: #51e1ae,
-	40: #37c193,
-	50: #1fa67c,
-	60: #00835f,
-	70: #0f654a,
-	80: #104b37,
-	90: #0d3426,
-	100: #082218
-);
-
-$daff-yellow: (
-	10: #fffaeb,
-	20: #fff1c2,
-	30: #ffe799,
-	40: #ffde70,
-	50: #ffd447,
-	60: #ffc810,
-	70: #f5bc00,
-	80: #cc9c00,
-	90: #a37d00,
-	100: #7a5e00
-);
-
-$daff-red: (
-	10: #fcf1f1,
-	20: #fae0e0,
-	30: #f8babb,
-	40: #f88d8f,
-	50: #fb5d61,
-	60: #ec0019,
-	70: #b30e19,
-	80: #871016,
-	90: #5e0c10,
-	100: #3f0809,
-);
-
-$daff-bronze: (
-	10: #fcf2eb,
-	20: #f7dac6,
-	30: #f2c093,
-	40: #e49d40,
-	50: #d2801a,
-	60: #b36200,
-	70: #955400,
-	80: #704000,
-	90: #462900,
-	100: #1a0f00,
-);
-
-$daff-green: (
-	10: #c4ffcc,
-	20: #6aff86,
-	30: #00db57,
-	40: #13c049,
-	50: #00aa3c,
-	60: #00852e,
-	70: #006b23,
-	80: #004b17,
-	90: #0c3515,
-	100: #07230d,
-);
-
-$daff-gray: (
-	0: #ffffff,
-	10: #fafafa,
-	20: #e8e8e8,
-	30: #d3d3d3,
-	40: #b6b6b6,
-	50: #949494,
-	60: #767676,
-	70: #5e5e5e,
-	80: #474747,
-	90: #323232,
-	100: #1a1a1a,
-	110: #070707
-);
-
-//
-// Takes a color palette and retrieves the hue from the palette
-// If no color is selected, it will retrieve the default
-// color from the palette
-//
-// @usage
-// ```
-// daff-color($daff-yellow, 60);
-// ```
-@function daff-color($palette, $color: 'default') {
-	@if (not(map-has-key($palette, $color))) {
-		@error 'Color: `#{$color}` does not exist in palette';
-	}
-
-	@return map-get($palette, $color);
-}
-
-//
-// Takes a color palette and retrieves the hue from the palette
-// If no color is selected, it will retrieve the default
-// color from the palette
-//
-// @usage
-// ```
-// daff-color($daff-yellow, 60);
-// ```
-@function daff-color($palette, $color: 'default') {
-	@if (not(map-has-key($palette, $color))) {
-		@error 'Color: `#{$color}` does not exist in palette';
-	}
-
-	@return map-get($palette, $color);
-}
-
-
-// @docs
-//
-// Takes a color palette configures some sane defaults
-// Will set the "default" to 60 if $hue isn't specified
-//
-// @usage
-// ```
-// daff-configure-palette($daff-yellow, $hue);
-// ```
-@function daff-configure-palette($color-palette, $hue: 60) {
-	@return map-merge(
-		$color-palette,
-		(
-			'default': daff-color($color-palette, $hue)
-		)
-	);
-}
-
-
-$daff-light-theme: (
-	'font-color': daff-color($daff-gray, 110),
-	'base': daff-color($daff-gray, 0),
-	'base-contrast': daff-color($daff-gray, 110),
-	'white': daff-color($daff-gray, 0),
-	'black': daff-color($daff-gray, 110),
-	'gray': daff-configure-palette($daff-gray, 60)
-);
-
-$daff-dark-theme: (
-	'font-color': daff-color($daff-gray, 0),
-	'base': daff-color($daff-gray, 100),
-	'base-contrast': daff-color($daff-gray, 0),
-	'white': daff-color($daff-gray, 0),
-	'black': daff-color($daff-gray, 110),
-	'gray': daff-configure-palette($daff-gray, 60)
-);
-
-$supported-theme-types: (
-	'light': $daff-light-theme,
-	'dark': $daff-dark-theme
-);
-
-// @docs
-//
-// Create a theme object given some initial settings
-//
-// @usage
-// ```
-// daff-configure-theme($daff-yellow, $daff-blue, $daff-purple)
-// ```
-@function daff-configure-theme(
-	$primary,
-	$secondary,
-	$tertiary,
-	$type: 'light'
-) {
-	@return (
-		'primary': $primary,
-		'secondary': $secondary,
-		'tertiary': $tertiary,
-		'core': daff-build-theme-core($type)
-	);
-}
-
-//
-// @docs
-//
-// Create a core theme given a theme type
-// $type | ThemeType : "light" | "dark"
-//
-// ```
-// @usage
-// daff-build-theme-core("light")
-// ```
-@function daff-build-theme-core($type: 'light') {
-	$error-msg: 'is not a valid theme type - valid types:';
-	@if (not map-has-key($supported-theme-types, $type)) {
-		@error '`#{$type}` `#{$error-msg}` `#{map-keys($supported-theme-types)}`';
-	}
-
-	@return map-get($supported-theme-types, $type);
-}
-
-@mixin daff-theme-css-variables($theme) {
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$white: daff-map-deep-get($theme, 'core.white');
-	$black: daff-map-deep-get($theme, 'core.black');
-	$gray: daff-map-deep-get($theme, 'core.gray');
-
-	// @docs
-	//
-	// Global theming css variables
-	:root {
-		--daff-theme-rgb: #{red($base), green($base), blue($base)};
-		--daff-theme-contrast-rgb: #{red($base-contrast), green($base-contrast), blue($base-contrast)};
-		--daff-theme: #{$base};
-		--daff-theme-contrast: #{$base-contrast};
-		--daff-theme-primary: #{daff-color($primary)};
-		--daff-theme-secondary: #{daff-color($secondary)};
-		--daff-theme-tertiary: #{daff-color($tertiary)};
-		--daff-theme-warn: #{daff-color($daff-bronze, 60)};
-		--daff-theme-success: #{daff-color($daff-green, 60)};
-		--daff-theme-danger: #{daff-color($daff-red, 60)};
-		--daff-theme-white: #{$white};
-		--daff-theme-black: #{$black};
-		--daff-theme-gray: #{daff-color($gray)};
-	}
-};
-
-
-@mixin daff-button-theme-variant(
-	$base-color,
-	$hover-color,
-	$active-color: $hover-color
-) {
-	// @if daff-contrast-ratio($base-color, daff-text-contrast($base-color)) < 4.5 {
-	// 	@error 'Button Initial State: ' + map-get($wcag-aa-errors, 'text-contrast');
-	// }
-
-	// @if daff-contrast-ratio($hover-color, daff-text-contrast($base-color)) < 4.5 {
-	// 	@error 'Button Hover State: ' + map-get($wcag-aa-errors, 'text-contrast');
-	// }
-
-	// @if daff-contrast-ratio($active-color, daff-text-contrast($base-color)) < 4.5 {
-	// 	@error 'Button Active State: ' + map-get($wcag-aa-errors, 'text-contrast');
-	// }
-	background-color: $base-color;
-	border: 1px solid $base-color;
-	color: daff-text-contrast($base-color);
-
-	&:hover,
-	&:focus {
-		background-color: $hover-color;
-		border: 1px solid $hover-color;
-		color: daff-text-contrast($hover-color);
-	}
-
-	&:active {
-		background-color: $active-color;
-		border: 1px solid $active-color;
-		color: daff-text-contrast($active-color);
-	}
-}
-
-@mixin daff-icon-button-theme-variant(
-	$base-color: currentColor,
-	$hover-color: currentColor,
-	$active-color: $hover-color
-) {
-	color: $base-color;
-
-	&:hover {
-		color: $hover-color;
-		@if $base-color == currentColor {
-			opacity: 0.8;
-		}
-		@else {
-			opacity: 1;
-		}
-	}
-
-	&:active {
-		color: $active-color;
-	}
-}
-
-@mixin daff-raised-button-theme-variant(
-	$base-color,
-	$active-color,
-	$focus-shadow
-) {
-	@if daff-contrast-ratio($base-color, daff-text-contrast($base-color)) < 4.5 {
-		@error 'Button Initial State: ' + map-get($wcag-aa-errors, 'text-contrast');
-	}
-
-	@if daff-contrast-ratio($base-color, daff-text-contrast($base-color)) < 4.5 {
-		@error 'Button Hover State: '+ map-get($wcag-aa-errors, 'text-contrast');
-	}
-
-	@if daff-contrast-ratio($active-color, daff-text-contrast($active-color)) < 4.5 {
-		@error 'Button Active State: ' + map-get($wcag-aa-errors, 'text-contrast');
-	}
-	background-color: $base-color;
-	border: 1px solid $base-color;
-	box-shadow:
-		0 3px 5px rgba($black, 0.12),
-		0 1px 3px rgba($black, 0.08);
-	color: daff-text-contrast($base-color);
-
-	&:hover {
-		background-color: $base-color;
-		border: 1px solid $base-color;
-	}
-
-	&:hover,
-	&:active {
-		box-shadow:
-			0 6px 12px rgba($black, 0.12),
-			0 4px 6px rgba($black, 0.1);
-	}
-
-	&:focus {
-		outline: none;
-		box-shadow:
-			0 0 0 4px rgba($focus-shadow, 0.3),
-			0 6px 12px rgba($black, 0.12),
-			0 4px 6px rgba($black, 0.1);
-	}
-
-	&:active {
-		background-color: $active-color;
-		border: 1px solid $active-color;
-		color: daff-text-contrast($active-color);
-	}
-}
-
-@mixin daff-stroked-button-theme-variant(
-	$base-color,
-	$font-color,
-	$focus-color
-) {
-	@if daff-contrast-ratio($base-color, daff-text-contrast($base-color)) < 4.5 {
-		@error 'Stroked Button Hover State: ' + map-get($wcag-aa-errors, 'text-contrast');
-	}
-
-	@if daff-contrast-ratio($focus-color, daff-text-contrast($focus-color)) < 4.5 {
-		@error 'Stroked Button Focus State: ' + map-get($wcag-aa-errors, 'text-contrast');
-	}
-
-	@if daff-contrast-ratio($focus-color, daff-text-contrast($focus-color)) < 4.5 {
-		@error 'Stroked Button Active State: ' + map-get($wcag-aa-errors, 'text-contrast');
-	}
-	border: 1px solid $base-color;
-	color: $font-color;
-	background-color: transparent;
-
-	&:hover,
-	&:focus {
-		background-color: $base-color;
-		border: 1px solid $base-color;
-		color: daff-text-contrast($base-color);
-	}
-
-	&:active {
-		background-color: $focus-color;
-		border: 1px solid $focus-color;
-		color: daff-text-contrast($focus-color);
-	}
-}
-
-@mixin daff-underline-button-theme-variant(
-	$base-color: currentColor,
-) {
-	color: $base-color;
-
-	&::after {
-		background-color: $base-color;
-	}
-}
-
-@mixin daff-button-focus-theme-variant($shadow-color) {
-	&:focus {
-		outline: none;
-		box-shadow: 0 0 0 4px rgba($shadow-color, 0.3);
-	}
-}
-
-
-@mixin daff-button-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-	$white: daff-map-deep-get($theme, 'core.white');
-	$black: daff-map-deep-get($theme, 'core.black');
-	$gray: daff-configure-palette($daff-gray, 60);
-
-	.daff-button {
-		@include daff-button-theme-variant(
-			daff-illuminate($base, $daff-gray, 2),
-			daff-illuminate($base, $daff-gray, 3),
-			daff-illuminate($base, $daff-gray, 4)
-		);
-
-		&.daff-primary {
-			@include daff-button-theme-variant(
-				daff-color($primary),
-				daff-color($primary, 70),
-				daff-color($primary, 80)
-			);
-		}
-
-		&.daff-secondary {
-			@include daff-button-theme-variant(
-				daff-color($secondary),
-				daff-color($secondary, 70),
-				daff-color($secondary, 80),
-			);
-		}
-
-		&.daff-tertiary {
-			@include daff-button-theme-variant(
-				daff-color($tertiary),
-				daff-color($tertiary, 70),
-				daff-color($tertiary, 80)
-			);
-		}
-
-		&.daff-black {
-			@include daff-button-theme-variant(
-				$black,
-				daff-color($daff-gray, 100),
-				daff-color($daff-gray, 90)
-			);
-		}
-
-		&.daff-white {
-			@include daff-button-theme-variant(
-				$white,
-				daff-color($daff-gray, 20),
-				daff-color($daff-gray, 30)
-			);
-		}
-
-		&.daff-theme {
-			@include daff-button-theme-variant(
-				$base,
-				daff-illuminate($base, $daff-gray, 2),
-				daff-illuminate($base, $daff-gray, 3)
-			);
-		}
-
-		&.daff-theme-contrast {
-			@include daff-button-theme-variant(
-				$base-contrast,
-				daff-illuminate($base-contrast, $daff-gray, 2),
-				daff-illuminate($base-contrast, $daff-gray, 3)
-			);
-		}
-
-		&[disabled] {
-			@include daff-button-theme-variant(
-				daff-illuminate($base, $daff-gray, 3),
-				daff-illuminate($base, $daff-gray, 3),
-				daff-illuminate($base, $daff-gray, 3),
-			);
-			color: daff-illuminate($base, $daff-gray, 5);
-
-			&:hover {
-				color: daff-illuminate($base, $daff-gray, 5);
-			}
-		}
-
-		&.daff-warn {
-			@include daff-button-theme-variant(
-				daff-color($daff-bronze, 60),
-				daff-color($daff-bronze, 70),
-				daff-color($daff-bronze, 80)
-			);
-		}
-
-		&.daff-success {
-			@include daff-button-theme-variant(
-				daff-color($daff-green, 60),
-				daff-color($daff-green, 70),
-				daff-color($daff-green, 80)
-			);
-		}
-
-		&.daff-danger {
-			@include daff-button-theme-variant(
-				daff-color($daff-red, 60),
-				daff-color($daff-red, 70),
-				daff-color($daff-red, 80)
-			);
-		}
-	}
-
-	.daff-raised-button {
-		@include daff-raised-button-theme-variant(
-			daff-illuminate($base, $daff-gray, 2),
-			daff-illuminate($base, $daff-gray, 3),
-			daff-color($gray)
-		);
-
-		&.daff-primary {
-			@include daff-raised-button-theme-variant(
-				daff-color($primary),
-				daff-color($primary, 70),
-				daff-color($primary)
-			);
-		}
-
-		&.daff-secondary {
-			@include daff-raised-button-theme-variant(
-				daff-color($secondary),
-				daff-color($secondary, 70),
-				daff-color($secondary)
-			);
-		}
-
-		&.daff-tertiary {
-			@include daff-raised-button-theme-variant(
-				daff-color($tertiary),
-				daff-color($tertiary, 70),
-				daff-color($tertiary)
-			);
-		}
-
-		&.daff-black {
-			@include daff-raised-button-theme-variant(
-				$black,
-				daff-color($gray, 100),
-				daff-color($gray)
-			);
-		}
-
-		&.daff-white {
-			@include daff-raised-button-theme-variant(
-				$white,
-				daff-color($gray, 10),
-				daff-color($gray)
-			);
-		}
-
-		&.daff-theme {
-			@include daff-raised-button-theme-variant(
-				$base,
-				daff-illuminate($base, $daff-gray, 1),
-				$base
-			);
-		}
-
-		&.daff-theme-contrast {
-			@include daff-raised-button-theme-variant(
-				$base-contrast,
-				daff-illuminate($base-contrast, $daff-gray, 1),
-				$base-contrast
-			);
-		}
-
-		&[disabled] {
-			@include daff-raised-button-theme-variant(
-				daff-illuminate($base, $daff-gray, 3),
-				daff-illuminate($base, $daff-gray, 3),
-				daff-illuminate($base, $daff-gray, 6),
-			);
-			color: daff-illuminate($base, $daff-gray, 5);
-
-			&:hover {
-				box-shadow: 0 3px 5px rgba($black, 0.12), 0 1px 3px rgba($black, 0.08);
-				color: daff-illuminate($base, $daff-gray, 5),;
-			}
-		}
-
-		&.daff-warn {
-			@include daff-raised-button-theme-variant(
-				daff-color($daff-bronze, 60),
-				daff-color($daff-bronze, 70),
-				daff-color($daff-bronze, 60)
-			);
-		}
-
-		&.daff-danger {
-			@include daff-raised-button-theme-variant(
-				daff-color($daff-red, 60),
-				daff-color($daff-red, 70),
-				daff-color($daff-red, 60)
-			);
-		}
-
-		&.daff-success {
-			@include daff-raised-button-theme-variant(
-				daff-color($daff-green, 60),
-				daff-color($daff-green, 70),
-				daff-color($daff-green, 60)
-			);
-		}
-	}
-
-	.daff-icon-button {
-		@include daff-icon-button-theme-variant(
-			daff-illuminate($base, $daff-gray, 5),
-			daff-illuminate($base, $daff-gray, 6),
-			daff-illuminate($base, $daff-gray, 7)
-		);
-
-		&.daff-primary {
-			@include daff-icon-button-theme-variant(
-				daff-color($primary),
-				daff-color($primary, 70),
-				daff-color($primary, 80)
-			);
-		}
-
-		&.daff-secondary {
-			@include daff-icon-button-theme-variant(
-				daff-color($secondary),
-				daff-color($secondary, 70),
-				daff-color($secondary, 80)
-			);
-		}
-
-		&.daff-tertiary {
-			@include daff-icon-button-theme-variant(
-				daff-color($tertiary),
-				daff-color($tertiary, 70),
-				daff-color($tertiary, 80)
-			);
-		}
-
-		&.daff-black {
-			@include daff-icon-button-theme-variant(
-				$black,
-				daff-color($daff-gray, 100),
-				daff-color($daff-gray, 80)
-			);
-		}
-
-		&.daff-white {
-			@include daff-icon-button-theme-variant(
-				$white,
-				daff-color($daff-gray, 20),
-				daff-color($daff-gray, 30)
-			);
-		}
-
-		&.daff-theme {
-			@include daff-icon-button-theme-variant(
-				$base,
-				daff-illuminate($base, $daff-gray, 1),
-				daff-illuminate($base, $daff-gray, 2)
-			);
-		}
-
-		&.daff-theme-contrast {
-			@include daff-icon-button-theme-variant(
-				$base-contrast,
-				daff-illuminate($base-contrast, $daff-gray, 1),
-				daff-illuminate($base-contrast, $daff-gray, 2)
-			);
-		}
-
-		&[disabled] {
-			@include daff-icon-button-theme-variant(
-				daff-illuminate($base, $daff-gray, 4),
-				daff-illuminate($base, $daff-gray, 4),
-				daff-illuminate($base, $daff-gray, 4)
-			);
-
-			&:hover {
-				color: daff-illuminate($base, $daff-gray, 4);
-			}
-		}
-
-		&.daff-warn {
-			@include daff-icon-button-theme-variant(
-				daff-color($daff-bronze, 60),
-				daff-color($daff-bronze, 70),
-				daff-color($daff-bronze, 80)
-			);
-		}
-
-		&.daff-danger {
-			@include daff-icon-button-theme-variant(
-				daff-color($daff-red, 60),
-				daff-color($daff-red, 70),
-				daff-color($daff-red, 80)
-			);
-		}
-
-		&.daff-success {
-			@include daff-icon-button-theme-variant(
-				daff-color($daff-green, 60),
-				daff-color($daff-green, 70),
-				daff-color($daff-green, 80)
-			);
-		}
-	}
-
-	.daff-stroked-button {
-		background-color: transparent;
-		border: 1px solid daff-illuminate($base, $daff-gray, 5);
-		color: daff-text-contrast($base);
-
-		&:hover,
-		&:focus {
-			background-color: daff-illuminate($base, $daff-gray, 2);
-			border: 1px solid daff-illuminate($base, $daff-gray, 2);
-			color: daff-text-contrast(daff-illuminate($base, $daff-gray, 2));
-		}
-
-		&:active {
-			background-color: daff-illuminate($base, $daff-gray, 3);
-			border: 1px solid daff-illuminate($base, $daff-gray, 3);
-			color: daff-text-contrast(daff-illuminate($base, $daff-gray, 3));
-		}
-
-		&.daff-primary {
-			@include daff-stroked-button-theme-variant(
-				daff-color($primary),
-				daff-color($primary),
-				daff-color($primary, 70)
-			);
-		}
-
-		&.daff-secondary {
-			@include daff-stroked-button-theme-variant(
-				daff-color($secondary),
-				daff-color($secondary),
-				daff-color($secondary, 70)
-			);
-		}
-
-		&.daff-tertiary {
-			@include daff-stroked-button-theme-variant(
-				daff-color($tertiary),
-				daff-color($tertiary),
-				daff-color($tertiary, 70)
-			);
-		}
-
-		&.daff-black {
-			@include daff-stroked-button-theme-variant(
-				$black,
-				$black,
-				daff-color($daff-gray, 100)
-			);
-		}
-
-		&.daff-white {
-			@include daff-stroked-button-theme-variant(
-				$white,
-				$white,
-				daff-color($daff-gray, 20)
-			);
-		}
-
-		&.daff-theme {
-			@include daff-stroked-button-theme-variant(
-				$base,
-				$base,
-				daff-illuminate($base, $daff-gray, 2)
-			);
-		}
-
-		&.daff-theme-contrast {
-			@include daff-stroked-button-theme-variant(
-				$base-contrast,
-				$base-contrast,
-				daff-illuminate($base-contrast, $daff-gray, 2)
-			);
-		}
-
-		&[disabled] {
-			@include daff-stroked-button-theme-variant(
-				daff-illuminate($base, $daff-gray, 3),
-				daff-illuminate($base, $daff-gray, 5),
-				transparent
-			);
-
-			&:hover {
-				background-color: transparent;
-				color: daff-illuminate($base, $daff-gray, 5);
-			}
-		}
-
-		&.daff-warn {
-			@include daff-stroked-button-theme-variant(
-				daff-color($daff-bronze, 60),
-				daff-color($daff-bronze, 60),
-				daff-color($daff-bronze, 70)
-			);
-		}
-
-		&.daff-danger {
-			@include daff-stroked-button-theme-variant(
-				daff-color($daff-red, 60),
-				daff-color($daff-red, 60),
-				daff-color($daff-red, 70)
-			);
-		}
-
-		&.daff-success {
-			@include daff-stroked-button-theme-variant(
-				daff-color($daff-green, 60),
-				daff-color($daff-green, 60),
-				daff-color($daff-green, 70)
-			);
-		}
-	}
-
-	.daff-underline-button {
-		@include daff-underline-button-theme-variant(daff-illuminate($base, $daff-gray, 7));
-
-		&.daff-primary {
-			@include daff-underline-button-theme-variant(daff-color($primary));
-		}
-
-		&.daff-secondary {
-			@include daff-underline-button-theme-variant(daff-color($secondary));
-		}
-
-		&.daff-tertiary {
-			@include daff-underline-button-theme-variant(daff-color($tertiary));
-		}
-
-		&.daff-black {
-			@include daff-underline-button-theme-variant($black);
-		}
-
-		&.daff-white {
-			@include daff-underline-button-theme-variant($white);
-		}
-
-		&.daff-theme {
-			@include daff-underline-button-theme-variant($base);
-		}
-
-		&.daff-theme-contrast {
-			@include daff-underline-button-theme-variant($base-contrast);
-		}
-
-		&[disabled] {
-			@include daff-underline-button-theme-variant(daff-illuminate($base, $daff-gray, 4));
-		}
-
-		&.daff-warn {
-			@include daff-underline-button-theme-variant(daff-color($daff-bronze, 60));
-		}
-
-		&.daff-danger {
-			@include daff-underline-button-theme-variant(daff-color($daff-red, 60));
-		}
-
-		&.daff-success {
-			@include daff-underline-button-theme-variant(daff-color($daff-green, 60));
-		}
-	}
-
-	.daff-button,
-	.daff-stroked-button,
-	.daff-underline-button,
-	.daff-icon-button {
-		@include daff-button-focus-theme-variant(daff-color($gray));
-
-		&.daff-primary {
-			@include daff-button-focus-theme-variant(daff-color($primary));
-		}
-
-		&.daff-secondary {
-			@include daff-button-focus-theme-variant(daff-color($secondary));
-		}
-
-		&.daff-tertiary {
-			@include daff-button-focus-theme-variant(daff-color($tertiary));
-		}
-
-		&.daff-black {
-			@include daff-button-focus-theme-variant(daff-color($gray));
-		}
-
-		&.daff-white {
-			@include daff-button-focus-theme-variant(daff-color($gray));
-		}
-
-		&.daff-theme {
-			@include daff-button-focus-theme-variant($base);
-		}
-
-		&.daff-theme-contrast {
-			@include daff-button-focus-theme-variant(daff-color($gray));
-		}
-
-		&.daff-warn {
-			@include daff-button-focus-theme-variant(daff-color($daff-bronze, 60));
-		}
-
-		&.daff-danger {
-			@include daff-button-focus-theme-variant(daff-color($daff-red, 60));
-		}
-
-		&.daff-success {
-			@include daff-button-focus-theme-variant(daff-color($daff-green, 60));
-		}
-	}
-}
-
-@mixin daff-error-message-theme($theme) {
-	.daff-error-message {
-		color: $error;
-	}
-}
-
-@mixin daff-form-field-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-
-	.daff-form-field {
-		&__control {
-			background: $base;
-			border: 1px solid daff-illuminate($base, $daff-gray, 3);
-			color: daff-illuminate($base-contrast, $daff-gray, 4);
-
-			&:focus {
-				border: 1px solid $base-contrast;
-			}
-
-			&.daff-error {
-				border: 1px solid $error;
-
-				&:focus {
-					border: 1px solid $error;
-				}
-			}
-
-			&.daff-valid {
-				> * {
-					color: $base-contrast;
-				}
-			}
-		}
-	}
-}
-
-@mixin daff-input-theme($theme) {
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-
-	:host {
-		background: $base;
-		color: $base-contrast;
-
-		&::placeholder {
-			color: transparent;
-		}
-	}
-}
-
-@mixin daff-select-theme($theme) {
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-	$black: daff-map-deep-get($theme, 'core.black');
-
-	.daff-native-select {
-		color: daff-illuminate($base-contrast, $daff-gray, 4);
-
-		// removes dotted border on in FF
-		&:-moz-focusring {
-			color: transparent;
-			text-shadow: 0 0 0 $black;
-		}
-	}
-}
-
-@mixin daff-progress-indicator-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-	$white: daff-map-deep-get($theme, 'core.white');
-	$black: daff-map-deep-get($theme, 'core.black');
-
-	.daff-progress-indicator {
-		$root: &;
-		background: rgba($base-contrast, 0.1);
-
-		&.daff-primary {
-			#{$root}__fill {
-				background: daff-color($primary);
-			}
-		}
-
-		&.daff-secondary {
-			#{$root}__fill {
-				background: daff-color($secondary);
-			}
-		}
-
-		&.daff-tertiary {
-			#{$root}__fill {
-				background: daff-color($tertiary);
-			}
-		}
-
-		&.daff-theme {
-			#{$root}__fill {
-				background: $base;
-			}
-		}
-
-		&.daff-theme-contrast {
-			#{$root}__fill {
-				background: $base-contrast;
-			}
-		}
-
-		&.daff-black {
-			#{$root}__fill {
-				background: $black;
-			}
-		}
-
-		&.daff-white {
-			#{$root}__fill {
-				background: $white;
-			}
-		}
-	}
-}
-
-@mixin daff-loading-icon-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-	$white: daff-map-deep-get($theme, 'core.white');
-	$black: daff-map-deep-get($theme, 'core.black');
-
-	.daff-loading-icon {
-		&.daff-primary {
-			circle {
-				stroke: daff-color($primary);
-			}
-		}
-
-		&.daff-secondary {
-			circle {
-				stroke: daff-color($secondary);
-			}
-		}
-
-		&.daff-tertiary {
-			circle {
-				stroke: daff-color($tertiary);
-			}
-		}
-
-		&.daff-theme {
-			circle {
-				stroke: $base;
-			}
-		}
-
-		&.daff-theme-contrast {
-			circle {
-				stroke: $base-contrast;
-			}
-		}
-
-		&.daff-black {
-			circle {
-				stroke: $black;
-			}
-		}
-
-		&.daff-white {
-			circle {
-				stroke: $white;
-			}
-		}
-	}
-}
-
-
-@mixin daff-accordion-item-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-	$white: daff-map-deep-get($theme, 'core.white');
-	$black: daff-map-deep-get($theme, 'core.black');
-
-	.daff-accordion-item {
-		border-bottom: 1px solid daff-illuminate($base, $daff-gray, 2);
-	}
-}
-
-@mixin stopsArticleCascade($selector...) {
-	#{$selector} {
-		&:not(.daff-ae *, .daff-ae) {
-			@content;
-		}
-	}
-}
-
-
-@mixin daff-article-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-	$white: daff-map-deep-get($theme, 'core.white');
-	$black: daff-map-deep-get($theme, 'core.black');
-	$gray: daff-configure-palette($daff-gray, 60);
-
-	$text-color: daff-illuminate($base-contrast, $gray, 2);
-	$table-border-color: daff-illuminate($base, $gray, 2);
-
-	.daff-article {
-		&__meta {
-			color: daff-illuminate($base-contrast, $gray, 3);
-		}
-
-		@include stopsArticleCascade(a) {
-			color: daff-color($primary);
-		}
-
-		@include stopsArticleCascade(h1, h2, h3, h4, h5, h6) {
-			color: $text-color;
-		}
-
-		@include stopsArticleCascade(p) {
-			color: $text-color;
-		}
-
-		pre {
-			background: rgba(daff-illuminate($base, $daff-gray, 2), 0.3);
-			border: 1px solid rgba(daff-illuminate($base, $daff-gray, 2), 0.6);
-			color: $base-contrast;
-
-			code {
-				background: none;
-				border: none;
-			}
-		}
-
-		code {
-			background: rgba(daff-illuminate($base, $daff-gray, 2), 0.5);
-			color: $base-contrast;
-		}
-
-		hr {
-			background: daff-illuminate($base, $gray, 2);
-		}
-
-		blockquote {
-			background: rgba(daff-color($primary), 0.1);
-			border-left: 4px solid daff-illuminate($base, $primary, 5);
-			color: $base-contrast;
-
-			code {
-				background: rgba(daff-color($primary), 0.15);
-				color: $base-contrast;
-			}
-		}
-
-		table {
-			th {
-				background: daff-illuminate($base, $gray, 1);
-				border: 1px solid $table-border-color;
-			}
-
-			td {
-				border: 1px solid $table-border-color;
-			}
-		}
-	}
-}
-
-@mixin daff-callout-theme-variant($color) {
-	background: $color;
-	color: daff-text-contrast($color);
-}
-
-@mixin daff-callout-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-	$white: daff-map-deep-get($theme, 'core.white');
-	$black: daff-map-deep-get($theme, 'core.black');
-
-	.daff-callout {
-		@include daff-callout-theme-variant(daff-illuminate($base, $daff-gray, 1));
-
-		&.daff-primary {
-			@include daff-callout-theme-variant(daff-color($primary));
-		}
-
-		&.daff-secondary {
-			@include daff-callout-theme-variant(daff-color($secondary));
-		}
-
-		&.daff-tertiary {
-			@include daff-callout-theme-variant(daff-color($tertiary));
-		}
-
-		&.daff-theme {
-			@include daff-callout-theme-variant($base);
-		}
-
-		&.daff-theme-contrast {
-			@include daff-callout-theme-variant($base-contrast);
-		}
-
-		&.daff-black {
-			@include daff-callout-theme-variant($black);
-		}
-
-		&.daff-white {
-			@include daff-callout-theme-variant($white);
-		}
-	}
-}
-
-@mixin daff-basic-card-theme-variant($color) {
-	background: $color;
-	color: daff-text-contrast($color);
-}
-
-@mixin daff-linkable-basic-card-theme-variant(
-	$hover-color,
-	$active-color,
-	$shadow-color
-) {
-	&:hover,
-	&:focus {
-		background: $hover-color;
-		color: daff-text-contrast($hover-color);
-	}
-
-	&:focus {
-		outline: none;
-		box-shadow: 0 0 0 4px rgba($shadow-color, 0.3);
-	}
-
-	&:active {
-		background: $active-color;
-		color: daff-text-contrast($active-color);
-	}
-}
-
-@mixin daff-stroked-card-theme-variant($color) {
-	border: 1px solid $color;
-}
-
-
-@mixin daff-card-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-	$white: daff-map-deep-get($theme, 'core.white');
-	$black: daff-map-deep-get($theme, 'core.black');
-	$gray: daff-configure-palette($daff-gray, 60);
-
-	.daff-card {
-		$root: &;
-		@include daff-basic-card-theme-variant(
-			daff-illuminate($base, $daff-gray, 1)
-		);
-
-		&.daff-primary {
-			@include daff-basic-card-theme-variant(daff-color($primary));
-		}
-
-		&.daff-secondary {
-			@include daff-basic-card-theme-variant(daff-color($secondary));
-		}
-
-		&.daff-tertiary {
-			@include daff-basic-card-theme-variant(daff-color($tertiary));
-		}
-
-		&.daff-theme {
-			@include daff-basic-card-theme-variant($base);
-		}
-
-		&.daff-theme-contrast {
-			@include daff-basic-card-theme-variant($base-contrast);
-		}
-
-		&.daff-black {
-			@include daff-basic-card-theme-variant($black);
-		}
-
-		&.daff-white {
-			@include daff-basic-card-theme-variant($white);
-		}
-	}
-
-	.daff-raised-card {
-		box-shadow: 0 6px 12px -4px rgba($black, 0.12),
-			0 4px 8px -2px rgba($black, 0.06);
-	}
-
-	.daff-stroked-card {
-		@include daff-stroked-card-theme-variant(
-			daff-illuminate($base, $daff-gray, 2)
-		);
-
-		&.daff-primary {
-			@include daff-stroked-card-theme-variant(
-				daff-illuminate($base-contrast, $primary, 3)
-			);
-		}
-
-		&.daff-secondary {
-			@include daff-stroked-card-theme-variant(
-				daff-illuminate($base-contrast, $secondary, 3)
-			);
-		}
-
-		&.daff-tertiary {
-			@include daff-stroked-card-theme-variant(
-				daff-illuminate($base-contrast, $tertiary, 3)
-			);
-		}
-
-		&.daff-theme {
-			@include daff-stroked-card-theme-variant(
-				daff-illuminate($base, $daff-gray, 2)
-			);
-		}
-
-		&.daff-theme-contrast {
-			@include daff-stroked-card-theme-variant(
-				daff-illuminate($base-contrast, $daff-gray, 2)
-			);
-		}
-
-		&.daff-black {
-			@include daff-stroked-card-theme-variant(daff-color($gray, 90));
-		}
-
-		&.daff-white {
-			@include daff-stroked-card-theme-variant(daff-color($gray, 20));
-		}
-	}
-
-	a {
-		&.daff-card {
-			@include daff-linkable-basic-card-theme-variant(
-				daff-illuminate($base, $daff-gray, 2),
-				daff-illuminate($base, $daff-gray, 3),
-				daff-color($gray)
-			);
-
-			&.daff-primary {
-				@include daff-linkable-basic-card-theme-variant(
-					daff-color($primary, 70),
-					daff-color($primary, 80),
-					daff-color($primary)
-				);
-			}
-
-			&.daff-secondary {
-				@include daff-linkable-basic-card-theme-variant(
-					daff-color($secondary, 70),
-					daff-color($secondary, 80),
-					daff-color($secondary)
-				);
-			}
-
-			&.daff-tertiary {
-				@include daff-linkable-basic-card-theme-variant(
-					daff-color($tertiary, 70),
-					daff-color($tertiary, 80),
-					daff-color($tertiary)
-				);
-			}
-
-			&.daff-theme {
-				@include daff-linkable-basic-card-theme-variant(
-					daff-illuminate($base, $daff-gray, 1),
-					daff-illuminate($base, $daff-gray, 2),
-					daff-color($gray)
-				);
-			}
-
-			&.daff-theme-contrast {
-				@include daff-linkable-basic-card-theme-variant(
-					daff-illuminate($base-contrast, $daff-gray, 1),
-					daff-illuminate($base-contrast, $daff-gray, 2),
-					daff-color($gray)
-				);
-			}
-
-			&.daff-black {
-				@include daff-linkable-basic-card-theme-variant(
-					daff-color($gray, 100),
-					daff-color($gray, 90),
-					daff-color($gray)
-				);
-			}
-
-			&.daff-white {
-				@include daff-linkable-basic-card-theme-variant(
-					daff-color($gray, 10),
-					daff-color($gray, 20),
-					daff-color($gray)
-				);
-			}
-		}
-
-		&.daff-raised-card {
-			&:hover,
-			&:focus,
-			&:active {
-				box-shadow: 0 16px 32px -4px rgba($black, 0.12),
-					0 8px 12px -2px rgba($black, 0.06);
-			}
-		}
-	}
-}
-
-@mixin daff-hero-theme-variant($color) {
-	background: $color;
-	color: daff-text-contrast($color);
-}
-
-@mixin daff-hero-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-	$white: daff-map-deep-get($theme, 'core.white');
-	$black: daff-map-deep-get($theme, 'core.black');
-
-	.daff-hero {
-		@include daff-hero-theme-variant(daff-illuminate($base, $daff-gray, 1));
-
-		&.daff-primary {
-			@include daff-hero-theme-variant(daff-color($primary));
-		}
-
-		&.daff-secondary {
-			@include daff-hero-theme-variant(daff-color($secondary));
-		}
-
-		&.daff-tertiary {
-			@include daff-hero-theme-variant(daff-color($tertiary));
-		}
-
-		&.daff-theme {
-			@include daff-hero-theme-variant($base);
-		}
-
-		&.daff-theme-contrast {
-			@include daff-hero-theme-variant($base-contrast);
-		}
-
-		&.daff-black {
-			@include daff-hero-theme-variant($black);
-		}
-
-		&.daff-white {
-			@include daff-hero-theme-variant($white);
-		}
-	}
-}
-
-@mixin daff-list-theme($theme) {
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-
-	.daff-list {
-		.daff-list-item {
-			&__content {
-				*:nth-child(1) { /* stylelint-disable-line scss/selector-nest-combinators */
-					color: $base-contrast;
-				}
-
-				*:nth-child(n + 2) { /* stylelint-disable-line scss/selector-nest-combinators */
-					color: daff-illuminate($base-contrast, $daff-gray, 3);
-				}
-			}
-		}
-
-		// deprecated in v1.0.0
-		&--navigation {
-			.daff-list-item {
-				&:hover {
-					background-color: daff-illuminate($base, $daff-gray, 1);
-				}
-			}
-		}
-
-		// deprecated in v1.0.0
-		&--multi-line {
-			.daff-list-item {
-				&__content {
-					*:nth-child(1) { /* stylelint-disable-line scss/selector-nest-combinators */
-						color: $base-contrast;
-					}
-
-					*:nth-child(n + 2) { /* stylelint-disable-line scss/selector-nest-combinators */
-						color: daff-illuminate($base-contrast, $daff-gray, 3);
-					}
-				}
-			}
-		}
-	}
-
-	.daff-nav-list {
-		.daff-list-item {
-			background-color: $base;
-			transition: background-color 150ms;
-
-			&:hover {
-				background-color: daff-illuminate($base, $daff-gray, 1);
-			}
-		}
-	}
-}
-
-@mixin daff-media-gallery-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$white: daff-map-deep-get($theme, 'core.white');
-	$black: daff-map-deep-get($theme, 'core.black');
-	$gray: daff-configure-palette($daff-gray, 60);
-
-	.daff-media-gallery {
-		$root: &;
-
-		.daff-thumbnail {
-			border: 1px solid transparent;
-			transition: border 150ms;
-
-			&--selected {
-				border: 1px solid daff-color($gray);
-			}
-		}
-	}
-}
-
-@mixin daff-modal-theme($theme) {
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-
-	.daff-modal {
-		background: $base;
-	}
-}
-
-@mixin daff-navbar-theme-variant($color) {
-	background: $color;
-	color: daff-text-contrast($color);
-}
-
-@mixin daff-navbar-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-	$white: daff-map-deep-get($theme, 'core.white');
-	$black: daff-map-deep-get($theme, 'core.black');
-	$gray: daff-configure-palette($daff-gray, 60);
-
-	.daff-navbar {
-		@include daff-navbar-theme-variant(daff-illuminate($base, $daff-gray, 1));
-
-		&--raised {
-			box-shadow: 0 4px 10px rgba($black, 0.08);
-		}
-
-		&.daff-primary {
-			@include daff-navbar-theme-variant(daff-color($primary));
-		}
-
-		&.daff-secondary {
-			@include daff-navbar-theme-variant(daff-color($secondary));
-		}
-
-		&.daff-tertiary {
-			@include daff-navbar-theme-variant(daff-color($tertiary));
-		}
-
-		&.daff-black {
-			@include daff-navbar-theme-variant($black);
-		}
-
-		&.daff-white {
-			@include daff-navbar-theme-variant($white);
-		}
-
-		&.daff-theme {
-			@include daff-navbar-theme-variant($base);
-		}
-
-		&.daff-theme-contrast {
-			@include daff-navbar-theme-variant($base-contrast);
-		}
-	}
-}
-
-@mixin daff-paginator-theme-variant($active-color) {
-	color: currentColor;
-
-	&:hover,
-	&.selected { /* stylelint-disable-line selector-class-pattern */
-		background: $active-color;
-		color: daff-text-contrast($active-color);
-	}
-}
-
-@mixin daff-paginator-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$base-contrast: daff-map-deep-get($theme, 'core.base-contrast');
-	$white: daff-map-deep-get($theme, 'core.white');
-	$black: daff-map-deep-get($theme, 'core.black');
-
-	.daff-paginator {
-		&__previous,
-		&__next {
-			color: currentColor;
-		}
-
-		&.daff-primary {
-			.daff-paginator__page-link {
-				@include daff-paginator-theme-variant(daff-color($primary));
-			}
-		}
-
-		&.daff-secondary {
-			.daff-paginator__page-link {
-				@include daff-paginator-theme-variant(daff-color($secondary));
-			}
-		}
-
-		&.daff-tertiary {
-			.daff-paginator__page-link {
-				@include daff-paginator-theme-variant(daff-color($tertiary));
-			}
-		}
-
-		&.daff-theme {
-			.daff-paginator__page-link {
-				@include daff-paginator-theme-variant($base);
-			}
-		}
-
-		&.daff-theme-contrast {
-			.daff-paginator__page-link {
-				@include daff-paginator-theme-variant($base-contrast);
-			}
-		}
-
-		&.daff-black {
-			.daff-paginator__page-link {
-				@include daff-paginator-theme-variant($black);
-			}
-		}
-
-		&.daff-white {
-			.daff-paginator__page-link {
-				@include daff-paginator-theme-variant($white);
-			}
-		}
-	}
-}
-
-@mixin daff-sidebar-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$font-color: daff-map-deep-get($theme, 'core.font-color');
-	$shadow-color: rgba(128, 128, 128, 0.1);
-
-	.daff-sidebar {
-		background: $base;
-		box-shadow: 6px 1px 9px 0 $shadow-color;
-		color: $font-color;
-	}
-}
-
-@mixin daff-sidebar-viewport-theme($theme) {
-	$primary: map-get($theme, primary);
-	$secondary: map-get($theme, secondary);
-	$tertiary: map-get($theme, tertiary);
-	$base: daff-map-deep-get($theme, 'core.base');
-	$font-color: daff-map-deep-get($theme, 'core.font-color');
-
-	.daff-sidebar-viewport {
-		background: $base;
-		color: $font-color;
-	}
-}
-
-
-//
-// Generates the styles of a @daffodil/design theme.
-//
-// Usage:
-// ```
-// @include daff-theme($theme);
-// ```
-@mixin daff-theme($theme) {
-	// CSS variables
-	@include daff-theme-css-variables($theme);
-
-	// Atoms
-	@include daff-button-theme($theme);
-	@include daff-error-message-theme($theme);
-	@include daff-form-field-theme($theme);
-	@include daff-input-theme($theme);
-	@include daff-select-theme($theme);
-	@include daff-progress-indicator-theme($theme);
-	@include daff-loading-icon-theme($theme);
-
-	// Molecules
-	@include daff-accordion-item-theme($theme);
-	@include daff-article-theme($theme);
-	@include daff-callout-theme($theme);
-	@include daff-card-theme($theme);
-	@include daff-hero-theme($theme);
-	@include daff-list-theme($theme);
-	@include daff-media-gallery-theme($theme);
-	@include daff-modal-theme($theme);
-	@include daff-navbar-theme($theme);
-	@include daff-paginator-theme($theme);
-	@include daff-sidebar-theme($theme);
-	@include daff-sidebar-viewport-theme($theme);
-}
-