@madgex/design-system 1.3.2 → 1.3.3

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.
@@ -0,0 +1,53 @@
1
+ /**
2
+ * Do not edit directly
3
+ * Generated on Thu, 06 Jun 2019 16:40:50 GMT
4
+ */
5
+
6
+ :root {
7
+ --mds-color-base: #71767a; /* Base colour */
8
+ --mds-color-white: #ffffff;
9
+ --mds-color-black: #000000;
10
+ --mds-color-primary: #2c608a;
11
+ --mds-color-secondary: #d83933;
12
+ --mds-color-destructive: #ff0000;
13
+ --mds-color-text-primary: #000000;
14
+ --mds-color-accent-warm: #fa9441;
15
+ --mds-color-accent-cool: #00bde3;
16
+ --mds-color-neutral-15: #262626;
17
+ --mds-color-neutral-20: #323232;
18
+ --mds-color-neutral-30: #4d4d4d;
19
+ --mds-color-neutral-53: #888888;
20
+ --mds-color-neutral-95: #f3f1f1;
21
+ --mds-font-family-base: "Helvetica", Arial, sans-serif;
22
+ --mds-size-font-xs: 12rem;
23
+ --mds-size-font-sm: 14rem;
24
+ --mds-size-font-md: 16rem;
25
+ --mds-size-font-lg: 20rem;
26
+ --mds-size-font-xl: 26rem;
27
+ --mds-size-font-xxl: 46rem;
28
+ --mds-size-font-base: 16rem;
29
+ --mds-size-space-none: 0rem;
30
+ --mds-size-space-xxs: 4rem;
31
+ --mds-size-space-xs: 8rem;
32
+ --mds-size-space-sm: 12rem;
33
+ --mds-size-space-md: 16rem;
34
+ --mds-size-space-lg: 24rem;
35
+ --mds-size-space-xl: 32rem;
36
+ --mds-size-space-xxl: 48rem;
37
+ --mds-size-space-xxxl: 64rem;
38
+ --mds-size-space-default: 16rem;
39
+ --mds-size-space-inset-none: 0rem;
40
+ --mds-size-space-inset-xxs: 4rem;
41
+ --mds-size-space-inset-xs: 8rem;
42
+ --mds-size-space-inset-sm: 12rem;
43
+ --mds-size-space-inset-md: 16rem;
44
+ --mds-size-space-inset-lg: 24rem;
45
+ --mds-size-space-inset-xl: 32rem;
46
+ --mds-size-space-inset-xxl: 48rem;
47
+ --mds-size-space-inset-xxxl: 64rem;
48
+ --mds-size-space-inset-default: 16rem;
49
+ --mds-size-breakpoint-sm: 0rem;
50
+ --mds-size-breakpoint-md: 768rem;
51
+ --mds-size-breakpoint-lg: 1024rem;
52
+ --mds-size-focus-width: 3rem;
53
+ }
@@ -0,0 +1,817 @@
1
+ /**
2
+ * Do not edit directly
3
+ * Generated on Thu, 06 Jun 2019 16:40:50 GMT
4
+ */
5
+
6
+ module.exports = {
7
+ "color": {
8
+ "base": {
9
+ "value": "#71767a",
10
+ "comment": "Base colour",
11
+ "original": {
12
+ "value": "#71767a",
13
+ "comment": "Base colour"
14
+ },
15
+ "name": "MdsColorBase",
16
+ "attributes": {
17
+ "category": "color",
18
+ "type": "base"
19
+ },
20
+ "path": [
21
+ "color",
22
+ "base"
23
+ ]
24
+ },
25
+ "white": {
26
+ "value": "#ffffff",
27
+ "original": {
28
+ "value": "#FFFFFF"
29
+ },
30
+ "name": "MdsColorWhite",
31
+ "attributes": {
32
+ "category": "color",
33
+ "type": "white"
34
+ },
35
+ "path": [
36
+ "color",
37
+ "white"
38
+ ]
39
+ },
40
+ "black": {
41
+ "value": "#000000",
42
+ "original": {
43
+ "value": "#000000"
44
+ },
45
+ "name": "MdsColorBlack",
46
+ "attributes": {
47
+ "category": "color",
48
+ "type": "black"
49
+ },
50
+ "path": [
51
+ "color",
52
+ "black"
53
+ ]
54
+ },
55
+ "primary": {
56
+ "value": "#2c608a",
57
+ "original": {
58
+ "value": "#2c608a"
59
+ },
60
+ "name": "MdsColorPrimary",
61
+ "attributes": {
62
+ "category": "color",
63
+ "type": "primary"
64
+ },
65
+ "path": [
66
+ "color",
67
+ "primary"
68
+ ]
69
+ },
70
+ "secondary": {
71
+ "value": "#d83933",
72
+ "original": {
73
+ "value": "#d83933"
74
+ },
75
+ "name": "MdsColorSecondary",
76
+ "attributes": {
77
+ "category": "color",
78
+ "type": "secondary"
79
+ },
80
+ "path": [
81
+ "color",
82
+ "secondary"
83
+ ]
84
+ },
85
+ "destructive": {
86
+ "value": "#ff0000",
87
+ "original": {
88
+ "value": "red"
89
+ },
90
+ "name": "MdsColorDestructive",
91
+ "attributes": {
92
+ "category": "color",
93
+ "type": "destructive"
94
+ },
95
+ "path": [
96
+ "color",
97
+ "destructive"
98
+ ]
99
+ },
100
+ "text": {
101
+ "primary": {
102
+ "value": "#000000",
103
+ "original": {
104
+ "value": "{color.black.value}"
105
+ },
106
+ "name": "MdsColorTextPrimary",
107
+ "attributes": {
108
+ "category": "color",
109
+ "type": "text",
110
+ "item": "primary"
111
+ },
112
+ "path": [
113
+ "color",
114
+ "text",
115
+ "primary"
116
+ ]
117
+ }
118
+ },
119
+ "accent-warm": {
120
+ "value": "#fa9441",
121
+ "original": {
122
+ "value": "#fa9441"
123
+ },
124
+ "name": "MdsColorAccentWarm",
125
+ "attributes": {
126
+ "category": "color",
127
+ "type": "accent-warm"
128
+ },
129
+ "path": [
130
+ "color",
131
+ "accent-warm"
132
+ ]
133
+ },
134
+ "accent-cool": {
135
+ "value": "#00bde3",
136
+ "original": {
137
+ "value": "#00bde3"
138
+ },
139
+ "name": "MdsColorAccentCool",
140
+ "attributes": {
141
+ "category": "color",
142
+ "type": "accent-cool"
143
+ },
144
+ "path": [
145
+ "color",
146
+ "accent-cool"
147
+ ]
148
+ },
149
+ "neutral": {
150
+ "15": {
151
+ "value": "#262626",
152
+ "original": {
153
+ "value": "#262626"
154
+ },
155
+ "name": "MdsColorNeutral15",
156
+ "attributes": {
157
+ "category": "color",
158
+ "type": "neutral",
159
+ "item": "15"
160
+ },
161
+ "path": [
162
+ "color",
163
+ "neutral",
164
+ "15"
165
+ ]
166
+ },
167
+ "20": {
168
+ "value": "#323232",
169
+ "original": {
170
+ "value": "#323232"
171
+ },
172
+ "name": "MdsColorNeutral20",
173
+ "attributes": {
174
+ "category": "color",
175
+ "type": "neutral",
176
+ "item": "20"
177
+ },
178
+ "path": [
179
+ "color",
180
+ "neutral",
181
+ "20"
182
+ ]
183
+ },
184
+ "30": {
185
+ "value": "#4d4d4d",
186
+ "original": {
187
+ "value": "#4d4d4d"
188
+ },
189
+ "name": "MdsColorNeutral30",
190
+ "attributes": {
191
+ "category": "color",
192
+ "type": "neutral",
193
+ "item": "30"
194
+ },
195
+ "path": [
196
+ "color",
197
+ "neutral",
198
+ "30"
199
+ ]
200
+ },
201
+ "53": {
202
+ "value": "#888888",
203
+ "original": {
204
+ "value": "#888888"
205
+ },
206
+ "name": "MdsColorNeutral53",
207
+ "attributes": {
208
+ "category": "color",
209
+ "type": "neutral",
210
+ "item": "53"
211
+ },
212
+ "path": [
213
+ "color",
214
+ "neutral",
215
+ "53"
216
+ ]
217
+ },
218
+ "95": {
219
+ "value": "#f3f1f1",
220
+ "original": {
221
+ "value": "#f3f1f1"
222
+ },
223
+ "name": "MdsColorNeutral95",
224
+ "attributes": {
225
+ "category": "color",
226
+ "type": "neutral",
227
+ "item": "95"
228
+ },
229
+ "path": [
230
+ "color",
231
+ "neutral",
232
+ "95"
233
+ ]
234
+ }
235
+ }
236
+ },
237
+ "font": {
238
+ "family": {
239
+ "base": {
240
+ "value": "\"Helvetica\", Arial, sans-serif",
241
+ "original": {
242
+ "value": "\"Helvetica\", Arial, sans-serif"
243
+ },
244
+ "name": "MdsFontFamilyBase",
245
+ "attributes": {
246
+ "category": "font",
247
+ "type": "family",
248
+ "item": "base"
249
+ },
250
+ "path": [
251
+ "font",
252
+ "family",
253
+ "base"
254
+ ]
255
+ }
256
+ }
257
+ },
258
+ "size": {
259
+ "font": {
260
+ "xs": {
261
+ "value": "12rem",
262
+ "original": {
263
+ "value": "12"
264
+ },
265
+ "name": "MdsSizeFontXs",
266
+ "attributes": {
267
+ "category": "size",
268
+ "type": "font",
269
+ "item": "xs"
270
+ },
271
+ "path": [
272
+ "size",
273
+ "font",
274
+ "xs"
275
+ ]
276
+ },
277
+ "sm": {
278
+ "value": "14rem",
279
+ "original": {
280
+ "value": "14"
281
+ },
282
+ "name": "MdsSizeFontSm",
283
+ "attributes": {
284
+ "category": "size",
285
+ "type": "font",
286
+ "item": "sm"
287
+ },
288
+ "path": [
289
+ "size",
290
+ "font",
291
+ "sm"
292
+ ]
293
+ },
294
+ "md": {
295
+ "value": "16rem",
296
+ "original": {
297
+ "value": "16px"
298
+ },
299
+ "name": "MdsSizeFontMd",
300
+ "attributes": {
301
+ "category": "size",
302
+ "type": "font",
303
+ "item": "md"
304
+ },
305
+ "path": [
306
+ "size",
307
+ "font",
308
+ "md"
309
+ ]
310
+ },
311
+ "lg": {
312
+ "value": "20rem",
313
+ "original": {
314
+ "value": "20"
315
+ },
316
+ "name": "MdsSizeFontLg",
317
+ "attributes": {
318
+ "category": "size",
319
+ "type": "font",
320
+ "item": "lg"
321
+ },
322
+ "path": [
323
+ "size",
324
+ "font",
325
+ "lg"
326
+ ]
327
+ },
328
+ "xl": {
329
+ "value": "26rem",
330
+ "original": {
331
+ "value": "26"
332
+ },
333
+ "name": "MdsSizeFontXl",
334
+ "attributes": {
335
+ "category": "size",
336
+ "type": "font",
337
+ "item": "xl"
338
+ },
339
+ "path": [
340
+ "size",
341
+ "font",
342
+ "xl"
343
+ ]
344
+ },
345
+ "xxl": {
346
+ "value": "46rem",
347
+ "original": {
348
+ "value": "46"
349
+ },
350
+ "name": "MdsSizeFontXxl",
351
+ "attributes": {
352
+ "category": "size",
353
+ "type": "font",
354
+ "item": "xxl"
355
+ },
356
+ "path": [
357
+ "size",
358
+ "font",
359
+ "xxl"
360
+ ]
361
+ },
362
+ "base": {
363
+ "value": "16rem",
364
+ "original": {
365
+ "value": "{size.font.md.value}"
366
+ },
367
+ "name": "MdsSizeFontBase",
368
+ "attributes": {
369
+ "category": "size",
370
+ "type": "font",
371
+ "item": "base"
372
+ },
373
+ "path": [
374
+ "size",
375
+ "font",
376
+ "base"
377
+ ]
378
+ }
379
+ },
380
+ "space": {
381
+ "none": {
382
+ "value": "0rem",
383
+ "original": {
384
+ "value": "0"
385
+ },
386
+ "name": "MdsSizeSpaceNone",
387
+ "attributes": {
388
+ "category": "size",
389
+ "type": "space",
390
+ "item": "none"
391
+ },
392
+ "path": [
393
+ "size",
394
+ "space",
395
+ "none"
396
+ ]
397
+ },
398
+ "xxs": {
399
+ "value": "4rem",
400
+ "original": {
401
+ "value": "4px"
402
+ },
403
+ "name": "MdsSizeSpaceXxs",
404
+ "attributes": {
405
+ "category": "size",
406
+ "type": "space",
407
+ "item": "xxs"
408
+ },
409
+ "path": [
410
+ "size",
411
+ "space",
412
+ "xxs"
413
+ ]
414
+ },
415
+ "xs": {
416
+ "value": "8rem",
417
+ "original": {
418
+ "value": "8px"
419
+ },
420
+ "name": "MdsSizeSpaceXs",
421
+ "attributes": {
422
+ "category": "size",
423
+ "type": "space",
424
+ "item": "xs"
425
+ },
426
+ "path": [
427
+ "size",
428
+ "space",
429
+ "xs"
430
+ ]
431
+ },
432
+ "sm": {
433
+ "value": "12rem",
434
+ "original": {
435
+ "value": "12px"
436
+ },
437
+ "name": "MdsSizeSpaceSm",
438
+ "attributes": {
439
+ "category": "size",
440
+ "type": "space",
441
+ "item": "sm"
442
+ },
443
+ "path": [
444
+ "size",
445
+ "space",
446
+ "sm"
447
+ ]
448
+ },
449
+ "md": {
450
+ "value": "16rem",
451
+ "original": {
452
+ "value": "16px"
453
+ },
454
+ "name": "MdsSizeSpaceMd",
455
+ "attributes": {
456
+ "category": "size",
457
+ "type": "space",
458
+ "item": "md"
459
+ },
460
+ "path": [
461
+ "size",
462
+ "space",
463
+ "md"
464
+ ]
465
+ },
466
+ "lg": {
467
+ "value": "24rem",
468
+ "original": {
469
+ "value": "24px"
470
+ },
471
+ "name": "MdsSizeSpaceLg",
472
+ "attributes": {
473
+ "category": "size",
474
+ "type": "space",
475
+ "item": "lg"
476
+ },
477
+ "path": [
478
+ "size",
479
+ "space",
480
+ "lg"
481
+ ]
482
+ },
483
+ "xl": {
484
+ "value": "32rem",
485
+ "original": {
486
+ "value": "32px"
487
+ },
488
+ "name": "MdsSizeSpaceXl",
489
+ "attributes": {
490
+ "category": "size",
491
+ "type": "space",
492
+ "item": "xl"
493
+ },
494
+ "path": [
495
+ "size",
496
+ "space",
497
+ "xl"
498
+ ]
499
+ },
500
+ "xxl": {
501
+ "value": "48rem",
502
+ "original": {
503
+ "value": "48px"
504
+ },
505
+ "name": "MdsSizeSpaceXxl",
506
+ "attributes": {
507
+ "category": "size",
508
+ "type": "space",
509
+ "item": "xxl"
510
+ },
511
+ "path": [
512
+ "size",
513
+ "space",
514
+ "xxl"
515
+ ]
516
+ },
517
+ "xxxl": {
518
+ "value": "64rem",
519
+ "original": {
520
+ "value": "64px"
521
+ },
522
+ "name": "MdsSizeSpaceXxxl",
523
+ "attributes": {
524
+ "category": "size",
525
+ "type": "space",
526
+ "item": "xxxl"
527
+ },
528
+ "path": [
529
+ "size",
530
+ "space",
531
+ "xxxl"
532
+ ]
533
+ },
534
+ "default": {
535
+ "value": "16rem",
536
+ "original": {
537
+ "value": "{size.space.md.value}"
538
+ },
539
+ "name": "MdsSizeSpaceDefault",
540
+ "attributes": {
541
+ "category": "size",
542
+ "type": "space",
543
+ "item": "default"
544
+ },
545
+ "path": [
546
+ "size",
547
+ "space",
548
+ "default"
549
+ ]
550
+ },
551
+ "inset": {
552
+ "none": {
553
+ "value": "0rem",
554
+ "original": {
555
+ "value": "0"
556
+ },
557
+ "name": "MdsSizeSpaceInsetNone",
558
+ "attributes": {
559
+ "category": "size",
560
+ "type": "space",
561
+ "item": "inset",
562
+ "subitem": "none"
563
+ },
564
+ "path": [
565
+ "size",
566
+ "space",
567
+ "inset",
568
+ "none"
569
+ ]
570
+ },
571
+ "xxs": {
572
+ "value": "4rem",
573
+ "original": {
574
+ "value": "4px"
575
+ },
576
+ "name": "MdsSizeSpaceInsetXxs",
577
+ "attributes": {
578
+ "category": "size",
579
+ "type": "space",
580
+ "item": "inset",
581
+ "subitem": "xxs"
582
+ },
583
+ "path": [
584
+ "size",
585
+ "space",
586
+ "inset",
587
+ "xxs"
588
+ ]
589
+ },
590
+ "xs": {
591
+ "value": "8rem",
592
+ "original": {
593
+ "value": "8px"
594
+ },
595
+ "name": "MdsSizeSpaceInsetXs",
596
+ "attributes": {
597
+ "category": "size",
598
+ "type": "space",
599
+ "item": "inset",
600
+ "subitem": "xs"
601
+ },
602
+ "path": [
603
+ "size",
604
+ "space",
605
+ "inset",
606
+ "xs"
607
+ ]
608
+ },
609
+ "sm": {
610
+ "value": "12rem",
611
+ "original": {
612
+ "value": "12px"
613
+ },
614
+ "name": "MdsSizeSpaceInsetSm",
615
+ "attributes": {
616
+ "category": "size",
617
+ "type": "space",
618
+ "item": "inset",
619
+ "subitem": "sm"
620
+ },
621
+ "path": [
622
+ "size",
623
+ "space",
624
+ "inset",
625
+ "sm"
626
+ ]
627
+ },
628
+ "md": {
629
+ "value": "16rem",
630
+ "original": {
631
+ "value": "16px"
632
+ },
633
+ "name": "MdsSizeSpaceInsetMd",
634
+ "attributes": {
635
+ "category": "size",
636
+ "type": "space",
637
+ "item": "inset",
638
+ "subitem": "md"
639
+ },
640
+ "path": [
641
+ "size",
642
+ "space",
643
+ "inset",
644
+ "md"
645
+ ]
646
+ },
647
+ "lg": {
648
+ "value": "24rem",
649
+ "original": {
650
+ "value": "24px"
651
+ },
652
+ "name": "MdsSizeSpaceInsetLg",
653
+ "attributes": {
654
+ "category": "size",
655
+ "type": "space",
656
+ "item": "inset",
657
+ "subitem": "lg"
658
+ },
659
+ "path": [
660
+ "size",
661
+ "space",
662
+ "inset",
663
+ "lg"
664
+ ]
665
+ },
666
+ "xl": {
667
+ "value": "32rem",
668
+ "original": {
669
+ "value": "32px"
670
+ },
671
+ "name": "MdsSizeSpaceInsetXl",
672
+ "attributes": {
673
+ "category": "size",
674
+ "type": "space",
675
+ "item": "inset",
676
+ "subitem": "xl"
677
+ },
678
+ "path": [
679
+ "size",
680
+ "space",
681
+ "inset",
682
+ "xl"
683
+ ]
684
+ },
685
+ "xxl": {
686
+ "value": "48rem",
687
+ "original": {
688
+ "value": "48px"
689
+ },
690
+ "name": "MdsSizeSpaceInsetXxl",
691
+ "attributes": {
692
+ "category": "size",
693
+ "type": "space",
694
+ "item": "inset",
695
+ "subitem": "xxl"
696
+ },
697
+ "path": [
698
+ "size",
699
+ "space",
700
+ "inset",
701
+ "xxl"
702
+ ]
703
+ },
704
+ "xxxl": {
705
+ "value": "64rem",
706
+ "original": {
707
+ "value": "64px"
708
+ },
709
+ "name": "MdsSizeSpaceInsetXxxl",
710
+ "attributes": {
711
+ "category": "size",
712
+ "type": "space",
713
+ "item": "inset",
714
+ "subitem": "xxxl"
715
+ },
716
+ "path": [
717
+ "size",
718
+ "space",
719
+ "inset",
720
+ "xxxl"
721
+ ]
722
+ },
723
+ "default": {
724
+ "value": "16rem",
725
+ "original": {
726
+ "value": "{size.space.md.value}"
727
+ },
728
+ "name": "MdsSizeSpaceInsetDefault",
729
+ "attributes": {
730
+ "category": "size",
731
+ "type": "space",
732
+ "item": "inset",
733
+ "subitem": "default"
734
+ },
735
+ "path": [
736
+ "size",
737
+ "space",
738
+ "inset",
739
+ "default"
740
+ ]
741
+ }
742
+ }
743
+ },
744
+ "breakpoint": {
745
+ "sm": {
746
+ "value": "0rem",
747
+ "original": {
748
+ "value": "0px"
749
+ },
750
+ "name": "MdsSizeBreakpointSm",
751
+ "attributes": {
752
+ "category": "size",
753
+ "type": "breakpoint",
754
+ "item": "sm"
755
+ },
756
+ "path": [
757
+ "size",
758
+ "breakpoint",
759
+ "sm"
760
+ ]
761
+ },
762
+ "md": {
763
+ "value": "768rem",
764
+ "original": {
765
+ "value": "768px"
766
+ },
767
+ "name": "MdsSizeBreakpointMd",
768
+ "attributes": {
769
+ "category": "size",
770
+ "type": "breakpoint",
771
+ "item": "md"
772
+ },
773
+ "path": [
774
+ "size",
775
+ "breakpoint",
776
+ "md"
777
+ ]
778
+ },
779
+ "lg": {
780
+ "value": "1024rem",
781
+ "original": {
782
+ "value": "1024px"
783
+ },
784
+ "name": "MdsSizeBreakpointLg",
785
+ "attributes": {
786
+ "category": "size",
787
+ "type": "breakpoint",
788
+ "item": "lg"
789
+ },
790
+ "path": [
791
+ "size",
792
+ "breakpoint",
793
+ "lg"
794
+ ]
795
+ }
796
+ },
797
+ "focus": {
798
+ "width": {
799
+ "value": "3rem",
800
+ "original": {
801
+ "value": "3px"
802
+ },
803
+ "name": "MdsSizeFocusWidth",
804
+ "attributes": {
805
+ "category": "size",
806
+ "type": "focus",
807
+ "item": "width"
808
+ },
809
+ "path": [
810
+ "size",
811
+ "focus",
812
+ "width"
813
+ ]
814
+ }
815
+ }
816
+ }
817
+ };
@@ -0,0 +1,123 @@
1
+
2
+ /*
3
+ Do not edit directly
4
+ Generated on Thu, 06 Jun 2019 16:40:50 GMT
5
+ */
6
+
7
+ $mds-color-base: #71767a !default; // Base colour
8
+ $mds-color-white: #ffffff !default;
9
+ $mds-color-black: #000000 !default;
10
+ $mds-color-primary: #2c608a !default;
11
+ $mds-color-secondary: #d83933 !default;
12
+ $mds-color-destructive: #ff0000 !default;
13
+ $mds-color-text-primary: #000000 !default;
14
+ $mds-color-accent-warm: #fa9441 !default;
15
+ $mds-color-accent-cool: #00bde3 !default;
16
+ $mds-color-neutral-15: #262626 !default;
17
+ $mds-color-neutral-20: #323232 !default;
18
+ $mds-color-neutral-30: #4d4d4d !default;
19
+ $mds-color-neutral-53: #888888 !default;
20
+ $mds-color-neutral-95: #f3f1f1 !default;
21
+ $mds-font-family-base: "Helvetica", Arial, sans-serif !default;
22
+ $mds-size-font-xs: 12px !default;
23
+ $mds-size-font-sm: 14px !default;
24
+ $mds-size-font-md: 16px !default;
25
+ $mds-size-font-lg: 20px !default;
26
+ $mds-size-font-xl: 26px !default;
27
+ $mds-size-font-xxl: 46px !default;
28
+ $mds-size-font-base: 16px !default;
29
+ $mds-size-space-none: 0px !default;
30
+ $mds-size-space-xxs: 4px !default;
31
+ $mds-size-space-xs: 8px !default;
32
+ $mds-size-space-sm: 12px !default;
33
+ $mds-size-space-md: 16px !default;
34
+ $mds-size-space-lg: 24px !default;
35
+ $mds-size-space-xl: 32px !default;
36
+ $mds-size-space-xxl: 48px !default;
37
+ $mds-size-space-xxxl: 64px !default;
38
+ $mds-size-space-default: 16px !default;
39
+ $mds-size-space-inset-none: 0px !default;
40
+ $mds-size-space-inset-xxs: 4px !default;
41
+ $mds-size-space-inset-xs: 8px !default;
42
+ $mds-size-space-inset-sm: 12px !default;
43
+ $mds-size-space-inset-md: 16px !default;
44
+ $mds-size-space-inset-lg: 24px !default;
45
+ $mds-size-space-inset-xl: 32px !default;
46
+ $mds-size-space-inset-xxl: 48px !default;
47
+ $mds-size-space-inset-xxxl: 64px !default;
48
+ $mds-size-space-inset-default: 16px !default;
49
+ $mds-size-breakpoint-sm: 0px !default;
50
+ $mds-size-breakpoint-md: 768px !default;
51
+ $mds-size-breakpoint-lg: 1024px !default;
52
+ $mds-size-focus-width: 3px !default;
53
+
54
+ $tokens: (
55
+ 'color': (
56
+ 'base': $mds-color-base,
57
+ 'white': $mds-color-white,
58
+ 'black': $mds-color-black,
59
+ 'primary': $mds-color-primary,
60
+ 'secondary': $mds-color-secondary,
61
+ 'destructive': $mds-color-destructive,
62
+ 'text': (
63
+ 'primary': $mds-color-text-primary
64
+ ),
65
+ 'accent-warm': $mds-color-accent-warm,
66
+ 'accent-cool': $mds-color-accent-cool,
67
+ 'neutral': (
68
+ '15': $mds-color-neutral-15,
69
+ '20': $mds-color-neutral-20,
70
+ '30': $mds-color-neutral-30,
71
+ '53': $mds-color-neutral-53,
72
+ '95': $mds-color-neutral-95
73
+ )
74
+ ),
75
+ 'font': (
76
+ 'family': (
77
+ 'base': $mds-font-family-base
78
+ )
79
+ ),
80
+ 'size': (
81
+ 'font': (
82
+ 'xs': $mds-size-font-xs,
83
+ 'sm': $mds-size-font-sm,
84
+ 'md': $mds-size-font-md,
85
+ 'lg': $mds-size-font-lg,
86
+ 'xl': $mds-size-font-xl,
87
+ 'xxl': $mds-size-font-xxl,
88
+ 'base': $mds-size-font-base
89
+ ),
90
+ 'space': (
91
+ 'none': $mds-size-space-none,
92
+ 'xxs': $mds-size-space-xxs,
93
+ 'xs': $mds-size-space-xs,
94
+ 'sm': $mds-size-space-sm,
95
+ 'md': $mds-size-space-md,
96
+ 'lg': $mds-size-space-lg,
97
+ 'xl': $mds-size-space-xl,
98
+ 'xxl': $mds-size-space-xxl,
99
+ 'xxxl': $mds-size-space-xxxl,
100
+ 'default': $mds-size-space-default,
101
+ 'inset': (
102
+ 'none': $mds-size-space-inset-none,
103
+ 'xxs': $mds-size-space-inset-xxs,
104
+ 'xs': $mds-size-space-inset-xs,
105
+ 'sm': $mds-size-space-inset-sm,
106
+ 'md': $mds-size-space-inset-md,
107
+ 'lg': $mds-size-space-inset-lg,
108
+ 'xl': $mds-size-space-inset-xl,
109
+ 'xxl': $mds-size-space-inset-xxl,
110
+ 'xxxl': $mds-size-space-inset-xxxl,
111
+ 'default': $mds-size-space-inset-default
112
+ )
113
+ ),
114
+ 'breakpoint': (
115
+ 'sm': $mds-size-breakpoint-sm,
116
+ 'md': $mds-size-breakpoint-md,
117
+ 'lg': $mds-size-breakpoint-lg
118
+ ),
119
+ 'focus': (
120
+ 'width': $mds-size-focus-width
121
+ )
122
+ )
123
+ );
@@ -0,0 +1,7 @@
1
+ {
2
+ "compatibleVersion": "1.0",
3
+ "pluginVersion": "1.1",
4
+ "colors": [
5
+ "#71767a"
6
+ ]
7
+ }
@@ -0,0 +1 @@
1
+ [{"name":"bike"},{"name":"camera"}]
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><symbol id="bike" viewBox="0 0 100 100"><path d="M72.918 41.668c-2.082 0-3.957.418-5.625 1.043L62.5 34.793l1.457-3.543h.625c1.25 0 2.082-.832 2.082-2.082s-.832-2.082-2.082-2.082h-6.25c-1.25 0-2.082.832-2.082 2.082s.832 2.082 2.082 2.082h1.043l-.832 2.082H39.582V25H29.164v4.168h6.25V35l-3.75 7.5c-1.457-.625-2.914-.832-4.582-.832-8.125 0-14.582 6.457-14.582 14.582s6.457 14.582 14.582 14.582 14.582-6.457 14.582-14.582c0-5-2.5-9.375-6.25-11.875l2.5-4.793 13.125 18.957h7.5c1.043 7.082 7.082 12.5 14.375 12.5 8.125 0 14.582-6.457 14.582-14.582.004-8.332-6.453-14.789-14.578-14.789zM37.5 56.25c0 5.832-4.582 10.418-10.418 10.418-5.832 0-10.418-4.582-10.418-10.418 0-5.832 4.582-10.418 10.418-10.418.832 0 1.875.207 2.707.418l-4.582 9.168c-.207.207-.207.414-.207.832 0 1.25.832 2.082 2.082 2.082.832 0 1.457-.418 1.875-1.25l4.582-9.168c2.293 2.086 3.96 5.004 3.96 8.336zM63.75 45c-2.707 2.293-4.582 5.418-5.207 9.168h-3.332l5.418-14.375zm2.082 3.543l3.332 5.625h-6.457c.418-2.293 1.668-4.168 3.125-5.625zm-14.375 3.332l-10-14.375h15.625zm21.461 14.793c-5 0-9.168-3.543-10.207-8.332l10.207-.004c1.25 0 2.082-.832 2.082-2.082 0-.418-.207-.832-.418-1.043l-5.207-8.75c1.043-.418 2.293-.625 3.543-.625 5.832 0 10.418 4.582 10.418 10.418-.004 5.832-4.586 10.418-10.418 10.418z"/></symbol><symbol id="camera" viewBox="0 0 100 100"><path d="M56.25 56.25c0 3.453-2.797 6.25-6.25 6.25s-6.25-2.797-6.25-6.25S46.547 50 50 50s6.25 2.797 6.25 6.25"/><path d="M81.25 33.332H64.582L60.414 25H39.582l-4.168 8.332H18.75c-3.543 0-6.25 2.707-6.25 6.25v33.332c0 3.332 2.707 6.25 6.25 6.25h62.5c3.543 0 6.25-2.918 6.25-6.25V39.582c0-3.54-2.707-6.25-6.25-6.25zM50 70.832c-8.125 0-14.582-6.457-14.582-14.582S41.875 41.668 50 41.668s14.582 6.457 14.582 14.582S58.125 70.832 50 70.832z"/></symbol></svg>
@@ -0,0 +1,48 @@
1
+ /*
2
+ Do not edit directly
3
+ Generated on Thu, 06 Jun 2019 16:40:50 GMT
4
+ */
5
+ *,
6
+ *::before,
7
+ *::after {
8
+ box-sizing: border-box;
9
+ }
10
+
11
+ body {
12
+ font-family: "Helvetica", Arial, sans-serif;
13
+ font-size: 16px;
14
+ color: color("base");
15
+ overflow-x: hidden;
16
+ }
17
+
18
+ .mds-button {
19
+ cursor: pointer;
20
+ user-select: none;
21
+ vertical-align: middle;
22
+ white-space: nowrap;
23
+ -webkit-appearance: none;
24
+ border: 1px solid transparent;
25
+ color: #ffffff;
26
+ padding: 8px 12px;
27
+ background-color: #2c608a;
28
+ font-size: 100%;
29
+ width: 100%;
30
+ display: inline-block;
31
+ text-align: center;
32
+ }
33
+
34
+ .mds-button:focus {
35
+ outline: 3px solid 3px;
36
+ outline-offset: 0;
37
+ }
38
+
39
+ @media (min-width: 48em) {
40
+ .mds-button {
41
+ width: auto;
42
+ }
43
+ }
44
+
45
+ .mds-button:link, .mds-button:visited, .mds-button:active, .mds-button:hover {
46
+ color: #ffffff;
47
+ text-decoration: none;
48
+ }
@@ -0,0 +1 @@
1
+ !function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t){console.log("MDS bundle loaded.")}]);
package/package.json CHANGED
@@ -1,16 +1,17 @@
1
1
  {
2
2
  "name": "@madgex/design-system",
3
- "version": "1.3.2",
3
+ "version": "1.3.3",
4
4
  "scripts": {
5
5
  "clean": "rimraf dist public tokens/build",
6
6
  "commit": "commit",
7
- "semantic-release": "semantic-release --prepare && npm run build && semantic-release --publish",
7
+ "semantic-release": "semantic-release --prepare && semantic-release --publish",
8
8
  "tokens": "style-dictionary --config ./src/tokens/_config.js build",
9
9
  "start": "gulp dev",
10
10
  "build": "gulp build",
11
11
  "build:icons": "svgo -f src/icons ./dist/assets/icons",
12
12
  "build:webpack": "NODE_ENV=production webpack",
13
13
  "build:fractal": "NODE_ENV=production fractal build",
14
+ "prepublishOnly": "npm run build",
14
15
  "lint": "eslint .",
15
16
  "lint-fix": "eslint . --fix"
16
17
  },
@@ -20,16 +21,16 @@
20
21
  },
