@sage/design-tokens 2.36.0 → 2.38.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/android/base.xml CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  <!--
4
4
  Do not edit directly
5
- Generated on Thu, 23 Jun 2022 13:32:07 GMT
5
+ Generated on Tue, 28 Jun 2022 14:03:47 GMT
6
6
  -->
7
7
  <resources>
8
8
  <string name="metaName">Base Theme</string>
@@ -12,6 +12,7 @@
12
12
  <string name="colorsUtilityMajor200">#99adb7ff</string>
13
13
  <string name="colorsUtilityMajor300">#668494ff</string>
14
14
  <string name="colorsUtilityMajor400">#335b70ff</string>
15
+ <string name="colorsUtilityMajor450">#19475eff</string>
15
16
  <string name="colorsUtilityMajor500">#00324cff</string>
16
17
  <string name="colorsUtilityMajor800">#00141eff</string>
17
18
  <string name="colorsUtilityMajor025">#f2f5f6ff</string>
@@ -315,7 +316,7 @@
315
316
  <string name="typographyCardSelectTitleM">Bold 16px/150% Sage UI</string>
316
317
  <string name="typographyCardSelectSubtitleM">Medium 14px/150% Sage UI</string>
317
318
  <string name="typographyCardSelectParagraphM">Regular 14px/150% Sage UI</string>
318
- <string name="typographyDatePickerCalendarDateM">Bold 14px/150% Sage UI</string>
319
+ <string name="typographyDatePickerCalendarDateM">Medium 14px/150% Sage UI</string>
319
320
  <string name="typographyDatePickerCalendarDayM">Bold 14px/150% Sage UI</string>
320
321
  <string name="typographyDatePickerCalendarMonthM">Bold 16px/125% Sage UI</string>
321
322
  <string name="typographyDialogTitleXs">Bold 24px/125% Sage UI</string>
package/css/base.css CHANGED
@@ -4,7 +4,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
4
4
 
5
5
  /**
6
6
  * Do not edit directly
7
- * Generated on Thu, 23 Jun 2022 13:32:07 GMT
7
+ * Generated on Tue, 28 Jun 2022 14:03:47 GMT
8
8
  */
9
9
 
10
10
  :root {
@@ -15,6 +15,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
15
15
  --colorsUtilityMajor200: #99adb7ff;
16
16
  --colorsUtilityMajor300: #668494ff;
17
17
  --colorsUtilityMajor400: #335b70ff;
18
+ --colorsUtilityMajor450: #19475eff;
18
19
  --colorsUtilityMajor500: #00324cff;
19
20
  --colorsUtilityMajor800: #00141eff;
20
21
  --colorsUtilityMajor025: #f2f5f6ff;
@@ -318,7 +319,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
318
319
  --typographyCardSelectTitleM: 700 16px/150% Sage UI;
319
320
  --typographyCardSelectSubtitleM: 500 14px/150% Sage UI;
320
321
  --typographyCardSelectParagraphM: 400 14px/150% Sage UI;
321
- --typographyDatePickerCalendarDateM: 700 14px/150% Sage UI;
322
+ --typographyDatePickerCalendarDateM: 500 14px/150% Sage UI;
322
323
  --typographyDatePickerCalendarDayM: 700 14px/150% Sage UI;
323
324
  --typographyDatePickerCalendarMonthM: 700 16px/125% Sage UI;
324
325
  --typographyDialogTitleXs: 700 24px/125% Sage UI;
package/data/tokens.json CHANGED
@@ -38,6 +38,10 @@
38
38
  "type": "color",
39
39
  "description": "#335B70"
40
40
  },
