@transferwise/neptune-css 14.29.1 → 14.29.2

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.
@@ -133,6 +133,7 @@
133
133
  letter-spacing: -0.006em;
134
134
  font-weight: 400;
135
135
  font-weight: var(--font-weight-regular);
136
+ word-wrap: break-word;
136
137
  text-align: start;
137
138
  background-color: #ffffff;
138
139
  background-color: var(--color-background-screen);
@@ -147,6 +148,34 @@
147
148
  transform: translateY(-10px) scale(0.95, 0.95);
148
149
  visibility: hidden;
149
150
  }
151
+ @supports (hyphenate-limit-chars: 1) {
152
+ .dropdown-menu {
153
+ hyphens: auto;
154
+ hyphenate-limit-chars: 7 3;
155
+ }
156
+ @media (min-width: 840px) {
157
+ .dropdown-menu {
158
+ hyphenate-limit-chars: 8 3;
159
+ }
160
+ }
161
+ @media (min-width: 1160px) {
162
+ .dropdown-menu {
163
+ hyphenate-limit-chars: 10 4 3;
164
+ }
165
+ }
166
+ }
167
+ @supports (not (hyphenate-limit-chars: 1)) and (-webkit-hyphenate-limit-before: 1) {
168
+ .dropdown-menu {
169
+ hyphens: auto;
170
+ -webkit-hyphenate-limit-before: 3;
171
+ -webkit-hyphenate-limit-after: 3;
172
+ }
173
+ @media (min-width: 1160px) {
174
+ .dropdown-menu {
175
+ -webkit-hyphenate-limit-before: 4;
176
+ }
177
+ }
178
+ }
150
179
  .np-theme-personal .dropdown-menu,
151
180
  .np-theme-personal--forest-green .dropdown-menu,
152
181
  .np-theme-personal--dark .dropdown-menu {
@@ -188,10 +217,39 @@
188
217
  letter-spacing: -0.006em;
189
218
  font-weight: 400;
190
219
  font-weight: var(--font-weight-regular);
220
+ word-wrap: break-word;
191
221
  color: #37517e;
192
222
  color: var(--color-content-primary);
193
223
  white-space: nowrap;
194
224
  }
225
+ @supports (hyphenate-limit-chars: 1) {
226
+ .dropdown-menu > li > a {
227
+ hyphens: auto;
228
+ hyphenate-limit-chars: 7 3;
229
+ }
230
+ @media (min-width: 840px) {
231
+ .dropdown-menu > li > a {
232
+ hyphenate-limit-chars: 8 3;
233
+ }
234
+ }
235
+ @media (min-width: 1160px) {
236
+ .dropdown-menu > li > a {
237
+ hyphenate-limit-chars: 10 4 3;
238
+ }
239
+ }
240
+ }
241
+ @supports (not (hyphenate-limit-chars: 1)) and (-webkit-hyphenate-limit-before: 1) {
242
+ .dropdown-menu > li > a {
243
+ hyphens: auto;
244
+ -webkit-hyphenate-limit-before: 3;
245
+ -webkit-hyphenate-limit-after: 3;
246
+ }
247
+ @media (min-width: 1160px) {
248
+ .dropdown-menu > li > a {
249
+ -webkit-hyphenate-limit-before: 4;
250
+ }
251
+ }
252
+ }
195
253
  .dropdown-menu > li > a .secondary {
196
254
  display: block;
197
255
  white-space: normal;
@@ -366,6 +424,7 @@
366
424
  line-height: 1.2;
367
425
  line-height: var(--line-height-title);
368
426
  letter-spacing: 0;
427
+ word-wrap: break-word;
369
428
  font-weight: 500;
370
429
  font-weight: var(--font-weight-medium);
371
430
  font-size: 0.875rem;
@@ -1259,6 +1259,9 @@
1259
1259
  padding-block-end: var(--size-96);
1260
1260
  }
1261
1261
  }
