orbit-ds-variables 1.0.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 (39) hide show
  1. package/README.md +174 -0
  2. package/dist/css/platforms/desktop/variables.css +100 -0
  3. package/dist/css/platforms/ipad/variables.css +100 -0
  4. package/dist/css/platforms/web/variables.css +100 -0
  5. package/dist/css/primitives/variables.css +91 -0
  6. package/dist/css/themes/d-green/index.css +3 -0
  7. package/dist/css/themes/d-green/variables.css +93 -0
  8. package/dist/css/themes/d-grey/index.css +3 -0
  9. package/dist/css/themes/d-grey/variables.css +93 -0
  10. package/dist/css/themes/n-blue/index.css +3 -0
  11. package/dist/css/themes/n-blue/variables.css +93 -0
  12. package/dist/css/themes/n-green/index.css +3 -0
  13. package/dist/css/themes/n-green/variables.css +93 -0
  14. package/dist/css/themes/n-grey/index.css +3 -0
  15. package/dist/css/themes/n-grey/variables.css +93 -0
  16. package/dist/scss/_index.scss +10 -0
  17. package/dist/scss/platforms/desktop/_variables.scss +97 -0
  18. package/dist/scss/platforms/ipad/_variables.scss +97 -0
  19. package/dist/scss/platforms/web/_variables.scss +97 -0
  20. package/dist/scss/primitives/_variables.scss +88 -0
  21. package/dist/scss/themes/d-green/_variables.scss +90 -0
  22. package/dist/scss/themes/d-grey/_variables.scss +90 -0
  23. package/dist/scss/themes/n-blue/_variables.scss +90 -0
  24. package/dist/scss/themes/n-green/_variables.scss +90 -0
  25. package/dist/scss/themes/n-grey/_variables.scss +90 -0
  26. package/dist/tailwind/index.js +13 -0
  27. package/dist/tailwind/platforms/desktop/theme.js +88 -0
  28. package/dist/tailwind/platforms/desktop/tokens.js +141 -0
  29. package/dist/tailwind/platforms/ipad/theme.js +88 -0
  30. package/dist/tailwind/platforms/ipad/tokens.js +141 -0
  31. package/dist/tailwind/platforms/web/theme.js +88 -0
  32. package/dist/tailwind/platforms/web/tokens.js +141 -0
  33. package/dist/tailwind/primitives/colors.js +112 -0
  34. package/dist/tailwind/themes/d-green/colors.js +120 -0
  35. package/dist/tailwind/themes/d-grey/colors.js +120 -0
  36. package/dist/tailwind/themes/n-blue/colors.js +120 -0
  37. package/dist/tailwind/themes/n-green/colors.js +120 -0
  38. package/dist/tailwind/themes/n-grey/colors.js +120 -0
  39. package/package.json +32 -0
