@sage/design-tokens 1.87.0 → 1.87.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
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 Tue, 11 Jan 2022 11:58:29 GMT
7
+ * Generated on Wed, 12 Jan 2022 11:22:45 GMT
8
8
  */
9
9
 
10
10
  :root {
@@ -193,11 +193,11 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
193
193
  --fontSizes010: 10px;
194
194
  --fontSizes025: 12px;
195
195
  --fontSizes050: 13px;
196
- --boxShadow100: 0 5px 5px 0 #00141eff, 0 10px 10px 0 #00141eff;
197
- --boxShadow200: 0 10px 20px 0 #00141eff, 0 20px 40px 0 #00141eff;
198
- --boxShadow300: 0 10px 30px 0 #00141eff, 0 30px 60px 0 #00141eff;
199
- --boxShadow400: 0 10px 40px 0 #00141eff, 0 50px 80px 0 #00141eff;
200
- --boxShadow050: 0 3px 3px 0 #00141eff, 0 2px 4px 0 #00141eff;
196
+ --boxShadow100: 0 5px 5px 0 #00141e33, 0 10px 10px 0 #00141e1a;
197
+ --boxShadow200: 0 10px 20px 0 #00141e33, 0 20px 40px 0 #00141e1a;
198
+ --boxShadow300: 0 10px 30px 0 #00141e1a, 0 30px 60px 0 #00141e1a;
199
+ --boxShadow400: 0 10px 40px 0 #00141e0a, 0 50px 80px 0 #00141e1a;
200
+ --boxShadow050: 0 3px 3px 0 #00141e33, 0 2px 4px 0 #00141e26;
201
201
  --fontWeights400: Regular;
202
202
  --fontWeights500: Medium;
203
203
  --fontWeights700: Bold;
package/css/no-theme.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 Tue, 11 Jan 2022 11:58:29 GMT
7
+ * Generated on Wed, 12 Jan 2022 11:22:45 GMT
8
8
  */
9
9
 
10
10
  :root {
package/data/tokens.json CHANGED
@@ -863,7 +863,7 @@
863
863
  "y": "5",
864
864
  "blur": "5",
865
865
  "spread": "0",
866
- "color": "#00141eff",
866
+ "color": "#00141e33",
867
867
  "type": "dropShadow"
868
868
  },
869
869
  {
@@ -871,7 +871,7 @@
871
871
  "y": "10",
872
872
  "blur": "10",
873
873
  "spread": "0",
874
- "color": "#00141eff",
874
+ "color": "#00141e1a",
875
875
  "type": "dropShadow"
876
876
  }
877
877
  ],
@@ -884,7 +884,7 @@
884
884
  "y": "10",
885
885
  "blur": "20",
886
886
  "spread": "0",
887
- "color": "#00141eff",
887
+ "color": "#00141e33",
888
888
  "type": "dropShadow"
889
889
  },
890
890
  {
@@ -892,7 +892,7 @@
892
892
  "y": "20",
893
893
  "blur": "40",
894
894
  "spread": "0",
895
- "color": "#00141eff",
895
+ "color": "#00141e1a",
896
896
  "type": "dropShadow"
897
897
  }
898
898
  ],
@@ -905,7 +905,7 @@
905
905
  "y": "10",
906
906
  "blur": "30",
907
907
  "spread": "0",
908
- "color": "#00141eff",
908
+ "color": "#00141e1a",
909
909
  "type": "dropShadow"
910
910
  },
911
911
  {
@@ -913,7 +913,7 @@
913
913
  "y": "30",
914
914
  "blur": "60",
915
915
  "spread": "0",
916
- "color": "#00141eff",
916
+ "color": "#00141e1a",
917
917
  "type": "dropShadow"
918
918
  }
919
919
  ],
@@ -926,7 +926,7 @@
926
926
  "y": "10",
927
927
  "blur": "40",
928
928
  "spread": "0",
929
- "color": "#00141eff",
929
+ "color": "#00141e0a",
930
930
  "type": "dropShadow"