1262
+ .np-text-hyphenated {
1263
+ word-wrap: break-word;
1264
+ }
1262
1265
  @supports (hyphenate-limit-chars: 1) {
1263
1266
  .np-text-hyphenated {
1264
1267
  hyphens: auto;
@@ -660,6 +660,7 @@ h6,
660
660
  line-height: 1.2;
661
661
  line-height: var(--line-height-title);
662
662
  letter-spacing: 0;
663
+ word-wrap: break-word;
663
664
  }
664
665
  @supports (hyphenate-limit-chars: 1) {
665
666
  .h1,
@@ -961,6 +962,65 @@ small,
961
962
  letter-spacing: -0.006em;
962
963
  font-weight: 400;
963
964
  font-weight: var(--font-weight-regular);
965
+ word-wrap: break-word;
966
+ }
967
+ @supports (hyphenate-limit-chars: 1) {
968
+ .body-2,
969
+ .body-3,
970
+ .small,
971
+ .tiny,
972
+ body,
973
+ small,
974
+ .np-text-body-default {
975
+ hyphens: auto;
976
+ hyphenate-limit-chars: 7 3;
977
+ }
978
+ @media (min-width: 840px) {
979
+ .body-2,
980
+ .body-3,
981
+ .small,
982
+ .tiny,
983
+ body,
984
+ small,
985
+ .np-text-body-default {
986
+ hyphenate-limit-chars: 8 3;
987
+ }
988
+ }
989
+ @media (min-width: 1160px) {
990
+ .body-2,
991
+ .body-3,
992
+ .small,
993
+ .tiny,
994
+ body,
995
+ small,
996
+ .np-text-body-default {
997
+ hyphenate-limit-chars: 10 4 3;
998
+ }
999
+ }
1000
+ }
1001
+ @supports (not (hyphenate-limit-chars: 1)) and (-webkit-hyphenate-limit-before: 1) {
1002
+ .body-2,
1003
+ .body-3,
1004
+ .small,
1005
+ .tiny,
1006
+ body,
1007
+ small,
1008
+ .np-text-body-default {
1009
+ hyphens: auto;
1010
+ -webkit-hyphenate-limit-before: 3;
1011
+ -webkit-hyphenate-limit-after: 3;
1012
+ }
1013
+ @media (min-width: 1160px) {
1014
+ .body-2,
1015
+ .body-3,
1016
+ .small,
1017
+ .tiny,
1018
+ body,
1019
+ small,
1020
+ .np-text-body-default {
1021
+ -webkit-hyphenate-limit-before: 4;
1022
+ }
1023
+ }
964
1024
  }
965
1025
  /* DEPRECATED: use .np-text-body-default-bold instead */
966
1026
  /* stylelint-disable-next-line selector-list-comma-newline-after */
@@ -974,6 +1034,50 @@ small,
974
1034
  letter-spacing: -0.006em;
975
1035
  font-weight: 600;
976
1036
  font-weight: var(--font-weight-semi-bold);
1037
+ word-wrap: break-word;
1038
+ }
1039
+ @supports (hyphenate-limit-chars: 1) {
1040
+ .control-2,
1041
+ .label,
1042
+ .control-label,
1043
+ .np-text-body-default-bold {
1044
+ hyphens: auto;
1045
+ hyphenate-limit-chars: 7 3;
1046
+ }
1047
+ @media (min-width: 840px) {
1048
+ .control-2,
1049
+ .label,
1050
+ .control-label,
1051
+ .np-text-body-default-bold {
1052
+ hyphenate-limit-chars: 8 3;
1053
+ }
1054
+ }
1055
+ @media (min-width: 1160px) {
1056
+ .control-2,
1057
+ .label,
1058
+ .control-label,
1059
+ .np-text-body-default-bold {
1060
+ hyphenate-limit-chars: 10 4 3;
1061
+ }
1062
+ }
1063
+ }
1064
+ @supports (not (hyphenate-limit-chars: 1)) and (-webkit-hyphenate-limit-before: 1) {
1065
+ .control-2,
1066
+ .label,
1067
+ .control-label,
1068
+ .np-text-body-default-bold {
1069
+ hyphens: auto;
1070
+ -webkit-hyphenate-limit-before: 3;
1071
+ -webkit-hyphenate-limit-after: 3;
1072
+ }
1073
+ @media (min-width: 1160px) {
1074
+ .control-2,
1075
+ .label,
1076
+ .control-label,
1077
+ .np-text-body-default-bold {
1078
+ -webkit-hyphenate-limit-before: 4;
1079
+ }
1080
+ }
977
1081
  }
978
1082
  /* DEPRECATED: use .np-text-body-large instead */
979
1083
  /* stylelint-disable-next-line selector-list-comma-newline-after */
@@ -986,6 +1090,45 @@ small,
986
1090
  font-size: var(--font-size-16);