@@ -0,0 +1,88 @@
1
+ // Auto-generated from tokens.json — do not edit directly.
2
+ // Tailwind theme.extend for desktop
3
+
4
+ export default {
5
+ "spacing": {
6
+ "0": "0px",
7
+ "l": "18px",
8
+ "m": "12px",
9
+ "s": "8px",
10
+ "xs": "4px",
11
+ "xl": "24px",
12
+ "xxl": "36px",
13
+ "xxs": "2px",
14
+ "ml": "16px",
15
+ "small": "18px",
16
+ "default": "26px",
17
+ "big": "36px"
18
+ },
19
+ "borderRadius": {
20
+ "s": "4px",
21
+ "m": "8px",
22
+ "l": "12px",
23
+ "card": "8px",
24
+ "input": "4px",
25
+ "section": "8px",
26
+ "action-menu": "4px",
27
+ "popup-message": "8px",
28
+ "xl": "24px",
29
+ "chip": "24px",
30
+ "chip-squared": "4px"
31
+ },
32
+ "fontSize": {
33
+ "body": "14px",
34
+ "body-small": "12px",
35
+ "title-3": "22px",
36
+ "title-2": "28px",
37
+ "title-1": "38px",
38
+ "body-input": "14px",
39
+ "title-4": "14px",
40
+ "comment": "14px",
41
+ "title-5": "14px",
42
+ "title-6": "14px",
43
+ "body-big": "17px"
44
+ },
45
+ "fontWeight": {
46
+ "body": "Medium",
47
+ "comment": "Regular",
48
+ "body-small": "Medium",
49
+ "title": "Bold",
50
+ "body-input": "Medium",
51
+ "body-big": "Medium"
52
+ },
53
+ "lineHeight": {
54
+ "title-1": "44px",
55
+ "title-2": "32px",
56
+ "title-3": "26px",
57
+ "body": "20px",
58
+ "body-small": "16px",
59
+ "body-input": "14px",
60
+ "title-4": "20px",
61
+ "comment": "22px",
62
+ "title-5": "20px",
63
+ "title-6": "20px",
64
+ "body-big": "17px"
65
+ },
66
+ "letterSpacing": {
67
+ "title-4": "24px"
68
+ },
69
+ "extend": {
70
+ "compact-height": "24px",
71
+ "default": "36px",
72
+ "min-height-textarea": "128px",
73
+ "border-width": "1px",
74
+ "min-width---hidden": "84px",
75
+ "min-width-compact---hidden": "66px",
76
+ "top-offset": "8px",
77
+ "nested-option-offset": "32px",
78
+ "compact-min-width": "24px",
79
+ "header": "36px",
80
+ "toolbar": "40px",
81
+ "action-menu": "36px",
82
+ "horizontal": "72px",
83
+ "split-view": "45px",
84
+ "vertical": "60px",
85
+ "height-default": "32px",
86
+ "height-compact": "26px"
87
+ }
88
+ };
@@ -0,0 +1,141 @@
1
+ // Auto-generated from tokens.json — do not edit directly.
2
+ // Platform: desktop
3
+
4
+ export default {
5
+ "font": {
6
+ "font-weight": {
7
+ "body": "Medium",
8
+ "comment": "Regular",
9
+ "body-small": "Medium",
10
+ "title": "Bold",
11
+ "body-input": "Medium",
12
+ "body-big": "Medium"
13
+ },
14
+ "letter-spacing": {
15
+ "title-4": "24"
16
+ },
17
+ "font-size": {
18
+ "body": 14,
19
+ "body-small": 12,
20
+ "title-3": 22,
21
+ "title-2": 28,
22
+ "title-1": 38,
23
+ "body-input": 14,
24
+ "title-4": 14,
25
+ "comment": 14,
26
+ "title-5": 14,
27
+ "title-6": 14,
28
+ "body-big": 17
29
+ },
30
+ "line-height": {
31
+ "title-1": 44,
32
+ "title-2": 32,
33
+ "title-3": 26,
34
+ "body": 20,
35
+ "body-small": 16,
36
+ "body-input": 14,
37
+ "title-4": 20,
38
+ "comment": 22,
39
+ "title-5": 20,
40
+ "title-6": 20,
41
+ "body-big": 17
42
+ }
43
+ },
44
+ "platform": "Web",
45
+ "icon": {
46
+ "default": 24,
47
+ "small": 18,
48
+ "big": 36
49
+ },
50
+ "gap": {
51
+ "0": 0,
52
+ "l": 18,
53
+ "m": 12,
54
+ "s": 6,
55
+ "xs": 4,
56
+ "xl": 24,
57
+ "xxl": 36,
58
+ "xxs": 2,
59
+ "ml": 16
60
+ },
61
+ "components": {
62
+ "input-button-select": {
63
+ "compact-height": 24,
64
+ "default": 36,
65
+ "min-height-textarea": 128,
66
+ "border-width": 1,
67
+ "min-width---hidden": 84,
68
+ "min-width-compact---hidden": 66,
69
+ "top-offset": 8,
70
+ "nested-option-offset": 32,
71
+ "compact-min-width": 24
72
+ },
73
+ "titles-and-tabs": {
74
+ "header": 36
75
+ },
76
+ "toolbar": {
77
+ "toolbar": 40
78
+ },
79
+ "action-menu-item": {
80
+ "action-menu": 36
81
+ },
82
+ "ewas-nav-item": {
83
+ "height": {
84
+ "horizontal": 55,
85
+ "split-view": 55,
86
+ "vertical": 55
87
+ },
88
+ "width": {
89
+ "horizontal": 72,
90
+ "split-view": 45,
91
+ "vertical": 60
92
+ }
93
+ },
94
+ "chip": {
95
+ "height-default": 32,
96
+ "height-compact": 26
97
+ }
98
+ },
99
+ "radius": {
100
+ "s": 4,
101
+ "m": 8,
102
+ "l": 12,
103
+ "card": 8,
104
+ "input": 4,
105
+ "section": 8,
106
+ "action-menu": 4,
107
+ "popup-message": 8,
108
+ "xl": 24,
109
+ "chip": 24,
110
+ "chip-squared": 4
111
+ },
112
+ "padding": {
113
+ "vertical": {
114
+ "0": 0,
115
+ "xs": 4,
116
+ "s": 8,
117
+ "m": 12,
118
+ "l": 18,
119
+ "xl": 24,
120
+ "xxl": 36,
121
+ "xxs": 2,
122
+ "ml": 16
123
+ },
124
+ "horizontal": {
125
+ "0": 0,
126
+ "xs": 4,
127
+ "s": 8,
128
+ "m": 12,
129
+ "l": 18,
130
+ "xl": 24,
131
+ "xxl": 36,
132
+ "xxs": 2,
133
+ "ml": 16
134
+ }
135
+ },
136
+ "icon-frame-size": {
137
+ "small": 18,
138
+ "default": 26,
139
+ "big": 36
140
+ }
141
+ };
@@ -0,0 +1,88 @@
1
+ // Auto-generated from tokens.json — do not edit directly.
2
+ // Tailwind theme.extend for ipad
3
+
4
+ export default {
5
+ "spacing": {
6
+ "0": "0px",
7
+ "l": "18px",
8
+ "m": "12px",
9
+ "s": "8px",
10
+ "xs": "4px",
11
+ "xl": "24px",
12
+ "xxl": "36px",
13
+ "xxs": "2px",
14
+ "ml": "16px",
15
+ "small": "24px",
16
+ "default": "44px",
17
+ "big": "48px"
18
+ },
19
+ "borderRadius": {
20
+ "s": "4px",
21
+ "m": "8px",
22
+ "l": "12px",
23
+ "card": "10px",
24
+ "input": "6px",
25
+ "section": "10px",
26
+ "action-menu": "6px",
27
+ "popup-message": "10px",
28
+ "xl": "24px",
29
+ "chip": "36px",
30
+ "chip-squared": "6px"
31
+ },
32
+ "fontSize": {
33
+ "body": "13px",
34
+ "body-small": "11px",
35
+ "title-3": "18px",
36
+ "title-2": "24px",
37
+ "title-1": "36px",
38
+ "body-input": "13px",
39
+ "title-4": "13px",
40
+ "comment": "13px",
41
+ "title-5": "13px",
42
+ "title-6": "13px",
43
+ "body-big": "17px"
44
+ },
45
+ "fontWeight": {
46
+ "body": "Medium",
47
+ "comment": "Regular",
48
+ "body-small": "Medium",
49
+ "title": "Bold",
50
+ "body-input": "Semi Bold",
51
+ "body-big": "Medium"
52
+ },
53
+ "lineHeight": {
54
+ "title-1": "46px",
55
+ "title-2": "38px",
56
+ "title-3": "28px",
57
+ "body": "26px",
58
+ "body-small": "20px",
59
+ "body-input": "17px",
60
+ "title-4": "22px",
61
+ "comment": "26px",
62
+ "title-5": "22px",
63
+ "title-6": "22px",
64
+ "body-big": "17px"
65
+ },
66
+ "letterSpacing": {
67
+ "title-4": "24px"
68
+ },
69
+ "extend": {
70
+ "compact-height": "32px",
71
+ "default": "48px",
72
+ "min-height-textarea": "160px",
73
+ "border-width": "1px",
74
+ "min-width---hidden": "112px",
75
+ "min-width-compact---hidden": "80px",
76
+ "top-offset": "13px",
77
+ "nested-option-offset": "40px",
78
+ "compact-min-width": "32px",
79
+ "header": "55px",
80
+ "toolbar": "55px",
81
+ "action-menu": "44px",
82
+ "horizontal": "72px",
83
+ "split-view": "45px",
84
+ "vertical": "60px",
85
+ "height-default": "44px",
86
+ "height-compact": "30px"
87
+ }
88
+ };
@@ -0,0 +1,141 @@
1
+ // Auto-generated from tokens.json — do not edit directly.
2
+ // Platform: ipad
3
+
4
+ export default {
5
+ "font": {
6
+ "font-weight": {
7
+ "body": "Medium",
8
+ "comment": "Regular",
9
+ "body-small": "Medium",
10
+ "title": "Bold",
11
+ "body-input": "Semi Bold",
12
+ "body-big": "Medium"
13
+ },
14
+ "letter-spacing": {
15
+ "title-4": "24"
16
+ },
17
+ "font-size": {
18
+ "body": 13,
19
+ "body-small": 11,
20
+ "title-3": 18,
21
+ "title-2": 24,
22
+ "title-1": 36,
23
+ "body-input": 13,
24
+ "title-4": 13,
25
+ "comment": 13,
26
+ "title-5": 13,
27
+ "title-6": 13,
28
+ "body-big": 17
29
+ },
30
+ "line-height": {
31
+ "title-1": 46,
32
+ "title-2": 38,
33
+ "title-3": 28,
34
+ "body": 26,
35
+ "body-small": 20,
36
+ "body-input": 17,
37
+ "title-4": 22,
38
+ "comment": 26,
39
+ "title-5": 22,
40
+ "title-6": 22,
41
+ "body-big": 17
42
+ }
43
+ },
44
+ "platform": "Mobile",
45
+ "icon": {
46
+ "default": 24,
47
+ "small": 24,
48
+ "big": 48
49
+ },
50
+ "gap": {
51
+ "0": 0,
52
+ "l": 18,
53
+ "m": 12,
54
+ "s": 8,
55
+ "xs": 4,
56
+ "xl": 24,
57
+ "xxl": 36,
58
+ "xxs": 2,
59
+ "ml": 16
60
+ },
61
+ "components": {
62
+ "input-button-select": {
63
+ "compact-height": 32,
64
+ "default": 48,
65
+ "min-height-textarea": 160,
66
+ "border-width": 1,
67
+ "min-width---hidden": 112,
68
+ "min-width-compact---hidden": 80,
69
+ "top-offset": 13,
70
+ "nested-option-offset": 40,
71
+ "compact-min-width": 32
72
+ },
73
+ "titles-and-tabs": {
74
+ "header": 55
75
+ },
76
+ "toolbar": {
77
+ "toolbar": 55
78
+ },
79
+ "action-menu-item": {
80
+ "action-menu": 44
81
+ },
82
+ "ewas-nav-item": {
83
+ "height": {
84
+ "horizontal": 55,
85
+ "split-view": 55,
86
+ "vertical": 55
87
+ },
88
+ "width": {
89
+ "horizontal": 72,
90
+ "split-view": 45,
91
+ "vertical": 60
92
+ }
93
+ },
94
+ "chip": {
95
+ "height-default": 44,
96
+ "height-compact": 30
97
+ }
98
+ },
99
+ "radius": {
100
+ "s": 4,
101
+ "m": 8,
102
+ "l": 12,
103
+ "card": 10,
104
+ "input": 6,
105
+ "section": 10,
106
+ "action-menu": 6,
107
+ "popup-message": 10,
108
+ "xl": 24,
109
+ "chip": 36,
110
+ "chip-squared": 6
111
+ },
112
+ "padding": {
113
+ "vertical": {
114
+ "0": 0,
115
+ "xs": 4,
116
+ "s": 8,
117
+ "m": 12,
118
+ "l": 18,
119
+ "xl": 24,
120
+ "xxl": 36,
121
+ "xxs": 2,
122
+ "ml": 16
123
+ },
124
+ "horizontal": {
125
+ "0": 0,
126
+ "xs": 4,
127
+ "s": 8,
128
+ "m": 12,
129
+ "l": 18,
130
+ "xl": 24,
131
+ "xxl": 36,
132
+ "xxs": 2,
133
+ "ml": 16
134
+ }
135
+ },
136
+ "icon-frame-size": {
137
+ "small": 24,
138
+ "default": 44,
139
+ "big": 48
140
+ }
141
+ };
@@ -0,0 +1,88 @@
1
+ // Auto-generated from tokens.json — do not edit directly.
2
+ // Tailwind theme.extend for web
3
+
4
+ export default {
5
+ "spacing": {
6
+ "0": "0px",
7
+ "l": "18px",
8
+ "m": "12px",
9
+ "s": "8px",
10
+ "xs": "4px",
11
+ "xl": "24px",
12
+ "xxl": "36px",
13
+ "xxs": "2px",
14
+ "ml": "16px",
15
+ "small": "18px",
16
+ "default": "24px",
17
+ "big": "36px"
18
+ },
19
+ "borderRadius": {
20
+ "s": "4px",
21
+ "m": "8px",
22
+ "l": "12px",
23
+ "card": "8px",
24
+ "input": "4px",
25
+ "section": "8px",
26
+ "action-menu": "4px",
27
+ "popup-message": "8px",
28
+ "xl": "24px",
29
+ "chip": "24px",
30
+ "chip-squared": "4px"
31
+ },
32
+ "fontSize": {
33
+ "body": "13px",
34
+ "body-small": "11px",
35
+ "title-3": "18px",
36
+ "title-2": "24px",
37
+ "title-1": "36px",
38
+ "body-input": "13px",
39
+ "title-4": "13px",
40
+ "comment": "13px",
41
+ "title-5": "13px",
42
+ "title-6": "13px",
43
+ "body-big": "17px"
44
+ },
45
+ "fontWeight": {
46
+ "body": "Medium",
47
+ "comment": "Regular",
48
+ "body-small": "Medium",
49
+ "title": "Bold",
50
+ "body-input": "Semi Bold",
51
+ "body-big": "Medium"
52
+ },
53
+ "lineHeight": {
54
+ "title-1": "42px",
55
+ "title-2": "30px",
56
+ "title-3": "23px",
57
+ "body": "20px",
58
+ "body-small": "17px",
59
+ "body-input": "13px",
60
+ "title-4": "18px",
61
+ "comment": "20px",
62
+ "title-5": "18px",
63
+ "title-6": "18px",
64
+ "body-big": "17px"
65
+ },
66
+ "letterSpacing": {
67
+ "title-4": "24px"
68
+ },
69
+ "extend": {
70
+ "compact-height": "24px",
71
+ "default": "36px",
72
+ "min-height-textarea": "128px",
73
+ "border-width": "1px",
74
+ "min-width---hidden": "84px",
75
+ "min-width-compact---hidden": "66px",
76
+ "top-offset": "9px",
77
+ "nested-option-offset": "32px",
78
+ "compact-min-width": "24px",
79
+ "header": "36px",
80
+ "toolbar": "40px",
81
+ "action-menu": "36px",
82
+ "horizontal": "72px",
83
+ "split-view": "45px",
84
+ "vertical": "60px",
85
+ "height-default": "32px",
86
+ "height-compact": "26px"
87
+ }
88
+ };
@@ -0,0 +1,141 @@
1
+ // Auto-generated from tokens.json — do not edit directly.
2
+ // Platform: web
3
+
4
+ export default {
5
+ "font": {
6
+ "font-weight": {
7
+ "body": "Medium",
8
+ "comment": "Regular",
9
+ "body-small": "Medium",
10
+ "title": "Bold",
11
+ "body-input": "Semi Bold",
12
+ "body-big": "Medium"
13
+ },
14
+ "letter-spacing": {
15
+ "title-4": "24"
16
+ },
17
+ "font-size": {
18
+ "body": 13,
19
+ "body-small": 11,
20
+ "title-3": 18,
21
+ "title-2": 24,
22
+ "title-1": 36,
23
+ "body-input": 13,
24
+ "title-4": 13,
25
+ "comment": 13,
26
+ "title-5": 13,
27
+ "title-6": 13,
28
+ "body-big": 17
29
+ },
30
+ "line-height": {
31
+ "title-1": 42,
32
+ "title-2": 30,
33
+ "title-3": 23,
34
+ "body": 20,
35
+ "body-small": 17,
36
+ "body-input": 13,
37
+ "title-4": 18,
38
+ "comment": 20,
39
+ "title-5": 18,
40
+ "title-6": 18,
41
+ "body-big": 17
42
+ }
43
+ },
44
+ "platform": "Desktop",
45
+ "icon": {
46
+ "default": 24,
47
+ "small": 18,
48
+ "big": 36
49
+ },
50
+ "gap": {
51
+ "0": 0,
52
+ "l": 18,
53
+ "m": 12,
54
+ "s": 6,
55
+ "xs": 4,
56
+ "xl": 24,
57
+ "xxl": 36,
58
+ "xxs": 2,
59
+ "ml": 16
60
+ },
61
+ "components": {
62
+ "input-button-select": {
63
+ "compact-height": 24,
64
+ "default": 36,
65
+ "min-height-textarea": 128,
66
+ "border-width": 1,
67
+ "min-width---hidden": 84,
68
+ "min-width-compact---hidden": 66,
69
+ "top-offset": 9,
70
+ "nested-option-offset": 32,
71
+ "compact-min-width": 24
72
+ },
73
+ "titles-and-tabs": {
74
+ "header": 36
75
+ },
76
+ "toolbar": {
77
+ "toolbar": 40
78
+ },
79
+ "action-menu-item": {
80
+ "action-menu": 36
81
+ },
82
+ "ewas-nav-item": {
83
+ "height": {
84
+ "horizontal": 55,
85
+ "split-view": 55,
86
+ "vertical": 55
87
+ },
88
+ "width": {
89
+ "horizontal": 72,
90
+ "split-view": 45,
91
+ "vertical": 60
92
+ }
93
+ },
94
+ "chip": {
95
+ "height-default": 32,
96
+ "height-compact": 26
97
+ }
98
+ },
99
+ "radius": {
100
+ "s": 4,
101
+ "m": 8,
102
+ "l": 12,
103
+ "card": 8,
104
+ "input": 4,
105
+ "section": 8,
106
+ "action-menu": 4,
107
+ "popup-message": 8,
108
+ "xl": 24,
109
+ "chip": 24,
110
+ "chip-squared": 4
111
+ },
112
+ "padding": {
113
+ "vertical": {
114
+ "0": 0,
115
+ "xs": 4,
116
+ "s": 8,
117
+ "m": 12,
118
+ "l": 18,
119
+ "xl": 24,
120
+ "xxl": 36,
121
+ "xxs": 2,
122
+ "ml": 16
123
+ },
124
+ "horizontal": {
125
+ "0": 0,
126
+ "xs": 4,
127
+ "s": 8,
128
+ "m": 12,
129
+ "l": 18,
130
+ "xl": 24,
131
+ "xxl": 36,
132
+ "xxs": 2,
133
+ "ml": 16
134
+ }
135
+ },
136
+ "icon-frame-size": {
137
+ "small": 18,
138
+ "default": 24,
139
+ "big": 36
140
+ }
141
+ };