@transferwise/neptune-css 14.27.2 → 14.28.1

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 (40) hide show
  1. package/dist/css/accordion.css +4 -4
  2. package/dist/css/button-groups.css +6 -6
  3. package/dist/css/buttons.css +1 -1
  4. package/dist/css/circles.css +1 -1
  5. package/dist/css/column-layout.css +4 -4
  6. package/dist/css/decision.css +4 -4
  7. package/dist/css/dropdowns.css +10 -10
  8. package/dist/css/droppable.css +8 -8
  9. package/dist/css/flex.css +13 -15
  10. package/dist/css/footer.css +3 -3
  11. package/dist/css/grid.css +19 -19
  12. package/dist/css/input-groups.css +12 -12
  13. package/dist/css/list-group.css +8 -8
  14. package/dist/css/modals.css +3 -3
  15. package/dist/css/navbar.css +62 -62
  16. package/dist/css/navs.css +2 -2
  17. package/dist/css/neptune-addons.css +37 -53
  18. package/dist/css/neptune-core.css +27 -43
  19. package/dist/css/neptune.css +267 -335
  20. package/dist/css/panels.css +9 -9
  21. package/dist/css/popovers.css +13 -13
  22. package/dist/css/select.css +1 -1
  23. package/dist/css/sequences.css +6 -6
  24. package/dist/css/table.css +6 -6
  25. package/dist/css/utilities.css +8 -20
  26. package/dist/css/wells.css +4 -18
  27. package/dist/less/legacy-variables.less +34 -47
  28. package/dist/less/neptune-tokens.less +2 -2
  29. package/dist/props/custom-media.css +23 -11
  30. package/dist/props/neptune-tokens.css +1 -1
  31. package/package.json +6 -2
  32. package/src/less/addons/_display-utilities.less +13 -27
  33. package/src/less/core/_typography-utilities.less +10 -22
  34. package/src/less/flex.less +1 -3
  35. package/src/less/neptune.bundle.less +1 -0
  36. package/src/less/popovers.less +6 -6
  37. package/src/less/utilities.less +6 -14
  38. package/src/less/wells.less +3 -5
  39. package/src/props/custom-media.css +1 -11
  40. package/src/variables/legacy-variables.less +4 -47
@@ -139,107 +139,91 @@
139
139
  .visible-xl-inline-block {
140
140
  display: none !important;
141
141
  }