931
931
  },
932
932
  {
@@ -934,7 +934,7 @@
934
934
  "y": "50",
935
935
  "blur": "80",
936
936
  "spread": "0",
937
- "color": "#00141eff",
937
+ "color": "#00141e1a",
938
938
  "type": "dropShadow"
939
939
  }
940
940
  ],
@@ -947,7 +947,7 @@
947
947
  "y": "3",
948
948
  "blur": "3",
949
949
  "spread": "0",
950
- "color": "#00141eff",
950
+ "color": "#00141e33",
951
951
  "type": "dropShadow"
952
952
  },
953
953
  {
@@ -955,7 +955,7 @@
955
955
  "y": "2",
956
956
  "blur": "4",
957
957
  "spread": "0",
958
- "color": "#00141eff",
958
+ "color": "#00141e26",
959
959
  "type": "dropShadow"
960
960
  }
961
961
  ],
package/docs/index.html CHANGED
@@ -422,28 +422,11 @@
422
422
  </a>
423
423
  </td>
424
424
  <td class="table__cell">
425
- <pre>[
426
- {
427
- &quot;x&quot;: &quot;0&quot;,
428
- &quot;y&quot;: &quot;3&quot;,
429
- &quot;blur&quot;: &quot;3&quot;,
430
- &quot;spread&quot;: &quot;0&quot;,
431
- &quot;color&quot;: &quot;#00141eff&quot;,
432
- &quot;type&quot;: &quot;dropShadow&quot;
433
- },
434
- {
435
- &quot;x&quot;: &quot;0&quot;,
436
- &quot;y&quot;: &quot;2&quot;,
437
- &quot;blur&quot;: &quot;4&quot;,
438
- &quot;spread&quot;: &quot;0&quot;,
439
- &quot;color&quot;: &quot;#00141eff&quot;,
440
- &quot;type&quot;: &quot;dropShadow&quot;
441
- }
442
- ]</pre>
425
+ <pre>0 3px 3px 0 #00141e33, 0 2px 4px 0 #00141e26</pre>
443
426
  </td>
444
427
  <td class="table__cell">
445
428
  <div class="table__box-shadow-preview"
446
- style="box-shadow: ">
429
+ style="box-shadow: 0 3px 3px 0 #00141e33, 0 2px 4px 0 #00141e26">
447
430
  </div>
448
431
  </td>
449
432
  </tr>
@@ -459,28 +442,11 @@
459
442
  </a>
460
443
  </td>
461
444
  <td class="table__cell">
462
- <pre>[
463
- {
464
- &quot;x&quot;: &quot;0&quot;,
465
- &quot;y&quot;: &quot;5&quot;,
466
- &quot;blur&quot;: &quot;5&quot;,
467
- &quot;spread&quot;: &quot;0&quot;,
468
- &quot;color&quot;: &quot;#00141eff&quot;,
469
- &quot;type&quot;: &quot;dropShadow&quot;
470
- },
471
- {
472
- &quot;x&quot;: &quot;0&quot;,
473
- &quot;y&quot;: &quot;10&quot;,
474
- &quot;blur&quot;: &quot;10&quot;,
475
- &quot;spread&quot;: &quot;0&quot;,
476
- &quot;color&quot;: &quot;#00141eff&quot;,
477
- &quot;type&quot;: &quot;dropShadow&quot;
478
- }
479
- ]</pre>
445
+ <pre>0 5px 5px 0 #00141e33, 0 10px 10px 0 #00141e1a</pre>
480
446
  </td>
481
447
  <td class="table__cell">
482
448
  <div class="table__box-shadow-preview"
483
- style="box-shadow: ">
449
+ style="box-shadow: 0 5px 5px 0 #00141e33, 0 10px 10px 0 #00141e1a">
484
450
  </div>
485
451
  </td>
486
452
  </tr>
@@ -496,28 +462,11 @@
496
462
  </a>
497
463
  </td>
498
464
  <td class="table__cell">
