@blackbaud/skyux-design-tokens 0.0.28 → 0.0.30

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 (7) hide show
  1. package/CHANGELOG.md +48 -28
  2. package/bundles/design-tokens.global.min.js +1 -0
  3. package/json/design-tokens.json +1 -247
  4. package/json/themes/modern/design-tokens.json +1 -341
  5. package/package.json +14 -3
  6. package/scss/blackbaud.css +522 -0
  7. package/scss/modern.css +308 -0
package/CHANGELOG.md CHANGED
@@ -1,114 +1,134 @@
1
- # 0.0.28 (2023-10-11)
1
+ ## 0.0.28 (2023-10-11)
2
2
 
3
3
  - Added `neutral-medium-dark` token in modern. [#64](https://github.com/blackbaud/skyux-design-tokens/pull/64)
4
4
 
5
- # 0.0.27 (2023-06-22)
5
+ ## [0.0.30](https://github.com/blackbaud/skyux-design-tokens/compare/0.0.29...0.0.30) (2024-09-24)
6
+
7
+
8
+ ### Features
9
+
10
+ * adding icon colors and adjusting gap scales ([#77](https://github.com/blackbaud/skyux-design-tokens/issues/77)) ([af5fc14](https://github.com/blackbaud/skyux-design-tokens/commit/af5fc1401ce70abd189e2e77a37fcf7f183c1487))
11
+
12
+ ## [0.0.29](https://github.com/blackbaud/skyux-design-tokens/compare/v0.0.29...0.0.29) (2024-09-23)
13
+
14
+
15
+ ### Features
16
+
17
+ * added additional tokens ([c7561e8](https://github.com/blackbaud/skyux-design-tokens/commit/c7561e8f0d28d75b9f345a3e56d9ec8dcc469c6a))
18
+ * added token generation using style dictionary ([cd6c248](https://github.com/blackbaud/skyux-design-tokens/commit/cd6c24829dfd0a3b0afcc5c9cf066e29f171402f))
19
+
20
+
21
+ ### Bug Fixes
22
+
23
+ * remove calling deleted package script in publish ([#71](https://github.com/blackbaud/skyux-design-tokens/issues/71)) ([0a7a762](https://github.com/blackbaud/skyux-design-tokens/commit/0a7a76254dc3c4c27c861c89a8052ac727ed35d9))
24
+
25
+ ## 0.0.27 (2023-06-22)
6
26
 
7
27
  - Updated `sky-theme-modern-background-color-disabled`. [#63](https://github.com/blackbaud/skyux-design-tokens/pull/63)
8
28
 
9
- # 0.0.26 (2023-03-10)
29
+ ## 0.0.26 (2023-03-10)
10
30
 
11
31
  - Added new blue-05 color. [#61](https://github.com/blackbaud/skyux-design-tokens/pull/61)
12
32
 
13
- # 0.0.25 (2022-04-11)
33
+ ## 0.0.25 (2022-04-11)
14
34
 
15
35
  - Updated the SCSS mixins to implement `@use` modules. #60
16
36
 
17
- # 0.0.24 (2021-06-23)
37
+ ## 0.0.24 (2021-06-23)
18
38
 
19
39
  - Updated font URLs to point to the renamed BLKB Sans font. [#56](https://github.com/blackbaud/skyux-design-tokens/pull/56)
20
40
 
21
- # 0.0.23 (2021-04-19)
41
+ ## 0.0.23 (2021-04-19)
22
42
 
23
43
  - Added spacing classes and primary action border color to the modern theme. [#54](https://github.com/blackbaud/skyux-design-tokens/pull/54)
24
44
 
25
- # 0.0.22 (2020-07-27)
45
+ ## 0.0.22 (2020-07-27)
26
46
 
27
47
  - Added dark mode colors to the modern theme. [#51](https://github.com/blackbaud/skyux-design-tokens/pull/51)
28
48
 
29
- # 0.0.21 (2020-07-06)
49
+ ## 0.0.21 (2020-07-06)
30
50
 
31
51
  - Renamed the modern theme `field-` tokens to `data-`. [#46](https://github.com/blackbaud/skyux-design-tokens/pull/46)
32
52
  - Added medium horizontal padding tokens to the modern theme. [#46](https://github.com/blackbaud/skyux-design-tokens/pull/46)
33
53
  - Added a large inline margin token to the modern theme. [#47](https://github.com/blackbaud/skyux-design-tokens/pull/47)
34
54
 
35
- # 0.0.20 (2020-06-03)
55
+ ## 0.0.20 (2020-06-03)
36
56
 
37
57
  - Added button padding tokens to the modern theme. [#45](https://github.com/blackbaud/skyux-design-tokens/pull/45)
38
58
 
39
- # 0.0.19 (2020-05-27)
59
+ ## 0.0.19 (2020-05-27)
40
60
 
41
61
  - Added colors for dark mode. [#44](https://github.com/blackbaud/skyux-design-tokens/pull/44)
42
62
 
43
- # 0.0.18 (2020-05-07)
63
+ ## 0.0.18 (2020-05-07)
44
64
 
45
65
  - Added a medium gray background color to the modern theme. [#42](https://github.com/blackbaud/skyux-design-tokens/pull/42)
46
66
 
47
- # 0.0.17 (2020-04-30)
67
+ ## 0.0.17 (2020-04-30)
48
68
 
49
69
  - Added horizontal padding tokens and de-emphasized text weight to the modern theme. [#39](https://github.com/blackbaud/skyux-design-tokens/pull/39)
50
70
  - Added a border radius token for the SKY UX box element to the modern theme. [#40](https://github.com/blackbaud/skyux-design-tokens/pull/40)
51
71
 
52
- # 0.0.16 (2020-04-16)
72
+ ## 0.0.16 (2020-04-16)
53
73
 
54
74
  - Moved text tokens to the default theme. [#37](https://github.com/blackbaud/skyux-design-tokens/pull/37)
55
75
 
56
- # 0.0.15 (2020-04-10)
76
+ ## 0.0.15 (2020-04-10)
57
77
 
58
78
  - Adjusted modern theme tokens. [#35](https://github.com/blackbaud/skyux-design-tokens/pull/35)
59
79
 
60
- # 0.0.14 (2020-04-08)
80
+ ## 0.0.14 (2020-04-08)
61
81
 
62
82
  - Added "modern" theme. [#32](https://github.com/blackbaud/skyux-design-tokens/pull/32)
63
83
 
64
- # 0.0.13 (2019-10-07)
84
+ ## 0.0.13 (2019-10-07)
65
85
 
66
86
  - Added color values to represent various categories. [#26](https://github.com/blackbaud/skyux-design-tokens/pull/26)
67
87
 
68
- # 0.0.12 (2019-05-20)
88
+ ## 0.0.12 (2019-05-20)
69
89
 
70
90
  - Added value for default body background color. [#25](https://github.com/blackbaud/skyux-design-tokens/pull/25)
71
91
 
72
- # 0.0.11 (2019-01-04)
92
+ ## 0.0.11 (2019-01-04)
73
93
 
74
94
  - Updated primary text and anchor colors to pass a11y color contrast rule. [#24](https://github.com/blackbaud/skyux-design-tokens/pull/24)
75
95
 
76
- # 0.0.10 (2018-09-25)
96
+ ## 0.0.10 (2018-09-25)
77
97
 
78
98
  - Reduced pixel value for "compact" margin size. [#21](https://github.com/blackbaud/skyux-design-tokens/pull/21)
79
99
 
80
- # 0.0.9 (2018-08-21)
100
+ ## 0.0.9 (2018-08-21)
81
101
 
82
102
  - Added values for viewport breakpoints and spacing. [#17](https://github.com/blackbaud/skyux-design-tokens/pull/17) [#19](https://github.com/blackbaud/skyux-design-tokens/pull/19)
83
103
 
84
- # 0.0.8 (2017-08-17)
104
+ ## 0.0.8 (2017-08-17)
85
105
 
86
106
  - Created styles for `icon-borderless` and `info-light`.
87
107
 
88
- # 0.0.7 (2017-07-17)
108
+ ## 0.0.7 (2017-07-17)
89
109
 
90
110
  - Changed row border color to $sky-border-color-neutral-medium.
91
111
 
92
- # 0.0.6 (2017-07-12)
112
+ ## 0.0.6 (2017-07-12)
93
113
 
94
114
  - Added the sky-border convenience mixin.
95
115
 
96
- # 0.0.5 (2017-07-10)
116
+ ## 0.0.5 (2017-07-10)
97
117
 
98
118
  - Changed color-gray-70 from #6f737a to #686c73.
99
119
 
100
- # 0.0.4 (2017-06-27)
120
+ ## 0.0.4 (2017-06-27)
101
121
 
102
122
  - Tweaked package.json.
103
123
 
104
- # 0.0.3 (2017-06-24)
124
+ ## 0.0.3 (2017-06-24)
105
125
 
106
126
  - Fixed typo for release.
107
127
 
108
- # 0.0.2 (2017-06-23)
128
+ ## 0.0.2 (2017-06-23)
109
129
 
110
130
  - Fixed syntax error for package preparation.
111
131
 
112
- # 0.0.1 (2017-06-23)
132
+ ## 0.0.1 (2017-06-23)
113
133
 
114
134
  - Added initial design tokens for SKY UX.
package/bundles/design-tokens.global.min.js ADDED
@@ -0,0 +1 @@
1
+ document.body.classList.add("local-dev-tokens");
package/json/design-tokens.json CHANGED
@@ -1,247 +1 @@
1
- {
2
- "color": {
3
- "white": "#ffffff",
4
- "black": "#000000",
5
- "gray": {
6
- "10": "#e2e3e4",
7
- "20": "#cdcfd2",
8
- "70": "#686c73",
9
- "80": "#4d525a",
10
- "90": "#393d44",
11
- "100": "#282b31",
12
- "105": "#212327",
13
- "01": "#fbfbfb",
14
- "05": "#eeeeef"
15
- },
16
- "blue": {
17
- "10": "#c1e8fb",
18
- "30": "#81d4f7",
19
- "50": "#00b4f1",
20
- "70": "#007ca6",
21
- "75": "#0974a1",
22
- "05": "#ebfbff"
23
- },
24
- "green": {
25
- "30": "#b7da9b",
26
- "50": "#72bf44"
27
- },
28
- "yellow": {
29
- "30": "#ffd597",
30
- "50": "#fbb034"
31
- },
32
- "red": {
33
- "30": "#f7a08f",
34
- "50": "#ef4044",
35
- "70": "#d93a3d"
36
- },
37
- "purple": {
38
- "10": "#f1eef6",
39
- "50": "#936daf"
40
- },
41
- "teal": {
42
- "50": "#00b795",
43
- "70": "#00866d"
44
- },
45
- "blackbaud": {
46
- "sky-blue": {
47
- "20": "#bfecfb",
48
- "40": "#40c7f4"
49
- },
50
- "green": {
51
- "30": "#80dbca"
52
- },
53
- "yellow": {
54
- "30": "#fdd799"
55
- },
56
- "orange": {
57
- "30": "#f9ba90"
58
- },
59
- "red": {
60
- "30": "#f7a0a1"
61
- },
62
- "purple": {
63
- "30": "#c9b6d7"
64
- }
65
- }
66
- },
67
- "size": {
68
- "screen": {
69
- "xs": {
70
- "max": "767px"
71
- },
72
- "sm": {
73
- "min": "768px",
74
- "max": "991px"
75
- },
76
- "md": {
77
- "min": "992px",
78
- "max": "1199px"
79
- },
80
- "lg": {
81
- "min": "1200px"
82
- }
83
- }
84
- },
85
- "space": {
86
- "default": "10px",
87
- "xxs": "3px",
88
- "xs": "5px",
89
- "sm": "8px",
90
- "md": "10px",
91
- "lg": "15px",
92
- "xl": "20px"
93
- },
94
- "text": {
95
- "size": {
96
- "100": "12px",
97
- "125": "13px",
98
- "150": "14px",
99
- "200": "16px",
100
- "250": "18px",
101
- "300": "20px",
102
- "400": "24px",
103
- "500": "28px",
104
- "600": "32px",
105
- "800": "48px"
106
- },
107
- "weight": {
108
- "thin": {
109
- "file": "https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-Thin.woff",
110
- "value": "100"
111
- },
112
- "light": {
113
- "file": "https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-Light.woff",
114
- "value": "300"
115
- },
116
- "regular": {
117
- "file": "https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-Regular.woff",
118
- "value": "400"
119
- },
120
- "semibold": {
121
- "file": "https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-Semibold.woff",
122
- "value": "600"
123
- },
124
- "bold": {
125
- "file": "https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-Bold.woff",
126
- "value": "700"
127
- },
128
- "condensed": {
129
- "light": {
130
- "file": "https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-CondLight.woff",
131
- "value": "300"
132
- },
133
- "semibold": {
134
- "file": "https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-CondSemibold.woff",
135
- "value": "600"
136
- }
137
- }
138
- },
139
- "style": {
140
- "italic": {
141
- "file": "https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-Italic.woff",
142
- "value": "italic"
143
- },
144
- "uppercase": "uppercase"
145
- }
146
- },
147
- "text-color": {
148
- "default": "#212327",
149
- "deemphasized": "#686c73",
150
- "on-dark": "#ffffff",
151
- "action-primary": "#0974a1",
152
- "icon-borderless": "#cdcfd2"
153
- },
154
- "background-color": {
155
- "neutral-light": "#eeeeef",
156
- "primary-dark": "#0974a1",
157
- "selected": "#f1eef6",
158
- "disabled": "#cdcfd2",
159
- "info": "#81d4f7",
160
- "info-light": "#c1e8fb",
161
- "success": "#b7da9b",
162
- "warning": "#ffd597",
163
- "danger": "#f7a08f",
164
- "danger-dark": "#d93a3d",
165
- "page-default": "#ffffff"
166
- },
167
- "category-color": {
168
- "light-blue": "#bfecfb",
169
- "teal": "#80dbca",
170
- "purple": "#c9b6d7",
171
- "orange": "#f9ba90",
172
- "blue": "#40c7f4",
173
- "yellow": "#fdd799",
174
- "red": "#f7a0a1"
175
- },
176
- "highlight-color": {
177
- "info": "#00b4f1",
178
- "success": "#72bf44",
179
- "warning": "#fbb034",
180
- "danger": "#ef4044"
181
- },
182
- "border-color": {
183
- "neutral-light": "#e2e3e4",
184
- "neutral-medium": "#cdcfd2"
185
- },
186
- "screen": {
187
- "xs-max": "767px",
188
- "sm-min": "768px",
189
- "sm-max": "991px",
190
- "md-min": "992px",
191
- "md-max": "1199px",
192
- "lg-min": "1200px"
193
- },
194
- "padding": {
195
- "even": {
196
- "default": [
197
- "10px",
198
- "10px",
199
- "10px",
200
- "10px"
201
- ],
202
- "small": [
203
- "8px",
204
- "8px",
205
- "8px",
206
- "8px"
207
- ],
208
- "large": [
209
- "15px",
210
- "15px",
211
- "15px",
212
- "15px"
213
- ]
214
- },
215
- "squish": {
216
- "default": [
217
- "5px",
218
- "10px",
219
- "5px",
220
- "10px"
221
- ],
222
- "small": [
223
- "3px",
224
- "8px",
225
- "3px",
226
- "8px"
227
- ],
228
- "large": [
229
- "8px",
230
- "15px",
231
- "8px",
232
- "15px"
233
- ]
234
- }
235
- },
236
- "margin": {
237
- "inline": {
238
- "default": "10px",
239
- "compact": "5px"
240
- },
241
- "stacked": {
242
- "default": "10px",
243
- "compact": "5px",
244
- "separate": "20px"
245
- }
246
- }
247
- }
1
+ {"color":{"white":"#ffffff","black":"#000000","gray":{"10":"#e2e3e4","20":"#cdcfd2","70":"#686c73","80":"#4d525a","90":"#393d44","100":"#282b31","105":"#212327","01":"#fbfbfb","05":"#eeeeef"},"blue":{"10":"#c1e8fb","30":"#81d4f7","50":"#00b4f1","70":"#007ca6","75":"#0974a1","05":"#ebfbff"},"green":{"30":"#b7da9b","50":"#72bf44"},"yellow":{"30":"#ffd597","50":"#fbb034"},"red":{"30":"#f7a08f","50":"#ef4044","70":"#d93a3d"},"purple":{"10":"#f1eef6","50":"#936daf"},"teal":{"50":"#00b795","70":"#00866d"},"blackbaud":{"sky-blue":{"20":"#bfecfb","40":"#40c7f4"},"green":{"30":"#80dbca"},"yellow":{"30":"#fdd799"},"orange":{"30":"#f9ba90"},"red":{"30":"#f7a0a1"},"purple":{"30":"#c9b6d7"}}},"size":{"screen":{"xs":{"max":"767px"},"sm":{"min":"768px","max":"991px"},"md":{"min":"992px","max":"1199px"},"lg":{"min":"1200px"}}},"space":{"default":"10px","xxs":"3px","xs":"5px","sm":"8px","md":"10px","lg":"15px","xl":"20px"},"text":{"size":{"100":"12px","125":"13px","150":"14px","200":"16px","250":"18px","300":"20px","400":"24px","500":"28px","600":"32px","800":"48px"},"weight":{"thin":{"file":"https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-Thin.woff","value":"100"},"light":{"file":"https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-Light.woff","value":"300"},"regular":{"file":"https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-Regular.woff","value":"400"},"semibold":{"file":"https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-Semibold.woff","value":"600"},"bold":{"file":"https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-Bold.woff","value":"700"},"condensed":{"light":{"file":"https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-CondLight.woff","value":"300"},"semibold":{"file":"https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-CondSemibold.woff","value":"600"}}},"style":{"italic":{"file":"https://sky.blackbaudcdn.net/static/skyux-fonts/2.0.0/assets/BLKBSans-Italic.woff","value":"italic"},"uppercase":"uppercase"}},"text-color":{"default":"#212327","deemphasized":"#686c73","on-dark":"#ffffff","action-primary":"#0974a1","icon-borderless":"#cdcfd2"},"background-color":{"neutral-light":"#eeeeef","primary-dark":"#0974a1","selected":"#f1eef6","disabled":"#cdcfd2","info":"#81d4f7","info-light":"#c1e8fb","success":"#b7da9b","warning":"#ffd597","danger":"#f7a08f","danger-dark":"#d93a3d","page-default":"#ffffff"},"category-color":{"light-blue":"#bfecfb","teal":"#80dbca","purple":"#c9b6d7","orange":"#f9ba90","blue":"#40c7f4","yellow":"#fdd799","red":"#f7a0a1"},"highlight-color":{"info":"#00b4f1","success":"#72bf44","warning":"#fbb034","danger":"#ef4044"},"border-color":{"neutral-light":"#e2e3e4","neutral-medium":"#cdcfd2"},"screen":{"xs-max":"767px","sm-min":"768px","sm-max":"991px","md-min":"992px","md-max":"1199px","lg-min":"1200px"},"padding":{"even":{"default":["10px","10px","10px","10px"],"small":["8px","8px","8px","8px"],"large":["15px","15px","15px","15px"]},"squish":{"default":["5px","10px","5px","10px"],"small":["3px","8px","3px","8px"],"large":["8px","15px","8px","15px"]}},"margin":{"inline":{"default":"10px","compact":"5px"},"stacked":{"default":"10px","compact":"5px","separate":"20px"}}}