142
- @media (max-width: 575px) {
142
+ @media (max-width: 599.98px) {
143
143
  .visible-xs,
144
144
  .visible-xs-block {
145
145
  display: block !important;
146
146
  }
147
147
  }
148
- @media (max-width: 575px) {
148
+ @media (max-width: 599.98px) {
149
149
  .visible-xs-inline {
150
150
  display: inline !important;
151
151
  }
152
152
  }
153
- @media (max-width: 575px) {
153
+ @media (max-width: 599.98px) {
154
154
  .visible-xs-inline-block {
155
155
  display: inline-block !important;
156
156
  }
157
157
  }
158
- @media (min-width: 576px) and (max-width: 767px) {
158
+ @media (min-width: 600px) and (max-width: 839.98px) {
159
159
  .visible-sm,
160
160
  .visible-sm-block {
161
161
  display: block !important;
162
162
  }
163
163
  }
164
- @media (min-width: 576px) and (max-width: 767px) {
164
+ @media (min-width: 600px) and (max-width: 839.98px) {
165
165
  .visible-sm-inline {
166
166
  display: inline !important;
167
167
  }
168
168
  }
169
- @media (min-width: 576px) and (max-width: 767px) {
169
+ @media (min-width: 600px) and (max-width: 839.98px) {
170
170
  .visible-sm-inline-block {
171
171
  display: inline-block !important;
172
172
  }
173
173
  }
174
- @media (min-width: 768px) and (max-width: 991px) {
174
+ @media (min-width: 840px) and (max-width: 1159.98px) {
175
175
  .visible-md,
176
176
  .visible-md-block {
177
177
  display: block !important;
178
178
  }
179
179
  }
180
- @media (min-width: 768px) and (max-width: 991px) {
180
+ @media (min-width: 840px) and (max-width: 1159.98px) {
181
181
  .visible-md-inline {
182
182
  display: inline !important;
183
183
  }
184
184
  }
185
- @media (min-width: 768px) and (max-width: 991px) {
185
+ @media (min-width: 840px) and (max-width: 1159.98px) {
186
186
  .visible-md-inline-block {
187
187
  display: inline-block !important;
188
188
  }
189
189
  }
190
- @media (min-width: 992px) and (max-width: 1199px) {
190
+ @media (min-width: 1160px) {
191
191
  .visible-lg,
192
- .visible-lg-block {
193
- display: block !important;
194
- }
195
- }
196
- @media (min-width: 992px) and (max-width: 1199px) {
197
- .visible-lg-inline {
198
- display: inline !important;
199
- }
200
- }
201
- @media (min-width: 992px) and (max-width: 1199px) {
202
- .visible-lg-inline-block {
203
- display: inline-block !important;
204
- }
205
- }
206
- @media (min-width: 1200px) {
192
+ .visible-lg-block,
207
193
  .visible-xl,
208
194
  .visible-xl-block {
209
195
  display: block !important;
210
196
  }
211
197
  }
212
- @media (min-width: 1200px) {
198
+ @media (min-width: 1160px) {
199
+ .visible-lg-inline,
213
200
  .visible-xl-inline {
214
201
  display: inline !important;
215
202
  }
216
203
  }
217
- @media (min-width: 1200px) {
204
+ @media (min-width: 1160px) {
205
+ .visible-lg-inline-block,
218
206
  .visible-xl-inline-block {
219
207
  display: inline-block !important;
220
208
  }
221
209
  }
222
- @media (max-width: 575px) {
210
+ @media (max-width: 599.98px) {
223
211
  .hidden-xs {
224
212
  display: none !important;
225
213
  }
226
214
  }
227
- @media (min-width: 576px) and (max-width: 767px) {
215
+ @media (min-width: 600px) and (max-width: 839.98px) {
228
216
  .hidden-sm {
229
217
  display: none !important;
230
218
  }
231
219
  }
232
- @media (min-width: 768px) and (max-width: 991px) {
220
+ @media (min-width: 840px) and (max-width: 1159.98px) {
233
221
  .hidden-md {
234
222
  display: none !important;
235
223
  }
236
224
  }
237
- @media (min-width: 992px) and (max-width: 1199px) {
238
- .hidden-lg {
239
- display: none !important;
240
- }
241
- }
242
- @media (min-width: 1200px) {
225
+ @media (min-width: 1160px) {
226
+ .hidden-lg,
243
227
  .hidden-xl {
244
228
  display: none !important;
245
229
  }
@@ -1131,7 +1115,7 @@ html:not([dir="rtl"]) .p-a-panel {
1131
1115
  padding-left: 16px !important;
1132
1116
  padding-left: var(--size-16) !important;
1133
1117
  }
1134
- @media (min-width: 576px) {
1118
+ @media (min-width: 600px) {
1135
1119
  .m-a-panel {
1136
1120
  margin-top: 24px !important;
1137
1121
  margin-top: var(--size-24) !important;
@@ -1177,7 +1161,7 @@ html:not([dir="rtl"]) .p-a-panel {
1177
1161
  padding-left: var(--size-24) !important;
1178
1162
  }
1179
1163
  }
1180
- @media (min-width: 992px) {
1164
+ @media (min-width: 1160px) {
1181
1165
  .m-a-panel {
1182
1166
  margin-top: 32px !important;
1183
1167
  margin-top: var(--size-32) !important;
@@ -1251,7 +1235,7 @@ html:not([dir="rtl"]) .p-a-panel {
1251
1235
  padding-bottom: 16px !important;
1252
1236
  padding-bottom: var(--size-16) !important;
1253
1237
  }
1254
- @media (min-width: 576px) {
1238
+ @media (min-width: 600px) {
1255
1239
  .m-t-panel {
1256
1240
  margin-top: 24px !important;
1257
1241
  margin-top: var(--size-24) !important;
@@ -1281,7 +1265,7 @@ html:not([dir="rtl"]) .p-a-panel {
1281
1265
  padding-bottom: var(--size-24) !important;
1282
1266
  }
1283
1267
  }
1284
- @media (min-width: 992px) {
1268
+ @media (min-width: 1160px) {
1285
1269
  .m-t-panel {
1286
1270
  margin-top: 32px !important;
1287
1271
  margin-top: var(--size-32) !important;
@@ -1375,7 +1359,7 @@ html:not([dir="rtl"]) .p-x-panel {
1375
1359
  padding-right: 16px !important;
1376
1360
  padding-right: var(--size-16) !important;
1377
1361
  }
1378
- @media (min-width: 576px) {
1362
+ @media (min-width: 600px) {
1379
1363
  [dir="rtl"] .m-l-panel {
1380
1364
  margin-right: 24px !important;
1381
1365
  margin-right: var(--size-24) !important;
@@ -1441,7 +1425,7 @@ html:not([dir="rtl"]) .p-x-panel {
1441
1425
  padding-right: var(--size-24) !important;
1442
1426
  }
1443
1427
  }
1444
- @media (min-width: 992px) {
1428
+ @media (min-width: 1160px) {
1445
1429
  [dir="rtl"] .m-l-panel {
1446
1430
  margin-right: 32px !important;
1447
1431
  margin-right: var(--size-32) !important;
@@ -1535,7 +1519,7 @@ html:not([dir="rtl"]) .p-x-panel {
1535
1519
  padding-bottom: 16px !important;
1536
1520
  padding-bottom: var(--size-16) !important;
1537
1521
  }
1538
- @media (min-width: 576px) {
1522
+ @media (min-width: 600px) {
1539
1523
  .m-t-section-1 {
1540
1524
  margin-top: 24px !important;
1541
1525
  margin-top: var(--size-24) !important;
@@ -1565,7 +1549,7 @@ html:not([dir="rtl"]) .p-x-panel {
1565
1549
  padding-bottom: var(--size-24) !important;
1566
1550
  }
1567
1551
  }
1568
- @media (min-width: 992px) {
1552
+ @media (min-width: 1160px) {
1569
1553
  .m-t-section-1 {
1570
1554
  margin-top: 32px !important;
1571
1555
  margin-top: var(--size-32) !important;
@@ -1623,7 +1607,7 @@ html:not([dir="rtl"]) .p-x-panel {
1623
1607
  padding-bottom: 32px !important;
1624
1608
  padding-bottom: var(--size-32) !important;
1625
1609
  }
1626
- @media (min-width: 576px) {
1610
+ @media (min-width: 600px) {
1627
1611
  .m-t-section-2 {
1628
1612
  margin-top: 48px !important;
1629
1613
  margin-top: var(--size-48) !important;
@@ -1653,7 +1637,7 @@ html:not([dir="rtl"]) .p-x-panel {
1653
1637
  padding-bottom: var(--size-48) !important;
1654
1638
  }
1655
1639
  }
1656
- @media (min-width: 992px) {
1640
+ @media (min-width: 1160px) {
1657
1641
  .m-t-section-2 {
1658
1642
  margin-top: 64px !important;
1659
1643
  margin-top: var(--size-64) !important;
@@ -1711,7 +1695,7 @@ html:not([dir="rtl"]) .p-x-panel {
1711
1695
  padding-bottom: 48px !important;
1712
1696
  padding-bottom: var(--size-48) !important;
1713
1697
  }
1714
- @media (min-width: 576px) {
1698
+ @media (min-width: 600px) {
1715
1699
  .m-t-section-3 {
1716
1700
  margin-top: 72px !important;
1717
1701
  margin-top: var(--size-72) !important;
@@ -1741,7 +1725,7 @@ html:not([dir="rtl"]) .p-x-panel {
1741
1725
  padding-bottom: var(--size-72) !important;
1742
1726
  }
1743
1727
  }
1744
- @media (min-width: 992px) {
1728
+ @media (min-width: 1160px) {
1745
1729
  .m-t-section-3 {
1746
1730
  margin-top: 96px !important;
1747
1731
  margin-top: var(--size-96) !important;
@@ -1807,7 +1791,7 @@ html:not([dir="rtl"]) .p-x-panel {
1807
1791
  padding-bottom: 48px;
1808
1792
  padding-bottom: var(--size-48);
1809
1793
  }
1810
- @media (min-width: 576px) {
1794
+ @media (min-width: 600px) {
1811
1795
  .section {
1812
1796
  padding-top: 72px;
1813
1797
  padding-top: var(--size-72);
@@ -1815,7 +1799,7 @@ html:not([dir="rtl"]) .p-x-panel {
1815
1799
  padding-bottom: var(--size-72);
1816
1800
  }
1817
1801
  }
1818
- @media (min-width: 992px) {
1802
+ @media (min-width: 1160px) {
1819
1803
  .section {
1820
1804
  padding-top: 96px;
1821
1805
  padding-top: var(--size-96);
@@ -1828,12 +1812,12 @@ html:not([dir="rtl"]) .p-x-panel {
1828
1812
  hyphens: auto;
1829
1813
  hyphenate-limit-chars: 7 3;
1830
1814
  }
1831
- @media (min-width: 768px) {
1815
+ @media (min-width: 840px) {
1832
1816
  .np-text-hyphenated {
1833
1817
  hyphenate-limit-chars: 8 3;
1834
1818
  }
1835
1819
  }
1836
- @media (min-width: 992px) {
1820
+ @media (min-width: 1160px) {
1837
1821
  .np-text-hyphenated {
1838
1822
  hyphenate-limit-chars: 10 4 3;
1839
1823
  }
@@ -1845,7 +1829,7 @@ html:not([dir="rtl"]) .p-x-panel {
1845
1829
  -webkit-hyphenate-limit-before: 3;
1846
1830
  -webkit-hyphenate-limit-after: 3;
1847
1831
  }
1848
- @media (min-width: 992px) {
1832
+ @media (min-width: 1160px) {
1849
1833
  .np-text-hyphenated {
1850
1834
  -webkit-hyphenate-limit-before: 4;
1851
1835
  }
@@ -549,7 +549,7 @@ dd {
549
549
  color: #37517e;
550
550
  color: var(--color-content-primary);
551
551
  }
552
- @media (min-width: 576px) {
552
+ @media (min-width: 600px) {
553
553
  dd {
554
554
  margin-bottom: 24px;
555
555
  margin-bottom: var(--size-24);
@@ -564,7 +564,7 @@ dd {
564
564
  .dl-horizontal dd::after {
565
565
  clear: both;
566
566
  }
567
- @media (min-width: 576px) {
567
+ @media (min-width: 600px) {
568
568
  .dl-horizontal dt {
569
569
  float: left;
570
570
  clear: left;
@@ -620,13 +620,13 @@ hr {
620
620
  .bg-primary hr {
621
621
  border-top: 1px solid rgba(255,255,255,0.10196);
622
622
  }
623
- @media (min-width: 576px) {
623
+ @media (min-width: 600px) {
624
624
  hr {
625
625
  margin: 24px auto;
626
626
  margin: var(--size-24) auto;
627
627
  }
628
628
  }
629
- @media (min-width: 992px) {
629
+ @media (min-width: 1160px) {
630
630
  hr {
631
631
  margin: 32px auto;
632
632
  margin: var(--size-32) auto;
@@ -740,7 +740,7 @@ h6,
740
740
  hyphens: auto;
741
741
  hyphenate-limit-chars: 7 3;
742
742
  }
743
- @media (min-width: 768px) {
743
+ @media (min-width: 840px) {
744
744
  .h1,
745
745
  .h2,
746
746
  .h3,
@@ -766,7 +766,7 @@ h6,
766
766
  hyphenate-limit-chars: 8 3;
767
767
  }
768
768
  }
769
- @media (min-width: 992px) {
769
+ @media (min-width: 1160px) {
770
770
  .h1,
771
771
  .h2,
772
772
  .h3,
@@ -820,7 +820,7 @@ h6,
820
820
  -webkit-hyphenate-limit-before: 3;
821
821
  -webkit-hyphenate-limit-after: 3;
822
822
  }
823
- @media (min-width: 992px) {
823
+ @media (min-width: 1160px) {
824
824
  .h1,
825
825
  .h2,
826
826
  .h3,
@@ -1168,7 +1168,7 @@ a,
1168
1168
  hyphens: auto;
1169
1169
  hyphenate-limit-chars: 7 3;
1170
1170
  }
1171
- @media (min-width: 768px) {
1171
+ @media (min-width: 840px) {
1172
1172
  .np-text-display-extra-large,
1173
1173
  .np-text-display-large,
1174
1174
  .np-text-display-medium,
@@ -1176,7 +1176,7 @@ a,
1176
1176
  hyphenate-limit-chars: 8 3;
1177
1177
  }
1178
1178
  }
1179
- @media (min-width: 992px) {
1179
+ @media (min-width: 1160px) {
1180
1180
  .np-text-display-extra-large,
1181
1181
  .np-text-display-large,
1182
1182
  .np-text-display-medium,
@@ -1194,7 +1194,7 @@ a,
1194
1194
  -webkit-hyphenate-limit-before: 3;
1195
1195
  -webkit-hyphenate-limit-after: 3;
1196
1196
  }
1197
- @media (min-width: 992px) {
1197
+ @media (min-width: 1160px) {
1198
1198
  .np-text-display-extra-large,
1199
1199
  .np-text-display-large,
1200
1200
  .np-text-display-medium,
@@ -1598,7 +1598,7 @@ a,
1598
1598
  /* stylelint-disable-next-line number-max-precision */
1599
1599
  font-size: 3.73333333rem;
1600
1600
  }
1601
- @media (min-width: 768px) {
1601
+ @media (min-width: 840px) {
1602
1602
  .display-1 {
1603
1603
  margin-bottom: 8px;
1604
1604
  margin-bottom: var(--size-8);
@@ -1612,7 +1612,7 @@ a,
1612
1612
  /* stylelint-disable-next-line number-max-precision */
1613
1613
  font-size: 3.73333333rem;
1614
1614
  }
1615
- @media (min-width: 768px) {
1615
+ @media (min-width: 840px) {
1616
1616
  .display-2 {
1617
1617
  margin-bottom: 16px;
1618
1618
  margin-bottom: var(--size-16);
@@ -1625,7 +1625,7 @@ a,
1625
1625
  margin-bottom: var(--size-8);
1626
1626
  font-size: 2.8rem;
1627
1627
  }
1628
- @media (min-width: 768px) {
1628
+ @media (min-width: 840px) {
1629
1629
  .display-3 {
1630
1630
  margin-bottom: 24px;
1631
1631
  margin-bottom: var(--size-24);
@@ -1639,7 +1639,7 @@ a,
1639
1639
  /* stylelint-disable-next-line number-max-precision */
1640
1640
  font-size: 1.86666667rem;
1641
1641
  }
1642
- @media (min-width: 768px) {
1642
+ @media (min-width: 840px) {
1643
1643
  .display-4 {
1644
1644
  margin-bottom: 24px;
1645
1645
  margin-bottom: var(--size-24);
@@ -1653,7 +1653,7 @@ a,
1653
1653
  /* stylelint-disable-next-line number-max-precision */
1654
1654
  font-size: 1.86666667rem;
1655
1655
  }
1656
- @media (min-width: 768px) {
1656
+ @media (min-width: 840px) {
1657
1657
  .display-5 {
1658
1658
  margin-bottom: 8px;
1659
1659
  margin-bottom: var(--size-8);
@@ -1751,13 +1751,13 @@ blockquote footer {
1751
1751
  blockquote footer::before {
1752
1752
  content: "\2014 \00A0";
1753
1753
  }
1754
- @media (min-width: 576px) {
1754
+ @media (min-width: 600px) {
1755
1755
  blockquote {
1756
1756
  margin: 24px;
1757
1757
  margin: var(--size-24);
1758
1758
  }
1759
1759
  }
1760
- @media (min-width: 992px) {
1760
+ @media (min-width: 1160px) {
1761
1761
  blockquote {
1762
1762
  margin: 32px;
1763
1763
  margin: var(--size-32);
@@ -1876,7 +1876,7 @@ kbd kbd {
1876
1876
  .text-xs-nowrap {
1877
1877
  white-space: nowrap;
1878
1878
  }
1879
- @media (min-width: 576px) {
1879
+ @media (min-width: 600px) {
1880
1880
  .text-sm-left {
1881
1881
  text-align: left;
1882
1882
  }
@@ -1899,7 +1899,7 @@ kbd kbd {
1899
1899
  white-space: nowrap;
1900
1900
  }
1901
1901
  }
1902
- @media (min-width: 768px) {
1902
+ @media (min-width: 840px) {
1903
1903
  .text-md-left {
1904
1904
  text-align: left;
1905
1905
  }
@@ -1922,48 +1922,32 @@ kbd kbd {
1922
1922
  white-space: nowrap;
1923
1923
  }
1924
1924
  }
1925
- @media (min-width: 992px) {
1926
- .text-lg-left {
1927
- text-align: left;
1928
- }
1929
- [dir="rtl"] .text-lg-left {
1930
- text-align: right;
1931
- }
1932
- .text-lg-right {
1933
- text-align: right;
1934
- }
1935
- [dir="rtl"] .text-lg-right {
1936
- text-align: left;
1937
- }
1938
- .text-lg-center {
1939
- text-align: center;
1940
- }
1941
- .text-lg-justify {
1942
- text-align: justify;
1943
- }
1944
- .text-lg-nowrap {
1945
- white-space: nowrap;
1946
- }
1947
- }
1948
- @media (min-width: 1200px) {
1925
+ @media (min-width: 1160px) {
1926
+ .text-lg-left,
1949
1927
  .text-xl-left {
1950
1928
  text-align: left;
1951
1929
  }
1930
+ [dir="rtl"] .text-lg-left,
1952
1931
  [dir="rtl"] .text-xl-left {
1953
1932
  text-align: right;
1954
1933
  }
1934
+ .text-lg-right,
1955
1935
  .text-xl-right {
1956
1936
  text-align: right;
1957
1937
  }
1938
+ [dir="rtl"] .text-lg-right,
1958
1939
  [dir="rtl"] .text-xl-right {
1959
1940
  text-align: left;
1960
1941
  }
1942
+ .text-lg-center,
1961
1943
  .text-xl-center {
1962
1944
  text-align: center;
1963
1945
  }
1946
+ .text-lg-justify,
1964
1947
  .text-xl-justify {
1965
1948
  text-align: justify;
1966
1949
  }
1950
+ .text-lg-nowrap,
1967
1951
  .text-xl-nowrap {
1968
1952
  white-space: nowrap;
1969
1953
  }