@repobit/dex-system-design 0.9.1 → 0.11.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 (21) hide show
  1. package/CHANGELOG.md +26 -0
  2. package/package.json +17 -3
  3. package/src/components/FAQ/faq.js +8 -7
  4. package/src/components/Input/Input.js +5 -4
  5. package/src/components/anchor/anchor-nav.js +24 -23
  6. package/src/components/badge/badge.js +5 -4
  7. package/src/components/carousel/carousel.js +14 -13
  8. package/src/components/checkbox/checkbox.js +22 -21
  9. package/src/components/divider/divider-horizontal.js +5 -4
  10. package/src/components/header/header.js +2 -1
  11. package/src/components/highlight/highlight.js +2 -1
  12. package/src/components/light-carousel/light-carousel.js +9 -8
  13. package/src/components/paragraph/paragraph.js +6 -5
  14. package/src/components/pricing-cards/pricing-card.js +83 -82
  15. package/src/components/radio/radio.js +20 -31
  16. package/src/components/tabs/tabs.js +22 -22
  17. package/src/components/termsOfUse/terms.js +13 -13
  18. package/src/tokens/fonts.css +166 -0
  19. package/src/tokens/layout.css +0 -1
  20. package/src/tokens/tokens.js +0 -133
  21. package/src/tokens/tokens.css +0 -412