499
- <pre>[
500
- {
501
- &quot;x&quot;: &quot;0&quot;,
502
- &quot;y&quot;: &quot;10&quot;,
503
- &quot;blur&quot;: &quot;20&quot;,
504
- &quot;spread&quot;: &quot;0&quot;,
505
- &quot;color&quot;: &quot;#00141eff&quot;,
506
- &quot;type&quot;: &quot;dropShadow&quot;
507
- },
508
- {
509
- &quot;x&quot;: &quot;0&quot;,
510
- &quot;y&quot;: &quot;20&quot;,
511
- &quot;blur&quot;: &quot;40&quot;,
512
- &quot;spread&quot;: &quot;0&quot;,
513
- &quot;color&quot;: &quot;#00141eff&quot;,
514
- &quot;type&quot;: &quot;dropShadow&quot;
515
- }
516
- ]</pre>
465
+ <pre>0 10px 20px 0 #00141e33, 0 20px 40px 0 #00141e1a</pre>
517
466
  </td>
518
467
  <td class="table__cell">
519
468
  <div class="table__box-shadow-preview"
520
- style="box-shadow: ">
469
+ style="box-shadow: 0 10px 20px 0 #00141e33, 0 20px 40px 0 #00141e1a">
521
470
  </div>
522
471
  </td>
523
472
  </tr>
@@ -533,28 +482,11 @@
533
482
  </a>
534
483
  </td>
535
484
  <td class="table__cell">
536
- <pre>[
537
- {
538
- &quot;x&quot;: &quot;0&quot;,
539
- &quot;y&quot;: &quot;10&quot;,
540
- &quot;blur&quot;: &quot;30&quot;,
541
- &quot;spread&quot;: &quot;0&quot;,
542
- &quot;color&quot;: &quot;#00141eff&quot;,
543
- &quot;type&quot;: &quot;dropShadow&quot;
544
- },
545
- {
546
- &quot;x&quot;: &quot;0&quot;,
547
- &quot;y&quot;: &quot;30&quot;,
548
- &quot;blur&quot;: &quot;60&quot;,
549
- &quot;spread&quot;: &quot;0&quot;,
550
- &quot;color&quot;: &quot;#00141eff&quot;,
551
- &quot;type&quot;: &quot;dropShadow&quot;
552
- }
553
- ]</pre>
485
+ <pre>0 10px 30px 0 #00141e1a, 0 30px 60px 0 #00141e1a</pre>
554
486
  </td>
555
487
  <td class="table__cell">
556
488
  <div class="table__box-shadow-preview"
557
- style="box-shadow: ">
489
+ style="box-shadow: 0 10px 30px 0 #00141e1a, 0 30px 60px 0 #00141e1a">
558
490
  </div>
559
491
  </td>
560
492
  </tr>
@@ -570,28 +502,11 @@
570
502
  </a>
571
503
  </td>
572
504
  <td class="table__cell">
573
- <pre>[
574
- {
575
- &quot;x&quot;: &quot;0&quot;,
576
- &quot;y&quot;: &quot;10&quot;,
577
- &quot;blur&quot;: &quot;40&quot;,
578
- &quot;spread&quot;: &quot;0&quot;,
579
- &quot;color&quot;: &quot;#00141eff&quot;,
580
- &quot;type&quot;: &quot;dropShadow&quot;
581
- },
582
- {
583
- &quot;x&quot;: &quot;0&quot;,
584
- &quot;y&quot;: &quot;50&quot;,
585
- &quot;blur&quot;: &quot;80&quot;,
586
- &quot;spread&quot;: &quot;0&quot;,
587
- &quot;color&quot;: &quot;#00141eff&quot;,
588
- &quot;type&quot;: &quot;dropShadow&quot;
589
- }
590
- ]</pre>
505
+ <pre>0 10px 40px 0 #00141e0a, 0 50px 80px 0 #00141e1a</pre>
591
506
  </td>
592
507
  <td class="table__cell">
593
508
  <div class="table__box-shadow-preview"