21
22
  "dependencies": {},
22
23
  "devDependencies": {
23
- "@babel/core": "^7.4.4",
24
- "@babel/preset-env": "^7.4.4",
25
- "@commitlint/cli": "^7.6.1",
26
- "@commitlint/config-conventional": "^7.6.0",
27
- "@commitlint/prompt-cli": "^7.6.1",
24
+ "@babel/core": "^7.4.5",
25
+ "@babel/preset-env": "^7.4.5",
26
+ "@commitlint/cli": "^8.0.0",
27
+ "@commitlint/config-conventional": "^8.0.0",
28
+ "@commitlint/prompt-cli": "^8.0.0",
28
29
  "@frctl/fractal": "^1.1.7",
29
30
  "@frctl/mandelbrot": "^1.2.1",
30
31
  "@frctl/nunjucks": "^2.0.1",
31
32
  "@madgex/eslint-config-madgex": "^1.2.0",
32
- "autoprefixer": "^9.5.1",
33
+ "autoprefixer": "^9.6.0",
33
34
  "babel-loader": "^8.0.6",
34
35
  "commitizen": "^3.1.1",
35
36
  "concurrently": "^4.1.0",
@@ -37,7 +38,7 @@
37
38
  "cssnano": "^4.1.10",
38
39
  "cz-conventional-changelog": "^2.1.0",
39
40
  "del": "^4.1.1",
40
- "file-loader": "^3.0.1",
41
+ "file-loader": "^4.0.0",
41
42
  "flat": "^4.1.0",
42
43
  "glob": "^7.1.4",
43
44
  "gulp": "^4.0.2",
@@ -46,24 +47,24 @@
46
47
  "gulp-svgmin": "^2.2.0",
47
48
  "gulp-svgstore": "^7.0.1",
48
49
  "gulp-tap": "^1.0.1",
49
- "husky": "^2.3.0",
50
- "lint-staged": "^8.1.7",
51
- "mini-css-extract-plugin": "^0.6.0",
50
+ "husky": "^2.4.0",
51
+ "lint-staged": "^8.2.0",
52
+ "mini-css-extract-plugin": "^0.7.0",
52
53
  "node-sass": "^4.12.0",
53
- "postcss": "^7.0.16",
54
+ "postcss": "^7.0.17",
54
55
  "postcss-cli": "^6.1.2",
55
56
  "postcss-loader": "^3.0.0",
56
57
  "rimraf": "^2.6.3",
57
58
  "sass-loader": "^7.1.0",
58
59
  "semantic-release": "^15.13.12",
59
- "style-dictionary": "^2.7.0",
60
+ "style-dictionary": "^2.8.0",
60
61
  "style-loader": "^0.23.1",
61
62
  "svg-sprite-loader": "^4.1.6",
62
63
  "svgo": "^1.2.2",
63
64
  "svgo-loader": "^2.2.0",
64
- "webpack": "^4.31.0",
65
+ "webpack": "^4.33.0",
65
66
  "webpack-cli": "^3.3.2",
66
- "webpack-dev-server": "^3.4.0",
67
+ "webpack-dev-server": "^3.7.0",
67
68
  "webpack-stream": "^5.2.1"
68
69
  },