987
1091
  line-height: 150%;
988
1092
  letter-spacing: -0.011em;
1093
+ word-wrap: break-word;
1094
+ }
1095
+ @supports (hyphenate-limit-chars: 1) {
1096
+ .body-1,
1097
+ .value,
1098
+ .np-text-body-large {
1099
+ hyphens: auto;
1100
+ hyphenate-limit-chars: 7 3;
1101
+ }
1102
+ @media (min-width: 840px) {
1103
+ .body-1,
1104
+ .value,
1105
+ .np-text-body-large {
1106
+ hyphenate-limit-chars: 8 3;
1107
+ }
1108
+ }
1109
+ @media (min-width: 1160px) {
1110
+ .body-1,
1111
+ .value,
1112
+ .np-text-body-large {
1113
+ hyphenate-limit-chars: 10 4 3;
1114
+ }
1115
+ }
1116
+ }
1117
+ @supports (not (hyphenate-limit-chars: 1)) and (-webkit-hyphenate-limit-before: 1) {
1118
+ .body-1,
1119
+ .value,
1120
+ .np-text-body-large {
1121
+ hyphens: auto;
1122
+ -webkit-hyphenate-limit-before: 3;
1123
+ -webkit-hyphenate-limit-after: 3;
1124
+ }
1125
+ @media (min-width: 1160px) {
1126
+ .body-1,
1127
+ .value,
1128
+ .np-text-body-large {
1129
+ -webkit-hyphenate-limit-before: 4;
1130
+ }
1131
+ }
989
1132
  }
990
1133
  /* DEPRECATED: use np-text-body-large-bold instead */
991
1134
  /* stylelint-disable-next-line selector-list-comma-newline-after */
@@ -997,6 +1140,40 @@ small,
997
1140
  font-size: var(--font-size-16);
998
1141
  line-height: 150%;
999
1142
  letter-spacing: -0.011em;
1143
+ word-wrap: break-word;
1144
+ }
1145
+ @supports (hyphenate-limit-chars: 1) {
1146
+ .control-1,
1147
+ .np-text-body-large-bold {
1148
+ hyphens: auto;
1149
+ hyphenate-limit-chars: 7 3;
1150
+ }
1151
+ @media (min-width: 840px) {
1152
+ .control-1,
1153
+ .np-text-body-large-bold {
1154
+ hyphenate-limit-chars: 8 3;
1155
+ }
1156
+ }
1157
+ @media (min-width: 1160px) {
1158
+ .control-1,
1159
+ .np-text-body-large-bold {
1160
+ hyphenate-limit-chars: 10 4 3;
1161
+ }
1162
+ }
1163
+ }
1164
+ @supports (not (hyphenate-limit-chars: 1)) and (-webkit-hyphenate-limit-before: 1) {
1165
+ .control-1,
1166
+ .np-text-body-large-bold {
1167
+ hyphens: auto;
1168
+ -webkit-hyphenate-limit-before: 3;
1169
+ -webkit-hyphenate-limit-after: 3;
1170
+ }
1171
+ @media (min-width: 1160px) {
1172
+ .control-1,
1173
+ .np-text-body-large-bold {
1174
+ -webkit-hyphenate-limit-before: 4;
1175
+ }
1176
+ }
1000
1177
  }
1001
1178
  a,
1002
1179
  .np-text-link-default,
@@ -1103,6 +1280,7 @@ a,
1103
1280
  .np-text-display-medium,
1104
1281
  .np-text-display-small {
1105
1282
  letter-spacing: normal;
1283
+ word-wrap: break-word;
1106
1284
  }
1107
1285
  @supports (hyphenate-limit-chars: 1) {
1108
1286
  .np-text-display-extra-large,
@@ -1191,6 +1369,13 @@ a,
1191
1369
  font-weight: 400;
1192
1370
  font-weight: var(--font-weight-regular);
1193
1371
  }
1372
+ /* Disable hyphenation for Japanese, Thai, and Chinese — these languages use character-level breaks and should never insert hyphens. */
1373
+ :lang(ja),
1374
+ :lang(th),
1375
+ :lang(zh-CN),
1376
+ :lang(zh-HK) {
1377
+ hyphens: none;
1378
+ }
1194
1379
  :lang(af) .np-text-display-extra-large,
1195
1380
  :lang(sq) .np-text-display-extra-large,
1196
1381
  :lang(eu) .np-text-display-extra-large,