@madgex/design-system 1.11.0 → 1.13.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.
Files changed (35) hide show
  1. package/dist/_tokens/css/_tokens.css +16 -8
  2. package/dist/_tokens/js/_tokens-module.js +219 -69
  3. package/dist/_tokens/scss/_tokens.scss +38 -14
  4. package/dist/css/index.css +2848 -2303
  5. package/fractal-theme/assets/css/styles.css +14 -1
  6. package/package.json +5 -5
  7. package/src/components/button/button.scss +10 -6
  8. package/src/components/tabs/tabs.scss +6 -6
  9. package/src/helpers/borders/README.md +26 -0
  10. package/src/helpers/borders/borders.njk +13 -0
  11. package/src/helpers/display/README.md +8 -0
  12. package/src/helpers/display/display.njk +14 -0
  13. package/src/helpers/floats/README.md +8 -0
  14. package/src/helpers/floats/floats.njk +5 -0
  15. package/src/helpers/text-align/README.md +8 -0
  16. package/src/helpers/text-align/text-align.njk +4 -0
  17. package/src/layout/containers/README.md +6 -0
  18. package/src/layout/containers/containers.njk +13 -0
  19. package/src/scss/core/__index.scss +1 -0
  20. package/src/scss/core/_containers.scss +31 -0
  21. package/src/scss/core/_defaults.scss +16 -6
  22. package/src/scss/helpers/__index.scss +4 -0
  23. package/src/scss/helpers/_borders.scss +100 -0
  24. package/src/scss/helpers/_display.scss +35 -0
  25. package/src/scss/helpers/_floats.scss +18 -0
  26. package/src/scss/helpers/_text-align.scss +18 -0
  27. package/src/scss/index.scss +3 -2
  28. package/src/scss/resets/__index.scss +96 -0
  29. package/src/scss/utilities/_mixins.scss +24 -0
  30. package/src/scss/vendor/_normalize.scss +0 -10
  31. package/src/tokens/color.json +62 -53
  32. package/src/tokens/size.json +30 -3
  33. package/src/typography/lists.njk +9 -3
  34. /package/src/{layout → helpers}/spacing/README.md +0 -0
  35. /package/src/{layout → helpers}/spacing/spacing.njk +0 -0
