@justeattakeaway/pie-css 0.23.0 → 0.23.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/index.css +35 -19
  2. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -1,12 +1,14 @@
1
1
  :root {
2
2
  /* Global tokens - Color */
3
3
  --dt-color-aubergine-10: #e3cfe3;
4
+ --dt-color-aubergine-100: #241e24;
4
5
  --dt-color-aubergine-20: #d0b2d0;
5
6
  --dt-color-aubergine-30: #b993b8;
6
7
  --dt-color-aubergine-5: #f3e7f3;
7
8
  --dt-color-aubergine-70: #5b3d5b;
8
9
  --dt-color-aubergine-75: #493949;
9
10
  --dt-color-aubergine-80: #3c313c;
11
+ --dt-color-aubergine-90: #322932;
10
12
  --dt-color-berry-10: #fbdfe3;
11
13
  --dt-color-berry-20: #f9d2d7;
12
14
  --dt-color-berry-40: #f2a6b0;
@@ -132,7 +134,7 @@
132
134
  --dt-color-white: #fff;
133
135
  --dt-color-yellow: #ffd600;
134
136
  --dt-color-yellow-10: #fff8d6;
135
- --dt-color-yellow-30: #ffeb80;
137
+ --dt-color-yellow-30: #ffee94;
136
138
  --dt-color-yellow-40: #ffde33;
137
139
  --dt-color-yellow-75: #a38900;
138
140
  --dt-color-yellow-80: #6b5a00;
@@ -393,6 +395,14 @@
393
395
  --dt-font-heading-xxl-weight: var(--dt-font-weight-extrabold);
394
396
  --dt-font-heading-xxl-line-height--wide: var(--dt-font-size-48-line-height);
395
397
  --dt-font-heading-xxl-line-height--narrow: var(--dt-font-size-32-line-height);
398
+ /* Heading-xs-italic font theme */
399
+ --dt-font-heading-xs-italic-size--wide: var(--dt-font-size-16);
400
+ --dt-font-heading-xs-italic-size--narrow: var(--dt-font-size-14);
401
+ --dt-font-heading-xs-italic-family: var(--dt-font-family-alternative);
402
+ --dt-font-heading-xs-italic-weight: var(--dt-font-weight-extrabold);
403
+ --dt-font-heading-xs-italic-font-style: var(--dt-font-style-italic);
404
+ --dt-font-heading-xs-italic-line-height--wide: var(--dt-font-size-16-line-height);
405
+ --dt-font-heading-xs-italic-line-height--narrow: var(--dt-font-size-14-line-height);
396
406
  /* Heading-s-italic font theme */
397
407
  --dt-font-heading-s-italic-size--wide: var(--dt-font-size-20);
398
408
  --dt-font-heading-s-italic-size--narrow: var(--dt-font-size-16);
@@ -728,8 +738,8 @@ html[data-color-mode="dark"] {
728
738
  --dt-color-support-brand-05-subtle: var(--dt-color-turmeric-80);
729
739
  --dt-color-support-brand-05-tonal: var(--dt-color-turmeric-90);
730
740
  --dt-color-support-brand-06: var(--dt-color-aubergine-70);
731
- --dt-color-support-brand-06-subtle: var(--dt-color-aubergine-75);
732
- --dt-color-support-brand-06-tonal: var(--dt-color-aubergine-80);
741
+ --dt-color-support-brand-06-subtle: var(--dt-color-aubergine-90);
742
+ --dt-color-support-brand-06-tonal: var(--dt-color-aubergine-100);
733
743
  --dt-color-support-brand-07: var(--dt-color-tomato-50);
734
744
  --dt-color-support-brand-07-subtle: var(--dt-color-tomato-90);
735
745
  --dt-color-support-brand-08: var(--dt-color-latte-30);
@@ -902,8 +912,8 @@ html[data-color-mode="dark"] {
902
912
  --dt-color-support-brand-05-subtle: var(--dt-color-turmeric-80);
903
913
  --dt-color-support-brand-05-tonal: var(--dt-color-turmeric-90);
904
914
  --dt-color-support-brand-06: var(--dt-color-aubergine-70);
905
- --dt-color-support-brand-06-subtle: var(--dt-color-aubergine-75);
906
- --dt-color-support-brand-06-tonal: var(--dt-color-aubergine-80);
915
+ --dt-color-support-brand-06-subtle: var(--dt-color-aubergine-90);
916
+ --dt-color-support-brand-06-tonal: var(--dt-color-aubergine-100);
907
917
  --dt-color-support-brand-07: var(--dt-color-tomato-50);
908
918
  --dt-color-support-brand-07-subtle: var(--dt-color-tomato-90);
909
919
  --dt-color-support-brand-08: var(--dt-color-latte-30);
@@ -1079,6 +1089,9 @@ html[data-color-mode="dark"] {
1079
1089
  --dt-color-aubergine-10-h: 300;
1080
1090
  --dt-color-aubergine-10-s: 26.3%;
1081
1091
  --dt-color-aubergine-10-l: 85.1%;
1092
+ --dt-color-aubergine-100-h: 300;
1093
+ --dt-color-aubergine-100-s: 9.1%;
1094
+ --dt-color-aubergine-100-l: 12.9%;
1082
1095
  --dt-color-aubergine-20-h: 300;
1083
1096
  --dt-color-aubergine-20-s: 24.2%;
1084
1097
  --dt-color-aubergine-20-l: 75.7%;
@@ -1097,6 +1110,9 @@ html[data-color-mode="dark"] {
1097
1110
  --dt-color-aubergine-80-h: 300;
1098
1111
  --dt-color-aubergine-80-s: 10.1%;
1099
1112
  --dt-color-aubergine-80-l: 21.4%;
1113
+ --dt-color-aubergine-90-h: 300;
1114
+ --dt-color-aubergine-90-s: 9.9%;
1115
+ --dt-color-aubergine-90-l: 17.8%;
1100
1116
  --dt-color-berry-10-h: 351;
1101
1117
  --dt-color-berry-10-s: 77.8%;
1102
1118
  --dt-color-berry-10-l: 92.9%;
@@ -1472,9 +1488,9 @@ html[data-color-mode="dark"] {
1472
1488
  --dt-color-yellow-10-h: 50;
1473
1489
  --dt-color-yellow-10-s: 100%;
1474
1490
  --dt-color-yellow-10-l: 92%;
1475
- --dt-color-yellow-30-h: 51;
1491
+ --dt-color-yellow-30-h: 50;
1476
1492
  --dt-color-yellow-30-s: 100%;
1477
- --dt-color-yellow-30-l: 75.1%;
1493
+ --dt-color-yellow-30-l: 79%;
1478
1494
  --dt-color-yellow-40-h: 50;
1479
1495
  --dt-color-yellow-40-s: 100%;
1480
1496
  --dt-color-yellow-40-l: 60%;
@@ -2056,12 +2072,12 @@ html[data-color-mode="dark"] {
2056
2072
  --dt-color-support-brand-06-h: var(--dt-color-aubergine-70-h);
2057
2073
  --dt-color-support-brand-06-s: var(--dt-color-aubergine-70-s);
2058
2074
  --dt-color-support-brand-06-l: var(--dt-color-aubergine-70-l);
2059
- --dt-color-support-brand-06-subtle-h: var(--dt-color-aubergine-75-h);
2060
- --dt-color-support-brand-06-subtle-s: var(--dt-color-aubergine-75-s);
2061
- --dt-color-support-brand-06-subtle-l: var(--dt-color-aubergine-75-l);
2062
- --dt-color-support-brand-06-tonal-h: var(--dt-color-aubergine-80-h);
2063
- --dt-color-support-brand-06-tonal-s: var(--dt-color-aubergine-80-s);
2064
- --dt-color-support-brand-06-tonal-l: var(--dt-color-aubergine-80-l);
2075
+ --dt-color-support-brand-06-subtle-h: var(--dt-color-aubergine-90-h);
2076
+ --dt-color-support-brand-06-subtle-s: var(--dt-color-aubergine-90-s);
2077
+ --dt-color-support-brand-06-subtle-l: var(--dt-color-aubergine-90-l);
2078
+ --dt-color-support-brand-06-tonal-h: var(--dt-color-aubergine-100-h);
2079
+ --dt-color-support-brand-06-tonal-s: var(--dt-color-aubergine-100-s);
2080
+ --dt-color-support-brand-06-tonal-l: var(--dt-color-aubergine-100-l);
2065
2081
  --dt-color-support-brand-07-h: var(--dt-color-tomato-50-h);
2066
2082
  --dt-color-support-brand-07-s: var(--dt-color-tomato-50-s);
2067
2083
  --dt-color-support-brand-07-l: var(--dt-color-tomato-50-l);
@@ -2452,12 +2468,12 @@ html[data-color-mode="dark"] {
2452
2468
  --dt-color-support-brand-06-h: var(--dt-color-aubergine-70-h);
2453
2469
  --dt-color-support-brand-06-s: var(--dt-color-aubergine-70-s);
2454
2470
  --dt-color-support-brand-06-l: var(--dt-color-aubergine-70-l);
2455
- --dt-color-support-brand-06-subtle-h: var(--dt-color-aubergine-75-h);
2456
- --dt-color-support-brand-06-subtle-s: var(--dt-color-aubergine-75-s);
2457
- --dt-color-support-brand-06-subtle-l: var(--dt-color-aubergine-75-l);
2458
- --dt-color-support-brand-06-tonal-h: var(--dt-color-aubergine-80-h);
2459
- --dt-color-support-brand-06-tonal-s: var(--dt-color-aubergine-80-s);
2460
- --dt-color-support-brand-06-tonal-l: var(--dt-color-aubergine-80-l);
2471
+ --dt-color-support-brand-06-subtle-h: var(--dt-color-aubergine-90-h);
2472
+ --dt-color-support-brand-06-subtle-s: var(--dt-color-aubergine-90-s);
2473
+ --dt-color-support-brand-06-subtle-l: var(--dt-color-aubergine-90-l);
2474
+ --dt-color-support-brand-06-tonal-h: var(--dt-color-aubergine-100-h);
2475
+ --dt-color-support-brand-06-tonal-s: var(--dt-color-aubergine-100-s);
2476
+ --dt-color-support-brand-06-tonal-l: var(--dt-color-aubergine-100-l);
2461
2477
  --dt-color-support-brand-07-h: var(--dt-color-tomato-50-h);
2462
2478
  --dt-color-support-brand-07-s: var(--dt-color-tomato-50-s);
2463
2479
  --dt-color-support-brand-07-l: var(--dt-color-tomato-50-l);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@justeattakeaway/pie-css",
3
- "version": "0.23.0",
3
+ "version": "0.23.2",
4
4
  "description": "A styling library that provides both a shared collection of ready to use CSS styles to be used across JET web front-ends, and SCSS-based style helpers for our PIE Web Component library.",
5
5
  "repository": {
6
6
  "type": "git",