package/src/tokens/fonts.css ADDED
@@ -0,0 +1,166 @@
1
+ /* =====================
2
+ GLOBAL FONT-FACE DEFINITIONS
3
+ For Storybook and global usage
4
+ ====================== */
5
+
6
+ /* IBM Plex Mono */
7
+ @font-face {
8
+ font-family: 'IBM Plex Mono';
9
+ font-style: normal;
10
+ font-weight: 300;
11
+ src: url('./assets/fonts/IBMPlexMono-Light.woff2') format('woff2');
12
+ font-display: swap;
13
+ }
14
+
15
+ @font-face {
16
+ font-family: 'IBM Plex Mono';
17
+ font-style: italic;
18
+ font-weight: 300;
19
+ src: url('./assets/fonts/IBMPlexMono-LightItalic.woff2') format('woff2');
20
+ font-display: swap;
21
+ }
22
+
23
+ @font-face {
24
+ font-family: 'IBM Plex Mono';
25
+ font-style: normal;
26
+ font-weight: 400;
27
+ src: url('./assets/fonts/IBMPlexMono-Regular.woff2') format('woff2');
28
+ font-display: swap;
29
+ }
30
+
31
+ @font-face {
32
+ font-family: 'IBM Plex Mono';
33
+ font-style: italic;
34
+ font-weight: 400;
35
+ src: url('./assets/fonts/IBMPlexMono-Italic.woff2') format('woff2');
36
+ font-display: swap;
37
+ }
38
+
39
+ @font-face {
40
+ font-family: 'IBM Plex Mono';
41
+ font-style: normal;
42
+ font-weight: 500;
43
+ src: url('./assets/fonts/IBMPlexMono-Medium.woff2') format('woff2');
44
+ font-display: swap;
45
+ }
46
+
47
+ @font-face {
48
+ font-family: 'IBM Plex Mono';
49
+ font-style: italic;
50
+ font-weight: 500;
51
+ src: url('./assets/fonts/IBMPlexMono-MediumItalic.woff2') format('woff2');
52
+ font-display: swap;
53
+ }
54
+
55
+ @font-face {
56
+ font-family: 'IBM Plex Mono';
57
+ font-style: normal;
58
+ font-weight: 600;
59
+ src: url('./assets/fonts/IBMPlexMono-SemiBold.woff2') format('woff2');
60
+ font-display: swap;
61
+ }
62
+
63
+ @font-face {
64
+ font-family: 'IBM Plex Mono';
65
+ font-style: italic;
66
+ font-weight: 600;
67
+ src: url('./assets/fonts/IBMPlexMono-SemiBoldItalic.woff2') format('woff2');
68
+ font-display: swap;
69
+ }
70
+
71
+ @font-face {
72
+ font-family: 'IBM Plex Mono';
73
+ font-style: normal;
74
+ font-weight: 700;
75
+ src: url('./assets/fonts/IBMPlexMono-Bold.woff2') format('woff2');
76
+ font-display: swap;
77
+ }
78
+
79
+ @font-face {
80
+ font-family: 'IBM Plex Mono';
81
+ font-style: italic;
82
+ font-weight: 700;
83
+ src: url('./assets/fonts/IBMPlexMono-BoldItalic.woff2') format('woff2');
84
+ font-display: swap;
85
+ }
86
+
87
+ /* IBM Plex Sans */
88
+ @font-face {
89
+ font-family: 'IBM Plex Sans';
90
+ font-style: normal;
91
+ font-weight: 300;
92
+ src: url('./assets/fonts/IBMPlexSans-Light.woff2') format('woff2');
93
+ font-display: swap;
94
+ }
95
+
96
+ @font-face {
97
+ font-family: 'IBM Plex Sans';
98
+ font-style: italic;
99
+ font-weight: 300;
100
+ src: url('./assets/fonts/IBMPlexSans-LightItalic.woff2') format('woff2');
101
+ font-display: swap;
102
+ }
103
+
104
+ @font-face {
105
+ font-family: 'IBM Plex Sans';
106
+ font-style: normal;
107
+ font-weight: 400;
108
+ src: url('./assets/fonts/IBMPlexSans-Regular.woff2') format('woff2');
109
+ font-display: swap;
110
+ }
111
+
112
+ @font-face {
113
+ font-family: 'IBM Plex Sans';
114
+ font-style: italic;
115
+ font-weight: 400;
116
+ src: url('./assets/fonts/IBMPlexSans-Italic.woff2') format('woff2');
117
+ font-display: swap;
118
+ }
119
+
120
+ @font-face {
121
+ font-family: 'IBM Plex Sans';
122
+ font-style: normal;
123
+ font-weight: 500;
124
+ src: url('./assets/fonts/IBMPlexSans-Medium.woff2') format('woff2');
125
+ font-display: swap;
126
+ }
127
+
128
+ @font-face {
129
+ font-family: 'IBM Plex Sans';
130
+ font-style: italic;
131
+ font-weight: 500;
132
+ src: url('./assets/fonts/IBMPlexSans-MediumItalic.woff2') format('woff2');
133
+ font-display: swap;
134
+ }
135
+
136
+ @font-face {
137
+ font-family: 'IBM Plex Sans';
138
+ font-style: normal;
139
+ font-weight: 600;
140
+ src: url('./assets/fonts/IBMPlexSans-SemiBold.woff2') format('woff2');
141
+ font-display: swap;
142
+ }
143
+
144
+ @font-face {
145
+ font-family: 'IBM Plex Sans';
146
+ font-style: italic;
147
+ font-weight: 600;
148
+ src: url('./assets/fonts/IBMPlexSans-SemiBoldItalic.woff2') format('woff2');
149
+ font-display: swap;
150
+ }
151
+
152
+ @font-face {
153
+ font-family: 'IBM Plex Sans';
154
+ font-style: normal;
155
+ font-weight: 700;
156
+ src: url('./assets/fonts/IBMPlexSans-Bold.woff2') format('woff2');
157
+ font-display: swap;
158
+ }
159
+
160
+ @font-face {
161
+ font-family: 'IBM Plex Sans';
162
+ font-style: italic;
163
+ font-weight: 700;
164
+ src: url('./assets/fonts/IBMPlexSans-BoldItalic.woff2') format('woff2');
165
+ font-display: swap;
166
+ }
package/src/tokens/layout.css CHANGED
@@ -1,4 +1,3 @@
1
- @import './tokens.css';
2
1
  .bd-button-container {
3
2
  display: flex;
4
3
  flex-direction: column;
package/src/tokens/tokens.js CHANGED
@@ -252,139 +252,6 @@ export const tokens = css`
252
252
  --breakpoint-lg: 992px;
253
253
  --breakpoint-xl: 1200px;
254
254
  --breakpoint-xxl: 1400px;
255
- /* =====================
256
- FONT-FACE DEFINITIONS
257
- ====================== */
258
-
259
- @font-face {
260
- font-family: 'IBM Plex Mono';
261
- font-style: normal;
262
- font-weight: 700;
263
- src: url('/assets/fonts/IBMPlexMono-Bold.woff2') format('woff2');
264
- }
265
- @font-face {
266
- font-family: 'IBM Plex Mono';
267
- font-style: normal;
268
- font-weight: 700;
269
- src: url('/assets/fonts/IBMPlexMono-BoldItalic.woff2') format('woff2');
270
- }
271
-
272
- @font-face {
273
- font-family: 'IBM Plex Mono';
274
- font-style: italic;
275
- font-weight: 300;
276
- src: url('/assets/fonts/IBMPlexMono-Italic.woff2') format('woff2');
277
- }
278
- @font-face {
279
- font-family: 'IBM Plex Mono';
280
- font-style: normal;
281
- font-weight: 300;
282
- src: url('/assets/fonts/IBMPlexMono-Light.woff2') format('woff2');
283
- }
284
- @font-face {
285
- font-family: 'IBM Plex Mono';
286
- font-style: italic;
287
- font-weight: 300;
288
- src: url('/assets/fonts/IBMPlexMono-LightItalic.woff2') format('woff2');
289
- }
290
-
291
- @font-face {
292
- font-family: 'IBM Plex Mono';
293
- font-style: italic;
294
- font-weight: 500;
295
- src: url('/assets/fonts/IBMPlexMono-Medium.woff2') format('woff2');
296
- }
297
- @font-face {
298
- font-family: 'IBM Plex Mono';
299
- font-style: italic;
300
- font-weight: 500;
301
- src: url('/assets/fonts/IBMPlexMono-MediumItalic.woff2') format('woff2');
302
- }
303
- @font-face {
304
- font-family: 'IBM Plex Mono';
305
- font-style: italic;
306
- font-weight: 400;
307
- src: url('/assets/fonts/IBMPlexMono-Regular.woff2') format('woff2');
308
- }
309
- @font-face {
310
- font-family: 'IBM Plex Mono';
311
- font-style: italic;
312
- font-weight: 600;
313
- src: url('/assets/fonts/IBMPlexMono-SemiBold.woff2') format('woff2');
314
- }
315
- @font-face {
316
- font-family: 'IBM Plex Mono';
317
- font-style: italic;
318
- font-weight: 600;
319
- src: url('/assets/fonts/IBMPlexMono-SemiBoldItalic.woff2') format('woff2');
320
- }
321
-
322
- /*
323
- IBM PLEX SANS
324
- */
325
-
326
- @font-face {
327
- font-family: 'IBMPlexSans';
328
- font-style: normal;
329
- font-weight: 700;
330
- src: url('/assets/fonts/IBMPlexSans-Bold.woff2') format('woff2');
331
- }
332
- @font-face {
333
- font-family: 'IBMPlexSans';
334
- font-style: normal;
335
- font-weight: 700;
336
- src: url('/assets/fonts/IBMPlexSans-BoldItalic.woff2') format('woff2');
337
- }
338
-
339
- @font-face {
340
- font-family: 'IBMPlexSans';
341
- font-style: italic;
342
- font-weight: 300;
343
- src: url('/assets/fonts/IBMPlexSans-Italic.woff2') format('woff2');
344
- }
345
- @font-face {
346
- font-family: 'IBMPlexSans';
347
- font-style: normal;
348
- font-weight: 300;
349
- src: url('/assets/fonts/IBMPlexSans-Light.woff2') format('woff2');
350
- }
351
- @font-face {
352
- font-family: 'IBMPlexSans';
353
- font-style: italic;
354
- font-weight: 300;
355
- src: url('/assets/fonts/IBMPlexSans-LightItalic.woff2') format('woff2');
356
- }
357
-
358
- @font-face {
359
- font-family: 'IBMPlexSans';
360
- font-style: italic;
361
- font-weight: 500;
362
- src: url('/assets/fonts/IBMPlexSans-Medium.woff2') format('woff2');
363
- }
364
- @font-face {
365
- font-family: 'IBMPlexSans';
366
- font-style: italic;
367
- font-weight: 500;
368
- src: url('/assets/fonts/IBMPlexSans-MediumItalic.woff2') format('woff2');
369
- }
370
- @font-face {
371
- font-family: 'IBMPlexSans';
372
- font-style: italic;
373
- font-weight: 400;
374
- src: url('/assets/fonts/IBMPlexSans-Regular.woff2') format('woff2');
375
- }
376
- @font-face {
377
- font-family: 'IBMPlexSans';
378
- font-style: italic;
379
- font-weight: 600;
380
- src: url('/assets/fonts/IBMPlexSans-SemiBold.woff2') format('woff2');
381
- }
382
- @font-face {
383
- font-family: 'IBMPlexSans';
384
- font-style: italic;
385
- font-weight: 600;
386
- src: url('/assets/fonts/IBMPlexSans-SemiBoldItalic.woff2') format('woff2');
387
- }
388
255
 
389
256
  /* =====================
390
257
  FONT TOKENS