594
- style="box-shadow: ">
509
+ style="box-shadow: 0 10px 40px 0 #00141e0a, 0 50px 80px 0 #00141e1a">
595
510
  </div>
596
511
  </td>
597
512
  </tr>
@@ -7961,13 +7876,7 @@
7961
7876
  </a>
7962
7877
  </td>
7963
7878
  <td class="table__cell">
7964
- <pre>{
7965
- &quot;x&quot;: &quot;0&quot;,
7966
- &quot;y&quot;: &quot;10px&quot;,
7967
- &quot;blur&quot;: &quot;10px&quot;,
7968
- &quot;spread&quot;: &quot;0&quot;,
7969
- &quot;color&quot;: &quot;#fb450080&quot;
7970
- }</pre>
7879
+ <pre>0 10px 10px 0 #fb450080</pre>
7971
7880
  </td>
7972
7881
  <td class="table__cell">
7973
7882
  <div class="table__box-shadow-preview"
@@ -7987,13 +7896,7 @@
7987
7896
  </a>
7988
7897
  </td>
7989
7898
  <td class="table__cell">
7990
- <pre>{
7991
- &quot;x&quot;: &quot;0&quot;,
7992
- &quot;y&quot;: &quot;20px&quot;,
7993
- &quot;blur&quot;: &quot;40px&quot;,
7994
- &quot;spread&quot;: &quot;0&quot;,
7995
- &quot;color&quot;: &quot;#95db0080&quot;
7996
- }</pre>
7899
+ <pre>0 20px 40px 0 #95db0080</pre>
7997
7900
  </td>
7998
7901
  <td class="table__cell">
7999
7902
  <div class="table__box-shadow-preview"
@@ -8013,13 +7916,7 @@
8013
7916
  </a>
8014
7917
  </td>
8015
7918
  <td class="table__cell">
8016
- <pre>{
8017
- &quot;x&quot;: &quot;0&quot;,
8018
- &quot;y&quot;: &quot;30px&quot;,
8019
- &quot;blur&quot;: &quot;60px&quot;,
8020
- &quot;spread&quot;: &quot;0&quot;,
8021
- &quot;color&quot;: &quot;#00b3db80&quot;
8022
- }</pre>
7919
+ <pre>0 30px 60px 0 #00b3db80</pre>
8023
7920
  </td>
8024
7921
  <td class="table__cell">
8025
7922
  <div class="table__box-shadow-preview"
@@ -8039,13 +7936,7 @@
8039
7936
  </a>
8040
7937
  </td>
8041
7938
  <td class="table__cell">
8042
- <pre>{
8043
- &quot;x&quot;: &quot;0&quot;,
8044
- &quot;y&quot;: &quot;50px&quot;,
8045
- &quot;blur&quot;: &quot;80px&quot;,
8046
- &quot;spread&quot;: &quot;0&quot;,
8047
- &quot;color&quot;: &quot;#6000db80&quot;
8048
- }</pre>
7939
+ <pre>0 50px 80px 0 #6000db80</pre>
8049
7940
  </td>
8050
7941
  <td class="table__cell">
8051
7942
  <div class="table__box-shadow-preview"
@@ -183,46 +183,11 @@ export const fontSizes1000: string;
183
183
  export const fontSizes010: string;
184
184
  export const fontSizes025: string;
185
185
  export const fontSizes050: string;
186
- export const boxShadow100: {
187
- x: string;
188
- y: string;
189
- blur: string;
190
- spread: string;
191
- color: string;
192
- type: string;
193
- }[];
194
- export const boxShadow200: {
195
- x: string;
196
- y: string;
197
- blur: string;
198
- spread: string;
199
- color: string;
200
- type: string;
201
- }[];
202
- export const boxShadow300: {
203
- x: string;
204
- y: string;
205
- blur: string;
206
- spread: string;
207
- color: string;
208
- type: string;
209
- }[];
210
- export const boxShadow400: {
211
- x: string;
212
- y: string;
213
- blur: string;
214
- spread: string;
215
- color: string;
216
- type: string;
217
- }[];
218
- export const boxShadow050: {
219
- x: string;
220
- y: string;
221
- blur: string;
222
- spread: string;
223
- color: string;
224
- type: string;
225
- }[];
186
+ export const boxShadow100: string;
187
+ export const boxShadow200: string;
188
+ export const boxShadow300: string;
189
+ export const boxShadow400: string;
190
+ export const boxShadow050: string;
226
191
  export const fontWeights400: string;