41
+ "450": {
42
+ "value": "#19475eff",
43
+ "type": "color"
44
+ },
41
45
  "500": {
42
46
  "value": "#00324cff",
43
47
  "type": "color",
@@ -1779,7 +1783,7 @@
1779
1783
  "m": {
1780
1784
  "value": {
1781
1785
  "fontFamily": "Sage UI",
1782
- "fontWeight": "Bold",
1786
+ "fontWeight": "Medium",
1783
1787
  "lineHeight": "150%",
1784
1788
  "fontSize": "14px",
1785
1789
  "letterSpacing": "0%",
@@ -390,6 +390,27 @@
390
390
 
391
391
  </td>
392
392
  </tr>
393
+ <tr>
394
+ <td class="with-icons is-vcentered"
395
+ id="base-colorsUtilityMajor450"
396
+ title="theme: base; category: colors; group: utility; name: major; variant: 450; ">
397
+ colorsUtilityMajor450
398
+ <a href="#base-colorsUtilityMajor450"
399
+ title="permalink"
400
+ class="permalink">
401
+ 🔗
402
+ </a>
403
+ </td>
404
+ <td class="is-vcentered">
405
+ <pre>#19475eff</pre>
406
+ </td>
407
+ <td class="is-vcentered">
408
+ <div class="table__color-preview"
409
+ style="background-color: #19475eff;">
410
+ </div>
411
+
412
+ </td>
413
+ </tr>
393
414
  <tr>
394
415
  <td class="with-icons is-vcentered"
395
416
  id="base-colorsUtilityMajor500"
@@ -386,6 +386,27 @@
386
386
 
387
387
  </td>
388
388
  </tr>
389
+ <tr>
390
+ <td class="with-icons is-vcentered"
391
+ id="base-colorsUtilityMajor450"
392
+ title="theme: base; category: colors; group: utility; name: major; variant: 450; ">
393
+ colorsUtilityMajor450
394
+ <a href="#base-colorsUtilityMajor450"
395
+ title="permalink"
396
+ class="permalink">
397
+ 🔗
398
+ </a>
399
+ </td>
400
+ <td class="is-vcentered">
401
+ <pre>#19475eff</pre>
402
+ </td>
403
+ <td class="is-vcentered">
404
+ <div class="table__color-preview"
405
+ style="background-color: #19475eff;">
406
+ </div>
407
+
408
+ </td>
409
+ </tr>
389
410
  <tr>
390
411
  <td class="with-icons is-vcentered"
391
412
  id="base-colorsUtilityMajor500"
@@ -6944,7 +6965,7 @@
6944
6965
  </a>
6945
6966
  </td>
6946
6967
  <td class="is-vcentered">
6947
- <pre>700 14px/150% Sage UI</pre>
6968
+ <pre>500 14px/150% Sage UI</pre>
6948
6969
  </td>
6949
6970
  <td class="is-vcentered">
6950
6971
  <div class="table__typography-preview">
@@ -570,7 +570,7 @@
570
570
  </a>
571
571
  </td>
572
572
  <td class="is-vcentered">
573
- <pre>700 14px/150% Sage UI</pre>
573
+ <pre>500 14px/150% Sage UI</pre>
574
574
  </td>
575
575
  <td class="is-vcentered">
576
576
  <div class="table__typography-preview">
@@ -392,6 +392,27 @@
392
392
 
393
393
  </td>
394
394
  </tr>
395
+ <tr>
396
+ <td class="with-icons is-vcentered"
397
+ id="base-colorsUtilityMajor450"
398
+ title="theme: base; category: colors; group: utility; name: major; variant: 450; ">
399
+ colorsUtilityMajor450
400
+ <a href="#base-colorsUtilityMajor450"
401
+ title="permalink"
402
+ class="permalink">
403
+ 🔗
404
+ </a>
405
+ </td>
406
+ <td class="is-vcentered">
407
+ <pre>#19475eff</pre>
408
+ </td>
409
+ <td class="is-vcentered">
410
+ <div class="table__color-preview"
411
+ style="background-color: #19475eff;">
412
+ </div>
413
+
414
+ </td>
415
+ </tr>
395
416
  <tr>
396
417
  <td class="with-icons is-vcentered"
397
418
  id="base-colorsUtilityMajor500"
@@ -7000,7 +7021,7 @@
7000
7021
  </a>
7001
7022
  </td>
7002
7023
  <td class="is-vcentered">
7003
- <pre>700 14px/150% Sage UI</pre>
7024
+ <pre>500 14px/150% Sage UI</pre>
7004
7025
  </td>
7005
7026
  <td class="is-vcentered">
7006
7027
  <div class="table__typography-preview">
package/ios/base.h CHANGED
@@ -4,7 +4,7 @@
4
4
  //
5
5
 
6
6
  // Do not edit directly
7
- // Generated on Thu, 23 Jun 2022 13:32:07 GMT
7
+ // Generated on Tue, 28 Jun 2022 14:03:47 GMT
8
8
 
9
9
 
10
10
  #import <Foundation/Foundation.h>
@@ -17,6 +17,7 @@
17
17
  #define colorsUtilityMajor200 #99adb7ff
18
18
  #define colorsUtilityMajor300 #668494ff
19
19
  #define colorsUtilityMajor400 #335b70ff
20
+ #define colorsUtilityMajor450 #19475eff
20
21
  #define colorsUtilityMajor500 #00324cff
21
22
  #define colorsUtilityMajor800 #00141eff
22
23
  #define colorsUtilityMajor025 #f2f5f6ff
@@ -320,7 +321,7 @@
320
321
  #define typographyCardSelectTitleM Bold 16px/150% Sage UI
321
322
  #define typographyCardSelectSubtitleM Medium 14px/150% Sage UI
322
323
  #define typographyCardSelectParagraphM Regular 14px/150% Sage UI
323
- #define typographyDatePickerCalendarDateM Bold 14px/150% Sage UI
324
+ #define typographyDatePickerCalendarDateM Medium 14px/150% Sage UI
324
325
  #define typographyDatePickerCalendarDayM Bold 14px/150% Sage UI
325
326
  #define typographyDatePickerCalendarMonthM Bold 16px/125% Sage UI
326
327
  #define typographyDialogTitleXs Bold 24px/125% Sage UI
@@ -5,6 +5,7 @@ export const colorsUtilityMajor150: string;
5
5
  export const colorsUtilityMajor200: string;
6
6
  export const colorsUtilityMajor300: string;
7
7
  export const colorsUtilityMajor400: string;
8
+ export const colorsUtilityMajor450: string;
8
9
  export const colorsUtilityMajor500: string;
9
10
  export const colorsUtilityMajor800: string;
10
11
  export const colorsUtilityMajor025: string;
package/js/base/common.js CHANGED
@@ -4,7 +4,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
4
4
 
5
5
  /**
6
6
  * Do not edit directly
7
- * Generated on Thu, 23 Jun 2022 13:32:07 GMT
7
+ * Generated on Tue, 28 Jun 2022 14:03:47 GMT
8
8
  */
9
9
 
10
10
  module.exports = {
@@ -15,6 +15,7 @@ module.exports = {
15
15
  colorsUtilityMajor200: '#99adb7ff',
16
16
  colorsUtilityMajor300: '#668494ff',
17
17
  colorsUtilityMajor400: '#335b70ff',
18
+ colorsUtilityMajor450: '#19475eff',
18
19
  colorsUtilityMajor500: '#00324cff',
19
20
  colorsUtilityMajor800: '#00141eff',
20
21
  colorsUtilityMajor025: '#f2f5f6ff',
@@ -318,7 +319,7 @@ module.exports = {
318
319
  typographyCardSelectTitleM: '700 16px/150% Sage UI',
319
320
  typographyCardSelectSubtitleM: '500 14px/150% Sage UI',
320
321
  typographyCardSelectParagraphM: '400 14px/150% Sage UI',
321
- typographyDatePickerCalendarDateM: '700 14px/150% Sage UI',
322
+ typographyDatePickerCalendarDateM: '500 14px/150% Sage UI',
322
323
  typographyDatePickerCalendarDayM: '700 14px/150% Sage UI',
323
324
  typographyDatePickerCalendarMonthM: '700 16px/125% Sage UI',
324
325
  typographyDialogTitleXs: '700 24px/125% Sage UI',
package/js/base/es6.d.ts CHANGED
@@ -6,6 +6,7 @@ declare namespace _default {
6
6
  const colorsUtilityMajor200: string;
7
7
  const colorsUtilityMajor300: string;
8
8
  const colorsUtilityMajor400: string;
9
+ const colorsUtilityMajor450: string;
9
10
  const colorsUtilityMajor500: string;
10
11
  const colorsUtilityMajor800: string;
11
12
  const colorsUtilityMajor025: string;
package/js/base/es6.js CHANGED
@@ -10,6 +10,7 @@ export default {
10
10
  colorsUtilityMajor200: '#99adb7ff',
11
11
  colorsUtilityMajor300: '#668494ff',
12
12
  colorsUtilityMajor400: '#335b70ff',
13
+ colorsUtilityMajor450: '#19475eff',
13
14
  colorsUtilityMajor500: '#00324cff',
14
15
  colorsUtilityMajor800: '#00141eff',
15
16
  colorsUtilityMajor025: '#f2f5f6ff',
@@ -313,7 +314,7 @@ export default {
313
314
  typographyCardSelectTitleM: '700 16px/150% Sage UI',
314
315
  typographyCardSelectSubtitleM: '500 14px/150% Sage UI',
315
316
  typographyCardSelectParagraphM: '400 14px/150% Sage UI',
316
- typographyDatePickerCalendarDateM: '700 14px/150% Sage UI',
317
+ typographyDatePickerCalendarDateM: '500 14px/150% Sage UI',
317
318
  typographyDatePickerCalendarDayM: '700 14px/150% Sage UI',
318
319
  typographyDatePickerCalendarMonthM: '700 16px/125% Sage UI',
319
320
  typographyDialogTitleXs: '700 24px/125% Sage UI',
package/package.json CHANGED
@@ -10,7 +10,7 @@
10
10
  },
11
11
  "description": "Design tokens for the Sage Design System.",
12
12
  "author": "The Sage Group plc",
13
- "version": "2.36.0",
13
+ "version": "2.38.0",
14
14
  "license": "SEE LICENSE IN https://github.com/Sage/design-tokens/blob/master/license",
15
15
  "tags": [
16
16
  "design tokens",
Binary file
package/scss/base.scss CHANGED
@@ -4,7 +4,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
4
4
 
5
5
 
6
6
  // Do not edit directly
7
- // Generated on Thu, 23 Jun 2022 13:32:07 GMT
7
+ // Generated on Tue, 28 Jun 2022 14:03:47 GMT
8
8
 
9
9
  $metaName: Base Theme;
10
10
  $metaPublic: true;
@@ -13,6 +13,7 @@ $colorsUtilityMajor150: #b3c2c9ff;
13
13
  $colorsUtilityMajor200: #99adb7ff;
14
14
  $colorsUtilityMajor300: #668494ff;
15
15
  $colorsUtilityMajor400: #335b70ff;
16
+ $colorsUtilityMajor450: #19475eff;
16
17
  $colorsUtilityMajor500: #00324cff;
17
18
  $colorsUtilityMajor800: #00141eff;
18
19
  $colorsUtilityMajor025: #f2f5f6ff;
@@ -316,7 +317,7 @@ $typographyCardParagraphM: 400 14px/150% Sage UI;
316
317
  $typographyCardSelectTitleM: 700 16px/150% Sage UI;
317
318
  $typographyCardSelectSubtitleM: 500 14px/150% Sage UI;
318
319
  $typographyCardSelectParagraphM: 400 14px/150% Sage UI;
319
- $typographyDatePickerCalendarDateM: 700 14px/150% Sage UI;
320
+ $typographyDatePickerCalendarDateM: 500 14px/150% Sage UI;
320
321
  $typographyDatePickerCalendarDayM: 700 14px/150% Sage UI;
321
322
  $typographyDatePickerCalendarMonthM: 700 16px/125% Sage UI;
322
323
  $typographyDialogTitleXs: 700 24px/125% Sage UI;
Binary file