@transferwise/neptune-css 0.0.0-experimental-4b93e2b → 0.0.0-experimental-f144cf1

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/dist/css/accordion.css +12 -0
  2. package/dist/css/button-groups.css +6 -0
  3. package/dist/css/buttons.css +2 -0
  4. package/dist/css/decision.css +12 -0
  5. package/dist/css/dropdowns.css +18 -2
  6. package/dist/css/droppable.css +6 -0
  7. package/dist/css/footer.css +12 -0
  8. package/dist/css/input-groups.css +42 -2
  9. package/dist/css/list-group.css +6 -0
  10. package/dist/css/navbar.css +18 -2
  11. package/dist/css/neptune-core.css +512 -4
  12. package/dist/css/neptune.css +640 -1426
  13. package/dist/css/popovers.css +18 -0
  14. package/dist/css/tooltip.css +6 -0
  15. package/dist/less/legacy-variables.css +0 -0
  16. package/dist/less/neptune-tokens.css +0 -0
  17. package/dist/less/neptune-tokens.less +0 -8
  18. package/dist/props/neptune-tokens.css +0 -8
  19. package/package.json +1 -1
  20. package/src/less/core/_typography.less +194 -26
  21. package/src/less/neptune.bundle.less +0 -2
package/dist/css/accordion.css CHANGED
@@ -60,6 +60,12 @@
60
60
  line-height: var(--line-height-title);
61
61
  letter-spacing: 0;
62
62
  word-wrap: break-word;
63
+ font-size: 1.125rem;
64
+ font-size: var(--font-size-18);
65
+ font-weight: 600;
66
+ font-weight: var(--font-weight-semi-bold);
67
+ letter-spacing: -0.014em;
68
+ line-height: 135%;
63
69
  }
64
70
  @supports (hyphenate-limit-chars: 1) {
65
71
  .decision__title {
@@ -96,6 +102,12 @@
96
102
  margin-block-start: var(--size-8);
97
103
  }
98
104
  .decision__content {
105
+ font-size: 0.875rem;
106
+ font-size: var(--font-size-14);
107
+ line-height: 155%;
108
+ letter-spacing: -0.006em;
109
+ font-weight: 400;
110
+ font-weight: var(--font-weight-regular);
99
111
  word-wrap: break-word;
100
112
  margin-block-start: 4px;
101
113
  margin-block-start: var(--size-4);
package/dist/css/button-groups.css CHANGED
@@ -346,6 +346,12 @@
346
346
  }
347
347
  }
348
348
  .btn-group .secondary {
349
+ font-size: 0.875rem;
350
+ font-size: var(--font-size-14);
351
+ line-height: 155%;
352
+ letter-spacing: -0.006em;
353
+ font-weight: 400;
354
+ font-weight: var(--font-weight-regular);
349
355
  word-wrap: break-word;
350
356
  color: #5d7079;
351
357
  color: var(--color-content-secondary);
package/dist/css/buttons.css CHANGED
@@ -2,6 +2,8 @@
2
2
  block-size: 32px;
3
3
  }
4
4
  .btn {
5
+ line-height: 150%;
6
+ letter-spacing: -0.011em;
5
7
  word-wrap: break-word;
6
8
  display: inline-block;
7
9
  margin-block-end: 0;
package/dist/css/decision.css CHANGED
@@ -22,6 +22,12 @@
22
22
  line-height: var(--line-height-title);
23
23
  letter-spacing: 0;
24
24
  word-wrap: break-word;
25
+ font-size: 1.125rem;
26
+ font-size: var(--font-size-18);
27
+ font-weight: 600;
28
+ font-weight: var(--font-weight-semi-bold);
29
+ letter-spacing: -0.014em;
30
+ line-height: 135%;
25
31
  }