227
192
  export const fontWeights500: string;
228
193
  export const fontWeights700: 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 Tue, 11 Jan 2022 11:58:29 GMT
7
+ * Generated on Wed, 12 Jan 2022 11:22:45 GMT
8
8
  */
9
9
 
10
10
  module.exports = {
@@ -193,11 +193,11 @@ module.exports = {
193
193
  fontSizes010: '10px',
194
194
  fontSizes025: '12px',
195
195
  fontSizes050: '13px',
196
- boxShadow100: [{ x: '0', y: '5', blur: '5', spread: '0', color: '#00141eff', type: 'dropShadow' }, { x: '0', y: '10', blur: '10', spread: '0', color: '#00141eff', type: 'dropShadow' }],
197
- boxShadow200: [{ x: '0', y: '10', blur: '20', spread: '0', color: '#00141eff', type: 'dropShadow' }, { x: '0', y: '20', blur: '40', spread: '0', color: '#00141eff', type: 'dropShadow' }],
198
- boxShadow300: [{ x: '0', y: '10', blur: '30', spread: '0', color: '#00141eff', type: 'dropShadow' }, { x: '0', y: '30', blur: '60', spread: '0', color: '#00141eff', type: 'dropShadow' }],
199
- boxShadow400: [{ x: '0', y: '10', blur: '40', spread: '0', color: '#00141eff', type: 'dropShadow' }, { x: '0', y: '50', blur: '80', spread: '0', color: '#00141eff', type: 'dropShadow' }],
200
- boxShadow050: [{ x: '0', y: '3', blur: '3', spread: '0', color: '#00141eff', type: 'dropShadow' }, { x: '0', y: '2', blur: '4', spread: '0', color: '#00141eff', type: 'dropShadow' }],
196
+ boxShadow100: '0 5px 5px 0 #00141e33, 0 10px 10px 0 #00141e1a',
197
+ boxShadow200: '0 10px 20px 0 #00141e33, 0 20px 40px 0 #00141e1a',
198
+ boxShadow300: '0 10px 30px 0 #00141e1a, 0 30px 60px 0 #00141e1a',
199
+ boxShadow400: '0 10px 40px 0 #00141e0a, 0 50px 80px 0 #00141e1a',
200
+ boxShadow050: '0 3px 3px 0 #00141e33, 0 2px 4px 0 #00141e26',
201
201
  fontWeights400: 'Regular',
202
202
  fontWeights500: 'Medium',
203
203
  fontWeights700: 'Bold',
package/js/base/es6.d.ts CHANGED
@@ -184,46 +184,11 @@ declare namespace _default {
184
184
  const fontSizes010: string;
185
185
  const fontSizes025: string;
186
186
  const fontSizes050: string;
187
- const boxShadow100: {
188
- x: string;
189
- y: string;
190
- blur: string;
191
- spread: string;
192
- color: string;
193
- type: string;
194
- }[];
195
- const boxShadow200: {
196
- x: string;
197
- y: string;
198
- blur: string;
199
- spread: string;
200
- color: string;
201
- type: string;
202
- }[];
203
- const boxShadow300: {
204
- x: string;
205
- y: string;
206
- blur: string;
207
- spread: string;
208
- color: string;
209
- type: string;
210
- }[];
211
- const boxShadow400: {
212
- x: string;
213
- y: string;
214
- blur: string;
215
- spread: string;
216
- color: string;
217
- type: string;
218
- }[];
219
- const boxShadow050: {
220
- x: string;
221
- y: string;
222
- blur: string;
223
- spread: string;
224
- color: string;
225
- type: string;
226
- }[];
187
+ const boxShadow100: string;
188
+ const boxShadow200: string;
189
+ const boxShadow300: string;
190
+ const boxShadow400: string;
191
+ const boxShadow050: string;
227
192
  const fontWeights400: string;
228
193
  const fontWeights500: string;
229
194
  const fontWeights700: string;
package/js/base/es6.js CHANGED
@@ -188,96 +188,11 @@ export default {
188
188
  fontSizes010: '10px',
189
189
  fontSizes025: '12px',
190
190
  fontSizes050: '13px',
191
- boxShadow100: [
192
- {
193
- x: '0',
194
- y: '5',
195
- blur: '5',
196
- spread: '0',
197
- color: '#00141eff',
198
- type: 'dropShadow'
199
- },
200
- {
201
- x: '0',
202
- y: '10',
203
- blur: '10',
204
- spread: '0',
205
- color: '#00141eff',
206
- type: 'dropShadow'
207
- }
208
- ],
209
- boxShadow200: [
210
- {
211
- x: '0',
212
- y: '10',
213
- blur: '20',
214
- spread: '0',
215
- color: '#00141eff',
216
- type: 'dropShadow'
217
- },
218
- {
219
- x: '0',
220
- y: '20',
221
- blur: '40',
222
- spread: '0',
223
- color: '#00141eff',
224
- type: 'dropShadow'
225
- }
226
- ],
227
- boxShadow300: [
228
- {
229
- x: '0',
230
- y: '10',
231
- blur: '30',
232
- spread: '0',
233
- color: '#00141eff',
234
- type: 'dropShadow'
235
- },
236
- {
237
- x: '0',
238
- y: '30',
239
- blur: '60',
240
- spread: '0',
241
- color: '#00141eff',
242
- type: 'dropShadow'
243
- }
244
- ],
245
- boxShadow400: [
246
- {
247
- x: '0',
248
- y: '10',
249
- blur: '40',
250
- spread: '0',
251
- color: '#00141eff',
252
- type: 'dropShadow'
253
- },
254
- {
255
- x: '0',
256
- y: '50',
257
- blur: '80',
258
- spread: '0',
259
- color: '#00141eff',
260
- type: 'dropShadow'
261
- }
262
- ],
263
- boxShadow050: [
264
- {
265
- x: '0',
266
- y: '3',
267
- blur: '3',
268
- spread: '0',
269
- color: '#00141eff',
270
- type: 'dropShadow'
271
- },
272
- {
273
- x: '0',
274
- y: '2',
275
- blur: '4',
276
- spread: '0',
277
- color: '#00141eff',
278
- type: 'dropShadow'
279
- }
280
- ],
191
+ boxShadow100: '0 5px 5px 0 #00141e33, 0 10px 10px 0 #00141e1a',
192
+ boxShadow200: '0 10px 20px 0 #00141e33, 0 20px 40px 0 #00141e1a',
193
+ boxShadow300: '0 10px 30px 0 #00141e1a, 0 30px 60px 0 #00141e1a',
194
+ boxShadow400: '0 10px 40px 0 #00141e0a, 0 50px 80px 0 #00141e1a',
195
+ boxShadow050: '0 3px 3px 0 #00141e33, 0 2px 4px 0 #00141e26',
281
196
  fontWeights400: 'Regular',
282
197
  fontWeights500: 'Medium',
283
198
  fontWeights700: 'Bold',
@@ -179,49 +179,10 @@ export const fontSizes1000: string;
179
179
  export const fontSizes010: string;
180
180
  export const fontSizes025: string;
181
181
  export const fontSizes050: string;
182
- export namespace boxShadow100 {
183
- const x: string;
184
- const y: string;
185
- const blur: string;
186
- const spread: string;
187
- const color: string;
188
- }
189
- export namespace boxShadow200 {
190
- const x_1: string;
191
- export { x_1 as x };
192
- const y_1: string;
193
- export { y_1 as y };
194
- const blur_1: string;
195
- export { blur_1 as blur };
196
- const spread_1: string;
197
- export { spread_1 as spread };
198
- const color_1: string;
199
- export { color_1 as color };
200
- }
201
- export namespace boxShadow300 {
202
- const x_2: string;
203
- export { x_2 as x };
204
- const y_2: string;
205
- export { y_2 as y };
206
- const blur_2: string;
207
- export { blur_2 as blur };
208
- const spread_2: string;
209
- export { spread_2 as spread };
210
- const color_2: string;
211
- export { color_2 as color };
212
- }
213
- export namespace boxShadow400 {
214
- const x_3: string;
215
- export { x_3 as x };
216
- const y_3: string;
217
- export { y_3 as y };
218
- const blur_3: string;
219
- export { blur_3 as blur };
220
- const spread_3: string;
221
- export { spread_3 as spread };
222
- const color_3: string;
223
- export { color_3 as color };
224
- }
182
+ export const boxShadow100: string;
183
+ export const boxShadow200: string;
184
+ export const boxShadow300: string;
185
+ export const boxShadow400: string;
225
186
  export const fontWeights400: string;
226
187
  export const fontWeights500: string;
227
188
  export const fontWeights700: string;
@@ -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 Tue, 11 Jan 2022 11:58:29 GMT
7
+ * Generated on Wed, 12 Jan 2022 11:22:45 GMT
8
8
  */
9
9
 
10
10
  module.exports = {
@@ -189,10 +189,10 @@ module.exports = {
189
189
  fontSizes010: '10px',
190
190
  fontSizes025: '12px',
191
191
  fontSizes050: '13px',
192
- boxShadow100: { x: '0', y: '10px', blur: '10px', spread: '0', color: '#fb450080' },
193
- boxShadow200: { x: '0', y: '20px', blur: '40px', spread: '0', color: '#95db0080' },
194
- boxShadow300: { x: '0', y: '30px', blur: '60px', spread: '0', color: '#00b3db80' },
195
- boxShadow400: { x: '0', y: '50px', blur: '80px', spread: '0', color: '#6000db80' },
192
+ boxShadow100: '0 10px 10px 0 #fb450080',
193
+ boxShadow200: '0 20px 40px 0 #95db0080',
194
+ boxShadow300: '0 30px 60px 0 #00b3db80',
195
+ boxShadow400: '0 50px 80px 0 #6000db80',
196
196
  fontWeights400: 'Regular',
197
197
  fontWeights500: 'Medium',
198
198
  fontWeights700: 'Bold',
@@ -180,49 +180,10 @@ declare namespace _default {
180
180
  const fontSizes010: string;
181
181
  const fontSizes025: string;
182
182
  const fontSizes050: string;
183
- namespace boxShadow100 {
184
- const x: string;
185
- const y: string;
186
- const blur: string;
187
- const spread: string;
188
- const color: string;
189
- }
190
- namespace boxShadow200 {
191
- const x_1: string;
192
- export { x_1 as x };
193
- const y_1: string;
194
- export { y_1 as y };
195
- const blur_1: string;
196
- export { blur_1 as blur };
197
- const spread_1: string;
198
- export { spread_1 as spread };
199
- const color_1: string;
200
- export { color_1 as color };
201
- }
202
- namespace boxShadow300 {
203
- const x_2: string;
204
- export { x_2 as x };
205
- const y_2: string;
206
- export { y_2 as y };
207
- const blur_2: string;
208
- export { blur_2 as blur };
209
- const spread_2: string;
210
- export { spread_2 as spread };
211
- const color_2: string;
212
- export { color_2 as color };
213
- }
214
- namespace boxShadow400 {
215
- const x_3: string;
216
- export { x_3 as x };
217
- const y_3: string;
218
- export { y_3 as y };
219
- const blur_3: string;
220
- export { blur_3 as blur };
221
- const spread_3: string;
222
- export { spread_3 as spread };
223
- const color_3: string;
224
- export { color_3 as color };
225
- }
183
+ const boxShadow100: string;
184
+ const boxShadow200: string;
185
+ const boxShadow300: string;
186
+ const boxShadow400: string;
226
187
  const fontWeights400: string;
227
188
  const fontWeights500: string;
228
189
  const fontWeights700: string;
@@ -184,34 +184,10 @@ export default {
184
184
  fontSizes010: '10px',
185
185
  fontSizes025: '12px',
186
186
  fontSizes050: '13px',
187
- boxShadow100: {
188
- x: '0',
189
- y: '10px',
190
- blur: '10px',
191
- spread: '0',
192
- color: '#fb450080'
193
- },
194
- boxShadow200: {
195
- x: '0',
196
- y: '20px',
197
- blur: '40px',
198
- spread: '0',
199
- color: '#95db0080'
200
- },
201
- boxShadow300: {
202
- x: '0',
203
- y: '30px',
204
- blur: '60px',
205
- spread: '0',
206
- color: '#00b3db80'
207
- },
208
- boxShadow400: {
209
- x: '0',
210
- y: '50px',
211
- blur: '80px',
212
- spread: '0',
213
- color: '#6000db80'
214
- },
187
+ boxShadow100: '0 10px 10px 0 #fb450080',
188
+ boxShadow200: '0 20px 40px 0 #95db0080',
189
+ boxShadow300: '0 30px 60px 0 #00b3db80',
190
+ boxShadow400: '0 50px 80px 0 #6000db80',
215
191
  fontWeights400: 'Regular',
216
192
  fontWeights500: 'Medium',
217
193
  fontWeights700: 'Bold',
package/package.json CHANGED
@@ -6,7 +6,7 @@
6
6
  },
7
7
  "description": "Design tokens for the Sage Design System.",
8
8
  "author": "The Sage Group plc",
9
- "version": "1.87.0",
9
+ "version": "1.87.1",
10
10
  "license": "SEE LICENSE IN https://github.com/Sage/design-tokens/blob/master/license",
11
11
  "tags": [
12
12
  "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 Tue, 11 Jan 2022 11:58:29 GMT
7
+ // Generated on Wed, 12 Jan 2022 11:22:45 GMT
8
8
 
9
9
  $metaName: Base Theme;
10
10
  $metaPublic: true;
@@ -191,11 +191,11 @@ $fontSizes1000: 56px;
191
191
  $fontSizes010: 10px;
192
192
  $fontSizes025: 12px;
193
193
  $fontSizes050: 13px;
194
- $boxShadow100: 0 5px 5px 0 #00141eff, 0 10px 10px 0 #00141eff;
195
- $boxShadow200: 0 10px 20px 0 #00141eff, 0 20px 40px 0 #00141eff;
196
- $boxShadow300: 0 10px 30px 0 #00141eff, 0 30px 60px 0 #00141eff;
197
- $boxShadow400: 0 10px 40px 0 #00141eff, 0 50px 80px 0 #00141eff;
198
- $boxShadow050: 0 3px 3px 0 #00141eff, 0 2px 4px 0 #00141eff;
194
+ $boxShadow100: 0 5px 5px 0 #00141e33, 0 10px 10px 0 #00141e1a;
195
+ $boxShadow200: 0 10px 20px 0 #00141e33, 0 20px 40px 0 #00141e1a;
196
+ $boxShadow300: 0 10px 30px 0 #00141e1a, 0 30px 60px 0 #00141e1a;
197
+ $boxShadow400: 0 10px 40px 0 #00141e0a, 0 50px 80px 0 #00141e1a;
198
+ $boxShadow050: 0 3px 3px 0 #00141e33, 0 2px 4px 0 #00141e26;
199
199
  $fontWeights400: Regular;
200
200
  $fontWeights500: Medium;
201
201
  $fontWeights700: Bold;
@@ -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 Tue, 11 Jan 2022 11:58:29 GMT
7
+ // Generated on Wed, 12 Jan 2022 11:22:45 GMT
8
8
 
9
9
  $metaName: No Theme;
10
10
  $metaPublic: true;
Binary file