69
70
  "config": {
package/webpack.config.js DELETED
@@ -1,117 +0,0 @@
1
- const path = require('path');
2
- const webpack = require('webpack');
3
- const glob = require('glob');
4
- const MiniCssExtractPlugin = require('mini-css-extract-plugin');
5
- const SpriteLoaderPlugin = require('svg-sprite-loader/plugin');
6
-
7
- const entry = {
8
- common: path.resolve(__dirname, 'src/scripts/common.js'),
9
- };
10
-
11
- // Skip icons if there’s none or Webpack will throw an error
12
- const icons = glob.sync('./src/icons/**/*.svg');
13
- if (icons.length) {
14
- entry.icons = icons;
15
- }
16
-
17
- module.exports = {
18
- mode: process.env.NODE_ENV === 'production' ? 'production' : 'development',
19
- resolve: {
20
- modules: [path.resolve(__dirname, 'src/scripts'), path.resolve(__dirname, 'src'), 'node_modules'],
21
- extensions: ['.js'],
22
- },
23
- entry,
24
- output: {
25
- path: path.resolve(__dirname, 'dist'),
26
- publicPath: '/',
27
- filename: '[name].js',
28
- },
29
- module: {
30
- rules: [
31
- {
32
- test: /\.js$/,
33
- exclude: /node_modules/,
34
- loader: 'babel-loader',
35
- },
36
- {
37
- test: /\.scss$/,
38
- use: [
39
- {
40
- loader: process.env.NODE_ENV === 'production' ? MiniCssExtractPlugin.loader : 'style-loader',
41
- },
42
- 'css-loader',
43
- {
44
- loader: 'postcss-loader',
45
- options: {
46
- plugins: [require('autoprefixer')(), require('cssnano')()],
47
- },
48
- },
49
- {
50
- loader: 'sass-loader',
51
- options: {
52
- includePaths: ['node_modules'],
53
- },
54
- },
55
- ],
56
- },
57
- {
58
- test: /\.(svg|png|jpe?g|gif|woff|woff2|eot|ttf|otf)$/,
59
- exclude: path.resolve('./src/icons'),
60
- use: [
61
- {
62
- loader: 'file-loader',
63
- options: {
64
- name: '[name].[ext]',
65
- outputPath: 'assets/',
66
- },
67
- },
68
- ],
69
- },
70
- {
71
- test: /\.svg$/,
72
- include: path.resolve('./src/icons'),
73
- use: [
74
- {
75
- loader: 'svg-sprite-loader',
76
- options: {
77
- extract: true,
78
- spriteFilename: 'assets/icons/icon-sprite.svg',
79
- // esModule: false,
80
- },
81
- },
82
- 'svgo-loader',
83
- ],
84
- },
85
- ],
86
- },
87
- plugins: [
88
- new MiniCssExtractPlugin({
89
- filename: '[name].css',
90
- }),
91
- new SpriteLoaderPlugin(),
92
- ],
93
- devServer: {
94
- historyApiFallback: true,
95
- compress: true,
96
- proxy: {
97
- '**': 'http://localhost:4000',
98
- },
99
- port: 3000,
100
- stats: {
101
- colors: true,
102
- },
103
- overlay: true,
104
- },
105
- optimization: {
106
- splitChunks: {
107
- cacheGroups: {
108
- styles: {
109
- name: 'styles',
110
- test: /\.css$/,
111
- chunks: 'all',
112
- enforce: true,
113
- },
114
- },
115
- },
116
- },
117
- };