@madgex/design-system 1.57.0 → 1.58.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/.vscode/launch.json +10 -4
- package/coverage/cobertura-coverage.xml +1 -1
- package/coverage/components/accordion/accordion.js.html +1 -1
- package/coverage/components/accordion/index.html +1 -1
- package/coverage/components/inputs/combobox/combobox.js.html +1 -1
- package/coverage/components/inputs/combobox/index.html +1 -1
- package/coverage/components/inputs/combobox/vue-components/Combobox.vue.html +1 -1
- package/coverage/components/inputs/combobox/vue-components/ListBoxOption.vue.html +1 -1
- package/coverage/components/inputs/combobox/vue-components/index.html +1 -1
- package/coverage/components/inputs/file-upload/file-upload.js.html +1 -1
- package/coverage/components/inputs/file-upload/index.html +1 -1
- package/coverage/components/inputs/multi-select/index.html +1 -1
- package/coverage/components/inputs/multi-select/multi-select.js.html +1 -1
- package/coverage/components/inputs/multi-select/vue-components/MultiSelect.vue.html +1 -1
- package/coverage/components/inputs/multi-select/vue-components/MultiSelectCheckbox.vue.html +1 -1
- package/coverage/components/inputs/multi-select/vue-components/MultiSelectCheckboxGroup.vue.html +1 -1
- package/coverage/components/inputs/multi-select/vue-components/index.html +1 -1
- package/coverage/components/inputs/textarea/character-count.js.html +1 -1
- package/coverage/components/inputs/textarea/index.html +1 -1
- package/coverage/components/modal/index.html +1 -1
- package/coverage/components/modal/modal.js.html +1 -1
- package/coverage/components/notification/index.html +1 -1
- package/coverage/components/notification/notification.js.html +1 -1
- package/coverage/components/popover/index.html +1 -1
- package/coverage/components/popover/popover.js.html +1 -1
- package/coverage/components/switch-state/index.html +1 -1
- package/coverage/components/switch-state/switch-state.js.html +1 -1
- package/coverage/components/tabs/index.html +1 -1
- package/coverage/components/tabs/tabs.js.html +1 -1
- package/coverage/index.html +1 -1
- package/coverage/js/common.js.html +1 -1
- package/coverage/js/fractal-scripts/combobox.js.html +1 -1
- package/coverage/js/fractal-scripts/index.html +1 -1
- package/coverage/js/fractal-scripts/notification.js.html +1 -1
- package/coverage/js/fractal-scripts/switch-state.js.html +1 -1
- package/coverage/js/index-fractal.js.html +1 -1
- package/coverage/js/index-polyfills.js.html +1 -1
- package/coverage/js/index-vue.js.html +1 -1
- package/coverage/js/index.html +1 -1
- package/coverage/js/index.js.html +1 -1
- package/coverage/js/polyfills/closest.js.html +1 -1
- package/coverage/js/polyfills/index.html +1 -1
- package/coverage/js/polyfills/remove.js.html +1 -1
- package/coverage/tokens/_config.js.html +1 -1
- package/coverage/tokens/index.html +1 -1
- package/dist/_tokens/css/_tokens.css +12 -1
- package/dist/_tokens/js/_tokens-module.js +224 -1
- package/dist/_tokens/scss/_tokens.scss +28 -2
- package/dist/assets/icons.json +1 -1
- package/dist/css/index.css +1 -1
- package/dist/js/index.js +1 -1
- package/gulpfile.js +4 -1
- package/package.json +4 -1
- package/src/components/button/button.scss +12 -1
- package/src/components/macro-index.njk +24 -0
- package/src/tokens/color.json +34 -0
- package/src/tokens/size.json +3 -0
- package/tasks/createMacroIndex.js +48 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Tue, 01 Sep 2020 13:37:05 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
module.exports = {
|
|
@@ -913,6 +913,210 @@ module.exports = {
|
|
|
913
913
|
"hover"
|
|
914
914
|
]
|
|
915
915
|
}
|
|
916
|
+
},
|
|
917
|
+
"border": {
|
|
918
|
+
"base": {
|
|
919
|
+
"value": "#000000",
|
|
920
|
+
"original": {
|
|
921
|
+
"value": "rgba(0,0,0,0)"
|
|
922
|
+
},
|
|
923
|
+
"name": "MdsColorButtonBorderBase",
|
|
924
|
+
"attributes": {
|
|
925
|
+
"category": "color",
|
|
926
|
+
"type": "button",
|
|
927
|
+
"item": "border",
|
|
928
|
+
"subitem": "base"
|
|
929
|
+
},
|
|
930
|
+
"path": [
|
|
931
|
+
"color",
|
|
932
|
+
"button",
|
|
933
|
+
"border",
|
|
934
|
+
"base"
|
|
935
|
+
]
|
|
936
|
+
},
|
|
937
|
+
"top": {
|
|
938
|
+
"value": "#000000",
|
|
939
|
+
"original": {
|
|
940
|
+
"value": "{color.button.border.base.value}"
|
|
941
|
+
},
|
|
942
|
+
"name": "MdsColorButtonBorderTop",
|
|
943
|
+
"attributes": {
|
|
944
|
+
"category": "color",
|
|
945
|
+
"type": "button",
|
|
946
|
+
"item": "border",
|
|
947
|
+
"subitem": "top"
|
|
948
|
+
},
|
|
949
|
+
"path": [
|
|
950
|
+
"color",
|
|
951
|
+
"button",
|
|
952
|
+
"border",
|
|
953
|
+
"top"
|
|
954
|
+
]
|
|
955
|
+
},
|
|
956
|
+
"right": {
|
|
957
|
+
"value": "#000000",
|
|
958
|
+
"original": {
|
|
959
|
+
"value": "{color.button.border.base.value}"
|
|
960
|
+
},
|
|
961
|
+
"name": "MdsColorButtonBorderRight",
|
|
962
|
+
"attributes": {
|
|
963
|
+
"category": "color",
|
|
964
|
+
"type": "button",
|
|
965
|
+
"item": "border",
|
|
966
|
+
"subitem": "right"
|
|
967
|
+
},
|
|
968
|
+
"path": [
|
|
969
|
+
"color",
|
|
970
|
+
"button",
|
|
971
|
+
"border",
|
|
972
|
+
"right"
|
|
973
|
+
]
|
|
974
|
+
},
|
|
975
|
+
"bottom": {
|
|
976
|
+
"value": "#000000",
|
|
977
|
+
"original": {
|
|
978
|
+
"value": "{color.button.border.base.value}"
|
|
979
|
+
},
|
|
980
|
+
"name": "MdsColorButtonBorderBottom",
|
|
981
|
+
"attributes": {
|
|
982
|
+
"category": "color",
|
|
983
|
+
"type": "button",
|
|
984
|
+
"item": "border",
|
|
985
|
+
"subitem": "bottom"
|
|
986
|
+
},
|
|
987
|
+
"path": [
|
|
988
|
+
"color",
|
|
989
|
+
"button",
|
|
990
|
+
"border",
|
|
991
|
+
"bottom"
|
|
992
|
+
]
|
|
993
|
+
},
|
|
994
|
+
"left": {
|
|
995
|
+
"value": "#000000",
|
|
996
|
+
"original": {
|
|
997
|
+
"value": "{color.button.border.base.value}"
|
|
998
|
+
},
|
|
999
|
+
"name": "MdsColorButtonBorderLeft",
|
|
1000
|
+
"attributes": {
|
|
1001
|
+
"category": "color",
|
|
1002
|
+
"type": "button",
|
|
1003
|
+
"item": "border",
|
|
1004
|
+
"subitem": "left"
|
|
1005
|
+
},
|
|
1006
|
+
"path": [
|
|
1007
|
+
"color",
|
|
1008
|
+
"button",
|
|
1009
|
+
"border",
|
|
1010
|
+
"left"
|
|
1011
|
+
]
|
|
1012
|
+
},
|
|
1013
|
+
"hover": {
|
|
1014
|
+
"base": {
|
|
1015
|
+
"value": "#000000",
|
|
1016
|
+
"original": {
|
|
1017
|
+
"value": "{color.button.border.base.value}"
|
|
1018
|
+
},
|
|
1019
|
+
"name": "MdsColorButtonBorderHoverBase",
|
|
1020
|
+
"attributes": {
|
|
1021
|
+
"category": "color",
|
|
1022
|
+
"type": "button",
|
|
1023
|
+
"item": "border",
|
|
1024
|
+
"subitem": "hover",
|
|
1025
|
+
"state": "base"
|
|
1026
|
+
},
|
|
1027
|
+
"path": [
|
|
1028
|
+
"color",
|
|
1029
|
+
"button",
|
|
1030
|
+
"border",
|
|
1031
|
+
"hover",
|
|
1032
|
+
"base"
|
|
1033
|
+
]
|
|
1034
|
+
},
|
|
1035
|
+
"top": {
|
|
1036
|
+
"value": "#000000",
|
|
1037
|
+
"original": {
|
|
1038
|
+
"value": "{color.button.border.hover.base.value}"
|
|
1039
|
+
},
|
|
1040
|
+
"name": "MdsColorButtonBorderHoverTop",
|
|
1041
|
+
"attributes": {
|
|
1042
|
+
"category": "color",
|
|
1043
|
+
"type": "button",
|
|
1044
|
+
"item": "border",
|
|
1045
|
+
"subitem": "hover",
|
|
1046
|
+
"state": "top"
|
|
1047
|
+
},
|
|
1048
|
+
"path": [
|
|
1049
|
+
"color",
|
|
1050
|
+
"button",
|
|
1051
|
+
"border",
|
|
1052
|
+
"hover",
|
|
1053
|
+
"top"
|
|
1054
|
+
]
|
|
1055
|
+
},
|
|
1056
|
+
"right": {
|
|
1057
|
+
"value": "#000000",
|
|
1058
|
+
"original": {
|
|
1059
|
+
"value": "{color.button.border.hover.base.value}"
|
|
1060
|
+
},
|
|
1061
|
+
"name": "MdsColorButtonBorderHoverRight",
|
|
1062
|
+
"attributes": {
|
|
1063
|
+
"category": "color",
|
|
1064
|
+
"type": "button",
|
|
1065
|
+
"item": "border",
|
|
1066
|
+
"subitem": "hover",
|
|
1067
|
+
"state": "right"
|
|
1068
|
+
},
|
|
1069
|
+
"path": [
|
|
1070
|
+
"color",
|
|
1071
|
+
"button",
|
|
1072
|
+
"border",
|
|
1073
|
+
"hover",
|
|
1074
|
+
"right"
|
|
1075
|
+
]
|
|
1076
|
+
},
|
|
1077
|
+
"bottom": {
|
|
1078
|
+
"value": "#000000",
|
|
1079
|
+
"original": {
|
|
1080
|
+
"value": "{color.button.border.hover.base.value}"
|
|
1081
|
+
},
|
|
1082
|
+
"name": "MdsColorButtonBorderHoverBottom",
|
|
1083
|
+
"attributes": {
|
|
1084
|
+
"category": "color",
|
|
1085
|
+
"type": "button",
|
|
1086
|
+
"item": "border",
|
|
1087
|
+
"subitem": "hover",
|
|
1088
|
+
"state": "bottom"
|
|
1089
|
+
},
|
|
1090
|
+
"path": [
|
|
1091
|
+
"color",
|
|
1092
|
+
"button",
|
|
1093
|
+
"border",
|
|
1094
|
+
"hover",
|
|
1095
|
+
"bottom"
|
|
1096
|
+
]
|
|
1097
|
+
},
|
|
1098
|
+
"left": {
|
|
1099
|
+
"value": "#000000",
|
|
1100
|
+
"original": {
|
|
1101
|
+
"value": "{color.button.border.hover.base.value}"
|
|
1102
|
+
},
|
|
1103
|
+
"name": "MdsColorButtonBorderHoverLeft",
|
|
1104
|
+
"attributes": {
|
|
1105
|
+
"category": "color",
|
|
1106
|
+
"type": "button",
|
|
1107
|
+
"item": "border",
|
|
1108
|
+
"subitem": "hover",
|
|
1109
|
+
"state": "left"
|
|
1110
|
+
},
|
|
1111
|
+
"path": [
|
|
1112
|
+
"color",
|
|
1113
|
+
"button",
|
|
1114
|
+
"border",
|
|
1115
|
+
"hover",
|
|
1116
|
+
"left"
|
|
1117
|
+
]
|
|
1118
|
+
}
|
|
1119
|
+
}
|
|
916
1120
|
}
|
|
917
1121
|
},
|
|
918
1122
|
"link": {
|
|
@@ -3586,6 +3790,25 @@ module.exports = {
|
|
|
3586
3790
|
"border",
|
|
3587
3791
|
"radius"
|
|
3588
3792
|
]
|
|
3793
|
+
},
|
|
3794
|
+
"width": {
|
|
3795
|
+
"value": "1rem",
|
|
3796
|
+
"original": {
|
|
3797
|
+
"value": "{size.border.width.value}"
|
|
3798
|
+
},
|
|
3799
|
+
"name": "MdsSizeButtonBorderWidth",
|
|
3800
|
+
"attributes": {
|
|
3801
|
+
"category": "size",
|
|
3802
|
+
"type": "button",
|
|
3803
|
+
"item": "border",
|
|
3804
|
+
"subitem": "width"
|
|
3805
|
+
},
|
|
3806
|
+
"path": [
|
|
3807
|
+
"size",
|
|
3808
|
+
"button",
|
|
3809
|
+
"border",
|
|
3810
|
+
"width"
|
|
3811
|
+
]
|
|
3589
3812
|
}
|
|
3590
3813
|
}
|
|
3591
3814
|
},
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
3
|
Do not edit directly
|
|
4
|
-
Generated on
|
|
4
|
+
Generated on Tue, 01 Sep 2020 13:37:04 GMT
|
|
5
5
|
*/
|
|
6
6
|
|
|
7
7
|
$mds-color-brand-1-light: #2990e0 !default;
|
|
@@ -52,6 +52,16 @@ $mds-color-button-bg-base: #fa7c1e !default;
|
|
|
52
52
|
$mds-color-button-bg-hover: #fb9950 !default;
|
|
53
53
|
$mds-color-button-text-base: #ffffff !default;
|
|
54
54
|
$mds-color-button-text-hover: #ffffff !default;
|
|
55
|
+
$mds-color-button-border-base: rgba(0, 0, 0, 0) !default;
|
|
56
|
+
$mds-color-button-border-top: rgba(0, 0, 0, 0) !default;
|
|
57
|
+
$mds-color-button-border-right: rgba(0, 0, 0, 0) !default;
|
|
58
|
+
$mds-color-button-border-bottom: rgba(0, 0, 0, 0) !default;
|
|
59
|
+
$mds-color-button-border-left: rgba(0, 0, 0, 0) !default;
|
|
60
|
+
$mds-color-button-border-hover-base: rgba(0, 0, 0, 0) !default;
|
|
61
|
+
$mds-color-button-border-hover-top: rgba(0, 0, 0, 0) !default;
|
|
62
|
+
$mds-color-button-border-hover-right: rgba(0, 0, 0, 0) !default;
|
|
63
|
+
$mds-color-button-border-hover-bottom: rgba(0, 0, 0, 0) !default;
|
|
64
|
+
$mds-color-button-border-hover-left: rgba(0, 0, 0, 0) !default;
|
|
55
65
|
$mds-color-link-base: #1b75bb !default;
|
|
56
66
|
$mds-color-link-hover: #15598e !default;
|
|
57
67
|
$mds-color-box-shadow-base: 0 2px 5px 0 #dddddd !default;
|
|
@@ -178,6 +188,7 @@ $mds-size-surface-padding: 16px !default;
|
|
|
178
188
|
$mds-size-main-padding: 0 !default;
|
|
179
189
|
$mds-size-main-margin: 0 !default;
|
|
180
190
|
$mds-size-button-border-radius: 4px !default;
|
|
191
|
+
$mds-size-button-border-width: 1px !default;
|
|
181
192
|
$mds-size-icon-default: 1em !default;
|
|
182
193
|
$mds-size-icon-sm: 16px !default;
|
|
183
194
|
$mds-size-icon-md: 24px !default;
|
|
@@ -259,6 +270,20 @@ $tokens: (
|
|
|
259
270
|
'text': (
|
|
260
271
|
'base': $mds-color-button-text-base,
|
|
261
272
|
'hover': $mds-color-button-text-hover
|
|
273
|
+
),
|
|
274
|
+
'border': (
|
|
275
|
+
'base': $mds-color-button-border-base,
|
|
276
|
+
'top': $mds-color-button-border-top,
|
|
277
|
+
'right': $mds-color-button-border-right,
|
|
278
|
+
'bottom': $mds-color-button-border-bottom,
|
|
279
|
+
'left': $mds-color-button-border-left,
|
|
280
|
+
'hover': (
|
|
281
|
+
'base': $mds-color-button-border-hover-base,
|
|
282
|
+
'top': $mds-color-button-border-hover-top,
|
|
283
|
+
'right': $mds-color-button-border-hover-right,
|
|
284
|
+
'bottom': $mds-color-button-border-hover-bottom,
|
|
285
|
+
'left': $mds-color-button-border-hover-left
|
|
286
|
+
)
|
|
262
287
|
)
|
|
263
288
|
),
|
|
264
289
|
'link': (
|
|
@@ -542,7 +567,8 @@ $tokens: (
|
|
|
542
567
|
),
|
|
543
568
|
'button': (
|
|
544
569
|
'border': (
|
|
545
|
-
'radius': $mds-size-button-border-radius
|
|
570
|
+
'radius': $mds-size-button-border-radius,
|
|
571
|
+
'width': $mds-size-button-border-width
|
|
546
572
|
)
|
|
547
573
|
),
|
|
548
574
|
'icon': (
|
package/dist/assets/icons.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
[{"name":"check"},{"name":"chevron-down"},{"name":"chevron-left"},{"name":"chevron-
|
|
1
|
+
[{"name":"check"},{"name":"chevron-down"},{"name":"chevron-left"},{"name":"chevron-right"},{"name":"chevron-up"},{"name":"close"},{"name":"cross"},{"name":"doc-pdf"},{"name":"doc"},{"name":"email"},{"name":"job"},{"name":"location-pin"},{"name":"menu"},{"name":"minus"},{"name":"plus-small"},{"name":"plus"},{"name":"question-mark"},{"name":"search"},{"name":"social-facebook"},{"name":"social-linkedin"},{"name":"social-twitter"},{"name":"spinner"},{"name":"star-fill"},{"name":"star-outline"},{"name":"upload"},{"name":"user"}]
|