package/src/tokens/color.json CHANGED
@@ -1,77 +1,86 @@
1
1
  {
2
2
  "color": {
3
3
  "brand": {
4
- "1" : {
5
- "base": { "value" : "#1B75BB" },
6
- "light": {
7
- "value" : "#2990e0",
8
- "scssColorFunction" : "lighten($mds-color-brand-1-base,10%)"
9
- },
10
- "lightest" : {
11
- "value" : "#e9f3fc",
12
- "scssColorFunction" : "lighten($mds-color-brand-1-base,(95% - lightness($mds-color-brand-1-base)))"
4
+ "1": {
5
+ "base": { "value": "#1B75BB" },
6
+ "light": {
7
+ "value": "#2990e0",
8
+ "scssColorFunction": "lighten($mds-color-brand-1-base,10%)"
13
9
  },
14
- "dark" : {
15
- "value" : "#15598e",
16
- "scssColorFunction" : "darken($mds-color-brand-1-base,10%)"
10
+ "lightest": {
11
+ "value": "#e9f3fc",
12
+ "scssColorFunction": "lighten($mds-color-brand-1-base,(95% - lightness($mds-color-brand-1-base)))"
17
13
  },
18
- "darkest" : {
19
- "value" : "#082135",
20
- "scssColorFunction" : "darken($mds-color-brand-1-base,(lightness($mds-color-brand-1-base) - 12%))"
14
+ "dark": {
15
+ "value": "#15598e",
16
+ "scssColorFunction": "darken($mds-color-brand-1-base,10%)"
17
+ },
18
+ "darkest": {
19
+ "value": "#082135",
20
+ "scssColorFunction": "darken($mds-color-brand-1-base,(lightness($mds-color-brand-1-base) - 12%))"
21
21
  }
22
22
  },
23
- "2" : {
24
- "base": { "value" : "#f0af11" },
25
- "light": {
26
- "value" : "#f3bf41",
27
- "scssColorFunction" : "lighten($mds-color-brand-2-base,10%)"
28
- },
29
- "lightest" : {
30
- "value" : "#fdf7e7",
31
- "scssColorFunction" : "lighten($mds-color-brand-2-base,(95% - lightness($mds-color-brand-2-base)))"
23
+ "2": {
24
+ "base": { "value": "#f0af11" },
25
+ "light": {
26
+ "scssColorFunction": "lighten($mds-color-brand-2-base,10%)",
27
+ "value": "{color.brand.2.base.value}"
28
+ },
29
+ "lightest": {
30
+ "value": "#fdf7e7",
31
+ "scssColorFunction": "lighten($mds-color-brand-2-base,(95% - lightness($mds-color-brand-2-base)))"
32
32
  },
33
- "dark" : {
34
- "value" : "#c28d0c",
35
- "scssColorFunction" : "darken($mds-color-brand-2-base,10%)"
33
+ "dark": {
34
+ "value": "#c28d0c",
35
+ "scssColorFunction": "darken($mds-color-brand-2-base,10%)"
36
36
  },
37
- "darkest" : {
38
- "value" : "#3a2a04",
39
- "scssColorFunction" : "darken($mds-color-brand-2-base,(lightness($mds-color-brand-2-base) - 12%))"
37
+ "darkest": {
38
+ "value": "#3a2a04",
39
+ "scssColorFunction": "darken($mds-color-brand-2-base,(lightness($mds-color-brand-2-base) - 12%))"
40
40
  }
41
41
  },
42
- "3" : {
43
- "base": { "value" : "#16C1B4" },
44
- "light": {
45
- "value" : "#24e6d7",
46
- "scssColorFunction" : "lighten($mds-color-brand-3-base,10%)"
47
- },
48
- "lightest" : {
49
- "value" : "#e8fcfb",
50
- "scssColorFunction" : "lighten($mds-color-brand-3-base,(95% - lightness($mds-color-brand-3-base)))"
42
+ "3": {
43
+ "base": { "value": "#16C1B4" },
44
+ "light": {
45
+ "value": "#24e6d7",
46
+ "scssColorFunction": "lighten($mds-color-brand-3-base,10%)"
51
47
  },
52
- "dark" : {
53
- "value" : "#119389",
54
- "scssColorFunction" : "darken($mds-color-brand-3-base,10%)"
48
+ "lightest": {
49
+ "value": "#e8fcfb",
50
+ "scssColorFunction": "lighten($mds-color-brand-3-base,(95% - lightness($mds-color-brand-3-base)))"
55
51
  },
56
- "darkest" : {
57
- "value" : "#063733",
58
- "scssColorFunction" : "darken($mds-color-brand-3-base,(lightness($mds-color-brand-3-base) - 12%))"
52
+ "dark": {
53
+ "value": "#119389",
54
+ "scssColorFunction": "darken($mds-color-brand-3-base,10%)"
55
+ },
56
+ "darkest": {
57
+ "value": "#063733",
58
+ "scssColorFunction": "darken($mds-color-brand-3-base,(lightness($mds-color-brand-3-base) - 12%))"
59
59
  }
60
60
  }
61
61
  },
62
- "background" : {
63
- "body" : { "value" : "{color.background.site-container.value}" },
64
- "site-container" : { "value" : "#f0f0f0" },
65
- "surface" : { "value" : "#ffffff" }
62
+ "background": {
63
+ "body": { "value": "{color.neutral.white.value}" },
64
+ "site-container": { "value": "{color.neutral.lightest.value}" },
65
+ "surface": { "value": "{color.neutral.white.value}" }
66
66
  },
67
- "text" : { "value" : "#222" },
68
- "border" : { "value" : "{color.neutral.base.value}" },
69
- "white": { "value": "#FFFFFF" },
70
- "black": { "value": "#000000" },
71
67
  "neutral": {
68
+ "white": { "value": "#FFFFFF" },
69
+ "black": { "value": "#000000" },
72
70
  "base": { "value": "#979797" },
73
71
  "lightest": { "value": "#F0F0F0" },
74
72
  "darker": { "value": "#333333" }
73
+ },
74
+ "text": {
75
+ "base": {
76
+ "value": "#222"
77
+ },
78
+ "invert": {
79
+ "value": "{color.neutral.white.value}"
80
+ }
81
+ },
82
+ "border": {
83
+ "value": "{color.neutral.base.value}"
75
84
  }
76
85
  }
77
86
  }
package/src/tokens/size.json CHANGED
@@ -12,9 +12,36 @@
12
12
  "value": "1px"
13
13
  },
14
14
  "radius": {
15
- "value": "3px"
15
+ "value": "4px"
16
16
  }
17
17
  },
18
- "gutter-width": { "value" : "20px" }
18
+ "gutter-width": { "value": "20px" },
19
+ "container": {
20
+ "width": {
21
+ "value": "100%"
22
+ },
23
+ "min-width": {
24
+ "value": "0"
25
+ },
26
+ "max-width": {
27
+ "value": "100%"
28
+ }
29
+ },
30
+ "wrapper": {
31
+ "width": {
32
+ "value": "100%"
33
+ },
34
+ "max-width": {
35
+ "value": "1280px"
36
+ },
37
+ "padding": {
38
+ "value": "2.5%"
39
+ }
40
+ },
41
+ "surface": {
42
+ "padding": {
43
+ "value": "20px"
44
+ }
45
+ }
19
46
  }
20
- }
47
+ }
package/src/typography/lists.njk CHANGED
@@ -1,8 +1,14 @@
1
1
  <h2>Unordered list</h2>
2
2
  <ul class="mds-list mds-list--bullet">
3
- <li class="mds-list__item">one</li>
4
- <li class="mds-list__item">two</li>
5
- <li class="mds-list__item">three</li>
3
+ <li class="mds-list__item">
4
+ <a href="#one">one</a>
5
+ </li>
6
+ <li class="mds-list__item">
7
+ <a href="#two">two</a>
8
+ </li>
9
+ <li class="mds-list__item">
10
+ <a href="#three">three</a>
11
+ </li>
6
12
  </ul>
7
13
 
8
14
  <h2>Ordered list</h2>
/package/src/{layout → helpers}/spacing/README.md RENAMED
File without changes
/package/src/{layout → helpers}/spacing/spacing.njk RENAMED
File without changes