26
32
  @supports (hyphenate-limit-chars: 1) {
27
33
  .decision__title {
@@ -58,6 +64,12 @@
58
64
  margin-block-start: var(--size-8);
59
65
  }
60
66
  .decision__content {
67
+ font-size: 0.875rem;
68
+ font-size: var(--font-size-14);
69
+ line-height: 155%;
70
+ letter-spacing: -0.006em;
71
+ font-weight: 400;
72
+ font-weight: var(--font-weight-regular);
61
73
  word-wrap: break-word;
62
74
  margin-block-start: 4px;
63
75
  margin-block-start: var(--size-4);
package/dist/css/dropdowns.css CHANGED
@@ -11,6 +11,12 @@
11
11
  padding: 8px;
12
12
  margin: 0;
13
13
  list-style: none;
14
+ font-size: 0.875rem;
15
+ font-size: var(--font-size-14);
16
+ line-height: 155%;
17
+ letter-spacing: -0.006em;
18
+ font-weight: 400;
19
+ font-weight: var(--font-weight-regular);
14
20
  word-wrap: break-word;
15
21
  text-align: start;
16
22
  background-color: #ffffff;
@@ -89,6 +95,12 @@
89
95
  padding: var(--dropdown-link-padding);
90
96
  clear: both;
91
97
  border-radius: 3px;
98
+ font-size: 0.875rem;
99
+ font-size: var(--font-size-14);
100
+ line-height: 155%;
101
+ letter-spacing: -0.006em;
102
+ font-weight: 400;
103
+ font-weight: var(--font-weight-regular);
92
104
  word-wrap: break-word;
93
105
  color: #37517e;
94
106
  color: var(--color-content-primary);
@@ -285,8 +297,6 @@
285
297
  display: block;
286
298
  padding-block: 8px;
287
299
  padding-inline: 16px;
288
- font-size: 0.875rem;
289
- font-size: var(--font-size-14);
290
300
  line-height: 1.5;
291
301
  line-height: var(--line-height-body);
292
302
  color: #5d7079;
@@ -299,6 +309,12 @@
299
309
  line-height: var(--line-height-title);
300
310
  letter-spacing: 0;
301
311
  word-wrap: break-word;
312
+ font-weight: 500;
313
+ font-weight: var(--font-weight-medium);
314
+ font-size: 0.875rem;
315
+ font-size: var(--font-size-14);
316
+ letter-spacing: -0.006em;
317
+ line-height: 140%;
302
318
  }
303
319
  @supports (hyphenate-limit-chars: 1) {
304
320
  .dropdown-header {
package/dist/css/droppable.css CHANGED
@@ -1,5 +1,11 @@
1
1
  .droppable {
2
2
  position: relative;
3
+ font-weight: 400;
4
+ font-weight: var(--font-weight-regular);
5
+ font-size: 1rem;
6
+ font-size: var(--font-size-16);
7
+ line-height: 150%;
8
+ letter-spacing: -0.011em;
3
9
  word-wrap: break-word;
4
10
  text-align: center;
5
11
  border: 1px solid #c9cbce;
package/dist/css/footer.css CHANGED
@@ -1,6 +1,12 @@
1
1
  .footer {
2
2
  background-color: rgba(134,167,189,0.10196);
3
3
  background-color: var(--color-background-neutral);
4
+ font-size: 0.875rem;
5
+ font-size: var(--font-size-14);
6
+ line-height: 155%;
7
+ letter-spacing: -0.006em;
8
+ font-weight: 400;
9
+ font-weight: var(--font-weight-regular);
4
10
  word-wrap: break-word;
5
11
  padding-block-start: calc(8px * 10);
6
12
  padding-block-start: calc(var(--size-8) * 10);
@@ -55,6 +61,12 @@
55
61
  .footer .link-icon {
56
62
  color: #5d7079;
57
63
  color: var(--color-content-secondary);
64
+ font-size: 0.875rem;
65
+ font-size: var(--font-size-14);
66
+ line-height: 155%;
67
+ letter-spacing: -0.006em;
68
+ font-weight: 400;
69
+ font-weight: var(--font-weight-regular);
58
70
  word-wrap: break-word;
59
71
  }
60
72
  @supports (hyphenate-limit-chars: 1) {
package/dist/css/input-groups.css CHANGED
@@ -88,11 +88,15 @@ output {
88
88
  border: 1px solid #c9cbce;
89
89
  border: 1px solid var(--color-interactive-secondary);
90
90
  transition: border-color ease-in-out 0.15s;
91
- font-size: 1rem;
92
- font-size: var(--font-size-16);
93
91
  min-block-size: var(--input-height-base);
94
92
  padding: var(--input-padding);
95
93
  border-radius: 3px;
94
+ font-weight: 400;
95
+ font-weight: var(--font-weight-regular);
96
+ font-size: 1rem;
97
+ font-size: var(--font-size-16);
98
+ line-height: 150%;
99
+ letter-spacing: -0.011em;
96
100
  word-wrap: break-word;
97
101
  background-clip: padding-box;
98
102
  }
@@ -306,6 +310,12 @@ fieldset[disabled] .checkbox label {
306
310
  border-radius: 3px;
307
311
  font-size: 14px;
308
312
  line-height: 24px;
313
+ font-size: 0.875rem;
314
+ font-size: var(--font-size-14);
315
+ line-height: 155%;
316
+ letter-spacing: -0.006em;
317
+ font-weight: 400;
318
+ font-weight: var(--font-weight-regular);
309
319
  word-wrap: break-word;
310
320
  }
311
321
  select.input-sm {
@@ -377,6 +387,12 @@ select[multiple].input-sm {
377
387
  min-block-size: var(--input-height-large);
378
388
  padding: var(--input-padding-large);
379
389
  border-radius: 3px;
390
+ font-weight: 400;
391
+ font-weight: var(--font-weight-regular);
392
+ font-size: 1rem;
393
+ font-size: var(--font-size-16);
394
+ line-height: 150%;
395
+ letter-spacing: -0.011em;
380
396
  word-wrap: break-word;
381
397
  }
382
398
  select.input-lg {
@@ -2003,6 +2019,12 @@ input[type="checkbox"]:not(.disabled):not(:disabled):indeterminate:active + .tw-
2003
2019
  .form-control-placeholder {
2004
2020
  text-overflow: ellipsis;
2005
2021
  overflow: hidden;
2022
+ font-weight: 400;
2023
+ font-weight: var(--font-weight-regular);
2024
+ font-size: 1rem;
2025
+ font-size: var(--font-size-16);
2026
+ line-height: 150%;
2027
+ letter-spacing: -0.011em;
2006
2028
  word-wrap: break-word;
2007
2029
  display: block;
2008
2030
  inline-size: 100%;
@@ -2248,6 +2270,12 @@ input[type="checkbox"]:not(.disabled):not(:disabled):indeterminate:active + .tw-
2248
2270
  min-block-size: var(--input-height-large);
2249
2271
  padding: var(--input-padding-large);
2250
2272
  border-radius: 3px;
2273
+ font-weight: 400;
2274
+ font-weight: var(--font-weight-regular);
2275
+ font-size: 1rem;
2276
+ font-size: var(--font-size-16);
2277
+ line-height: 150%;
2278
+ letter-spacing: -0.011em;
2251
2279
  margin: 0;
2252
2280
  color: #37517e;
2253
2281
  color: var(--color-content-primary);
@@ -2256,6 +2284,12 @@ input[type="checkbox"]:not(.disabled):not(:disabled):indeterminate:active + .tw-
2256
2284
  letter-spacing: 0;
2257
2285
  word-wrap: break-word;
2258
2286
  margin-block-end: initial;
2287
+ font-size: 1.375rem;
2288
+ font-size: var(--font-size-22);
2289
+ font-weight: 600;
2290
+ font-weight: var(--font-weight-semi-bold);
2291
+ letter-spacing: -0.018em;
2292
+ line-height: 125%;
2259
2293
  margin-block-end: 0;
2260
2294
  }
2261
2295
  select.input-group-lg > .form-control,
@@ -2366,6 +2400,12 @@ select[multiple].input-group-lg > .input-group-btn .btn {
2366
2400
  border-radius: 3px;
2367
2401
  font-size: 14px;
2368
2402
  line-height: 24px;
2403
+ font-size: 0.875rem;
2404
+ font-size: var(--font-size-14);
2405
+ line-height: 155%;
2406
+ letter-spacing: -0.006em;
2407
+ font-weight: 400;
2408
+ font-weight: var(--font-weight-regular);
2369
2409
  word-wrap: break-word;
2370
2410
  }
2371
2411
  select.input-group-sm > .form-control,
package/dist/css/list-group.css CHANGED
@@ -43,6 +43,12 @@
43
43
  line-height: var(--line-height-title);
44
44
  letter-spacing: 0;
45
45
  word-wrap: break-word;
46
+ font-weight: 500;
47
+ font-weight: var(--font-weight-medium);
48
+ font-size: 0.875rem;
49
+ font-size: var(--font-size-14);
50
+ letter-spacing: -0.006em;
51
+ line-height: 140%;
46
52
  color: #37517e;
47
53
  color: var(--color-content-primary);
48
54
  }
package/dist/css/navbar.css CHANGED
@@ -127,6 +127,12 @@
127
127
  padding: 8px;
128
128
  margin: 0;
129
129
  list-style: none;
130
+ font-size: 0.875rem;
131
+ font-size: var(--font-size-14);
132
+ line-height: 155%;
133
+ letter-spacing: -0.006em;
134
+ font-weight: 400;
135
+ font-weight: var(--font-weight-regular);
130
136
  word-wrap: break-word;
131
137
  text-align: start;
132
138
  background-color: #ffffff;
@@ -205,6 +211,12 @@
205
211
  padding: var(--dropdown-link-padding);
206
212
  clear: both;
207
213
  border-radius: 3px;
214
+ font-size: 0.875rem;
215
+ font-size: var(--font-size-14);
216
+ line-height: 155%;
217
+ letter-spacing: -0.006em;
218
+ font-weight: 400;
219
+ font-weight: var(--font-weight-regular);
208
220
  word-wrap: break-word;
209
221
  color: #37517e;
210
222
  color: var(--color-content-primary);
@@ -401,8 +413,6 @@
401
413
  display: block;
402
414
  padding-block: 8px;
403
415
  padding-inline: 16px;
404
- font-size: 0.875rem;
405
- font-size: var(--font-size-14);
406
416
  line-height: 1.5;
407
417
  line-height: var(--line-height-body);
408
418
  color: #5d7079;
@@ -415,6 +425,12 @@
415
425
  line-height: var(--line-height-title);
416
426
  letter-spacing: 0;
417
427
  word-wrap: break-word;
428
+ font-weight: 500;
429
+ font-weight: var(--font-weight-medium);
430
+ font-size: 0.875rem;
431
+ font-size: var(--font-size-14);
432
+ letter-spacing: -0.006em;
433
+ line-height: 140%;
418
434
  }
419
435
  @supports (hyphenate-limit-chars: 1) {
420
436
  .dropdown-header {