@wwtdev/bsds-css 3.0.0-rc.46 → 3.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 (10) hide show
  1. package/dist/wwt-bsds-components.css +715 -605
  2. package/dist/wwt-bsds-components.min.css +1 -1
  3. package/dist/wwt-bsds-preset.js +69 -74
  4. package/dist/wwt-bsds-tokens.css +260 -275
  5. package/dist/wwt-bsds-tokens.min.css +1 -1
  6. package/dist/wwt-bsds-utilities.css +89 -83
  7. package/dist/wwt-bsds-utilities.min.css +1 -1
  8. package/dist/wwt-bsds.css +1070 -983
  9. package/dist/wwt-bsds.min.css +1 -1
  10. package/package.json +1 -1
package/dist/wwt-bsds-preset.js CHANGED
@@ -17,10 +17,10 @@ module.exports = {
17
17
  inherit: 'inherit',
18
18
  current: 'currentColor',
19
19
  white: "#FFFFFF",
20
- "white-10": "rgba(255, 255, 255, 0.1)",
20
+ "white-10": "rgba(255, 255, 255, 0.1)", // white at 10%
21
21
  black: "#0A0B19",
22
22
  blue: {
23
- 10: "rgba(102, 182, 242, 0.1)", // blue-200 at 10%
23
+ 10: "rgba(102, 182, 242, 0.1)", // blue-200 at 10%
24
24
  100: "#99CFF7",
25
25
  200: "#66B6F2",
26
26
  300: "#339EEE",
@@ -42,6 +42,7 @@ module.exports = {
42
42
  400: "#2918C4"
43
43
  },
44
44
  gold: {
45
+ 10: "rgba(235, 223, 212, 0.1)", // gold-200 at 10%
45
46
  100: "#F9F5F1",
46
47
  200: "#EBDFD4",
47
48
  300: "#E0C7AC",
@@ -157,56 +158,47 @@ module.exports = {
157
158
  100: "#FDEED3",
158
159
  200: "#FCDEA7",
159
160
  300: "#F8C464",
160
- 400: "#FFB834",
161
- 450: "#C18300",
161
+ 400: "#C18300",
162
162
  500: "#805A14"
163
163
  },
164
164
  "shadow-primary": "rgba(0, 0, 0, 0.06)",
165
165
  "shadow-secondary": "rgba(28, 0, 135, 0.2)",
166
- "gradient-dark":
167
- "linear-gradient(90deg, #1C0087 0%, #EE282A 35%, #FFFFFF 50%, #0086EA 65%, #1C0087 100%)",
168
- "gradient-light":
169
- "linear-gradient(90deg, #1C0087 0%, #EE282A 20%, #EE282A 40%, #1C0087 50%, #0086EA 60%, #0086EA 80%, #1C0087 100%)",
170
- "gradient-line":
171
- "linear-gradient(90deg, #EE282A 0%, #1C0087 50%, #0086EA 100%)",
172
- // Atom
166
+ // GRADIENT STROKES
167
+ "gradient-dark": "linear-gradient(90deg, #1C0087 0%, #EE282A 35.01%, #FFF 49.99%, #0086EA 65%, #1C0087 100%)",
168
+ "gradient-light": "linear-gradient(90deg, #1C0087 0%, #EE282A 19.93%, #EE282A 39.91%, #1C0087 49.9%, #0086EA 60%, #0086EA 79.99%, #1C0087 100%)",
169
+ "gradient-line": "linear-gradient(90deg, #EE282A 0%, #1C0087 49.35%, #0086EA 100%)",
170
+ // GRADIENT FILLS
171
+ // - BLUE CENTER
172
+ "gradient-blue-center": "radial-gradient(154.77% 52.27% at 47.08% 49.86%, #162FB4 0%, #1D1E48 100%)",
173
+ // - BLUE MID-LEFT
174
+ "gradient-blue-mid-left": "linear-gradient(90deg, #162FB4 0%, #1D1E48 98.9%)",
175
+ // - BLUE MID-RIGHT
176
+ "gradient-blue-mid-right": "linear-gradient(90deg, #1D1E48 0%, #162FB4 99.27%)",
177
+ // - BLUE BOTTOM-CENTER
178
+ "gradient-blue-bottom-center": "radial-gradient(100% 100% at 50% 0%, #1D1E48 0%, #162FB4 100%)",
179
+ // - BLUE TOP-CENTER
180
+ "gradient-blue-top-center": "radial-gradient(96.7% 96.7% at 50% 0%, #162FB4 5%, #1D1E48 100%)",
181
+ // - BLUE TOP-LEFT
182
+ "gradient-blue-top-left": "radial-gradient(312.54% 141.42% at 0% 0%, #162FB4 0%, #1D1E48 100%)",
183
+ // - BLUE BOTTOM-RIGHT
184
+ "gradient-blue-bottom-right": "radial-gradient(312.54% 141.42% at 0% 0%, #1D1E48 0%, #162FB4 100%)",
185
+ // - BLUE TOP-RIGHT
186
+ "gradient-blue-top-right": "radial-gradient(312.54% 141.42% at 100% 0%, #162FB4 0%, #1D1E48 100%)",
187
+ // - BLUE BOTTOM-LEFT
188
+ "gradient-blue-bottom-left": "radial-gradient(312.54% 141.42% at 100% 0%, #1D1E48 0%, #162FB4 100%)",
189
+ // - LIGHT BLUE TRANSPARENT
190
+ "gradient-light-blue-transparent": "radial-gradient(236% 114.71% at 94.24% 7.6%, rgba(153, 207, 247, 0.20) 0%, rgba(203, 192, 218, 0.08) 100%)",
191
+ // - LIGHT BLUE OPAQUE
192
+ "gradient-light-blue-opaque": "linear-gradient(311deg, #EBF7FF 9.29%, #FBFAFC 92%)",
193
+ // - LIGHT GRAY
194
+ "gradient-light-gray": "linear-gradient(180deg, var(--background-light, #F7F7FC) 24.82%, var(--background-medium, #F0F0FA) 100%)",
195
+ // - SOFTCHOICE LIGHT
196
+ "gradient-softchoice-light": "linear-gradient(252deg, rgba(255, 81, 0, 0.15) 66.87%, rgba(125, 0, 255, 0.15) 97.9%)",
197
+ // - SOFTCHOICE DARK
198
+ "gradient-softchoice-dark": "linear-gradient(252deg, #FF5100 66.87%, #7D00FF 97.9%)",
199
+ // ATOM GRADIENTS
173
200
  "gradient-atom-ai-border": "conic-gradient(from 180deg at 50% 50%, var(--bs-royal-400) -96.8deg, var(--bs-pink-400) 74.2deg, var(--bs-blue-400) 98.8deg, var(--bs-orange-400) 259.6deg, var(--bs-royal-400) 283.2deg, var(--bs-pink-400) 414.4deg)",
174
201
  "gradient-atom-ai-bg": "conic-gradient(from 180deg at 50% 50%, rgba(22, 47, 180, 0.05) -96.8deg, rgba(227, 28, 121, 0.05) 74.2deg, rgba(0, 134, 234, 0.05) 98.8deg, rgba(251, 85, 14, 0.05) 259.6deg, rgba(22, 47, 180, 0.05) 283.2deg, rgba(227, 28, 121, 0.05) 414.4deg)",
175
- // Top
176
- "gradient-blue-top-left":
177
- "radial-gradient(312.54% 141.42% at 0% 0%, #162FB4 0%, #1D1E48 100%)",
178
- "gradient-blue-top-center":
179
- "radial-gradient(201.14% 201.14% at 50% -51.28%, #162FB4 26.06%, #1D1E48 100%)",
180
- "gradient-blue-top-right":
181
- "radial-gradient(312.54% 141.42% at 100% 0%, #162FB4 0%, #1D1E48 100%)",
182
- // Mid
183
- "gradient-blue-mid-left":
184
- "radial-gradient(347.1% 117.22% at -9.27% 49.86%, #162FB4 8.19%, #1D1E48 100%)",
185
- "gradient-blue-mid-right":
186
- "radial-gradient(347.1% 117.22% at 109.27% 49.86%, #162FB4 8.19%, #1D1E48 100%)",
187
- // Center
188
- "gradient-blue-center":
189
- "radial-gradient(172.57% 58.28% at 50% 49.86%, #162FB4 0%, #1D1E48 100%)",
190
- // Bottom
191
- "gradient-blue-bottom-left":
192
- "radial-gradient(312.54% 141.42% at 0% 100%, #162FB4 0%, #1D1E48 100%)",
193
- "gradient-blue-bottom-center":
194
- "radial-gradient(201.14% 201.14% at 50% 151.28%, #162FB4 26.06%, #1D1E48 100%)",
195
- "gradient-blue-bottom-right":
196
- "radial-gradient(312.54% 141.42% at 100% 100%, #162FB4 0%, #1D1E48 100%)",
197
- // Light Blue
198
- "gradient-light-blue-transparent":
199
- "radial-gradient(236% 114.71% at 94.24% 7.6%, rgba(153, 207, 247, 0.20) 0%, rgba(203, 192, 218, 0.08) 100%)",
200
- "gradient-light-blue-opaque":
201
- "linear-gradient(311deg, #EBF7FF 9.29%, #FBFAFC 92%)",
202
- // Light Gray
203
- "gradient-light-gray":
204
- "linear-gradient(180deg, #F7F7FC 24.82%, #F0F0FA 100%)",
205
- // Softchoice Gradients
206
- "gradient-softchoice-light":
207
- "linear-gradient(252deg, rgba(255, 81, 0, 0.15) 66.87%, rgba(125, 0, 255, 0.15) 97.9%)",
208
- "gradient-softchoice-dark":
209
- "linear-gradient(252deg, #FF5100 66.87%, #7D00FF 97.9%)",
210
202
  },
211
203
  fontFamily: {
212
204
  sans: [
@@ -241,7 +233,8 @@ module.exports = {
241
233
  fontWeight: {
242
234
  "light": "300",
243
235
  "normal": "400",
244
- "semibold": "600"
236
+ "semibold": "600",
237
+ "bold": "600" /* Deprecated; use semibold instead */
245
238
  },
246
239
  extend: {
247
240
  backgroundColor: {
@@ -303,19 +296,19 @@ module.exports = {
303
296
  "ink-medium": "var(--bs-ink-medium)",
304
297
  "ink-light": "var(--bs-ink-light)",
305
298
  "ink-disabled": "var(--bs-ink-disabled)",
306
- "ink-invert-base": "var(--bs-ink-invert-base)",
307
- "ink-invert-medium": "var(--bs-ink-invert-medium)",
308
- "ink-invert-light": "var(--bs-ink-invert-light)",
309
299
  "ink-primary": "var(--bs-ink-primary)",
310
300
  "ink-secondary": "var(--bs-ink-secondary)",
311
301
  "ink-accent-1": "var(--bs-ink-accent-1)",
312
302
  "ink-accent-2": "var(--bs-ink-accent-2)",
313
303
  "ink-accent-3": "var(--bs-ink-accent-3)",
314
- "ink-negative": "var(--bs-ink-negative)",
304
+ "ink-accent-4": "var(--bs-ink-accent-4)",
315
305
  "ink-positive": "var(--bs-ink-positive)",
316
- "ink-ecomm-positive": "var(--bs-ink-ecomm-positive)",
317
306
  "ink-warning": "var(--bs-ink-warning)",
307
+ "ink-negative": "var(--bs-ink-negative)",
318
308
  "ink-white": "var(--bs-ink-white)",
309
+ "ink-invert-base": "var(--bs-ink-invert-base)",
310
+ "ink-invert-medium": "var(--bs-ink-invert-medium)",
311
+ "ink-invert-light": "var(--bs-ink-invert-light)",
319
312
  // Primary
320
313
  "primary-base-fixed": "var(--bs-primary-base-fixed)",
321
314
  "primary-base": "var(--bs-primary-base)",
@@ -330,12 +323,6 @@ module.exports = {
330
323
  "secondary-light": "var(--bs-secondary-light)",
331
324
  "secondary-lightest": "var(--bs-secondary-lightest)",
332
325
  "secondary-highlight": "var(--bs-secondary-highlight)",
333
- // Neutral
334
- "neutral-dark": "var(--bs-neutral-dark)",
335
- "neutral-base": "var(--bs-neutral-base)",
336
- "neutral-medium": "var(--bs-neutral-medium)",
337
- "neutral-light": "var(--bs-neutral-light)",
338
- "neutral-lightest": "var(--bs-neutral-lightest)",
339
326
  // Accent 1
340
327
  "accent-1-base-fixed": "var(--bs-accent-1-base-fixed)",
341
328
  "accent-1-base": "var(--bs-accent-1-base)",
@@ -363,33 +350,41 @@ module.exports = {
363
350
  "accent-4-light": "var(--bs-accent-4-light)",
364
351
  "accent-4-lightest": "var(--bs-accent-4-lightest)",
365
352
  "accent-4-highlight": "var(--bs-accent-4-highlight)",
353
+ // Accent 5
354
+ "accent-5-base": "var(--bs-accent-5-base)",
355
+ "accent-5-medium": "var(--bs-accent-5-medium)",
356
+ "accent-5-light": "var(--bs-accent-5-light)",
357
+ "accent-5-lightest": "var(--bs-accent-5-lightest)",
358
+ "accent-5-highlight": "var(--bs-accent-5-highlight)",
359
+ // Accent 6
360
+ "accent-6-base": "var(--bs-accent-6-base)",
361
+ "accent-6-medium": "var(--bs-accent-6-medium)",
362
+ "accent-6-light": "var(--bs-accent-6-light)",
363
+ "accent-6-lightest": "var(--bs-accent-6-lightest)",
364
+ "accent-6-highlight": "var(--bs-accent-6-highlight)",
365
+ // Accent 7
366
+ "accent-7-base": "var(--bs-accent-7-base)",
367
+ "accent-7-medium": "var(--bs-accent-7-medium)",
368
+ "accent-7-light": "var(--bs-accent-7-light)",
369
+ "accent-7-lightest": "var(--bs-accent-7-lightest)",
370
+ "accent-7-highlight": "var(--bs-accent-7-highlight)",
371
+ // Neutral
372
+ "neutral-dark": "var(--bs-neutral-dark)",
373
+ "neutral-base": "var(--bs-neutral-base)",
374
+ "neutral-medium": "var(--bs-neutral-medium)",
375
+ "neutral-light": "var(--bs-neutral-light)",
376
+ "neutral-lightest": "var(--bs-neutral-lightest)",
366
377
  // Positive
367
- "positive-base-fixed": "var(--bs-positive-base-fixed)",
368
378
  "positive-base": "var(--bs-positive-base)",
369
379
  "positive-medium": "var(--bs-positive-medium)",
370
- "positive-light": "var(--bs-positive-light)",
371
- "positive-lightest": "var(--bs-positive-lightest)",
372
380
  "positive-highlight": "var(--bs-positive-highlight)",
373
- // Ecomm Positive
374
- "ecomm-positive-base-fixed": "var(--bs-ecomm-positive-base-fixed)",
375
- "ecomm-positive-base": "var(--bs-ecomm-positive-base)",
376
- "ecomm-positive-medium": "var(--bs-ecomm-positive-medium)",
377
- "ecomm-positive-light": "var(--bs-ecomm-positive-light)",
378
- "ecomm-positive-lightest": "var(--bs-ecomm-positive-lightest)",
379
- "ecomm-positive-highlight": "var(--bs-ecomm-positive-highlight)",
380
381
  // Warning
381
- "warning-dark": "var(--bs-warning-dark)",
382
382
  "warning-base": "var(--bs-warning-base)",
383
383
  "warning-medium": "var(--bs-warning-medium)",
384
- "warning-light": "var(--bs-warning-light)",
385
- "warning-lightest": "var(--bs-warning-lightest)",
386
384
  "warning-highlight": "var(--bs-warning-highlight)",
387
385
  // Negative
388
- "negative-dark": "var(--bs-negative-dark)",
389
386
  "negative-base": "var(--bs-negative-base)",
390
387
  "negative-medium": "var(--bs-negative-medium)",
391
- "negative-light": "var(--bs-negative-light)",
392
- "negative-lightest": "var(--bs-negative-lightest)",
393
388
  "negative-highlight": "var(--bs-negative-highlight)",
394
389
 
395
390
  // DEPRECATED