@transferwise/neptune-css 0.0.0-experimental-d672ed6 → 0.0.0-experimental-0e8eafd

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 (50) hide show
  1. package/dist/css/border-radius.css +1 -1
  2. package/dist/css/flex.css +1 -1
  3. package/dist/css/navbar-base.css +1 -1
  4. package/dist/css/navbar.css +1 -1
  5. package/dist/css/neptune-addons.css +1 -1
  6. package/dist/css/neptune-core.css +1 -1
  7. package/dist/css/neptune.css +1 -1
  8. package/dist/css/utilities.css +1 -1
  9. package/package.json +1 -1
  10. package/src/less/addons/_display-utilities.less +159 -0
  11. package/src/less/addons/_spacing-utilities.less +26 -3
  12. package/src/less/addons/_utilities.less +147 -0
  13. package/src/less/border-radius.less +3 -1
  14. package/src/less/core/_scaffolding.less +33 -4
  15. package/src/less/core/_typography-utilities.less +241 -15
  16. package/src/less/flex.less +18 -9
  17. package/src/less/{addons → mixins}/_center-block.less +4 -2
  18. package/src/less/mixins/_flex.less +105 -0
  19. package/src/less/navbar.less +2 -10
  20. package/src/less/neptune-addons.less +1 -4
  21. package/src/less/utilities.less +141 -30
  22. package/src/less/utilities/align-items.less +0 -139
  23. package/src/less/utilities/align-self.less +0 -139
  24. package/src/less/utilities/border-radius.less +0 -11
  25. package/src/less/utilities/color.less +0 -70
  26. package/src/less/utilities/cursor.less +0 -3
  27. package/src/less/utilities/display.less +0 -333
  28. package/src/less/utilities/flex-direction.less +0 -55
  29. package/src/less/utilities/flex-grow.less +0 -27
  30. package/src/less/utilities/flex-wrap.less +0 -55
  31. package/src/less/utilities/float.less +0 -93
  32. package/src/less/utilities/font-style.less +0 -3
  33. package/src/less/utilities/font-weight.less +0 -11
  34. package/src/less/utilities/gap.less +0 -3
  35. package/src/less/utilities/justify-content.less +0 -139
  36. package/src/less/utilities/margin.less +0 -192
  37. package/src/less/utilities/max-width.less +0 -3
  38. package/src/less/utilities/order.less +0 -111
  39. package/src/less/utilities/outline-style.less +0 -8
  40. package/src/less/utilities/overflow-wrap.less +0 -3
  41. package/src/less/utilities/padding.less +0 -179
  42. package/src/less/utilities/position.less +0 -3
  43. package/src/less/utilities/rotate.less +0 -12
  44. package/src/less/utilities/screen-reader.less +0 -24
  45. package/src/less/utilities/text-align.less +0 -111
  46. package/src/less/utilities/text-decoration-line.less +0 -8
  47. package/src/less/utilities/text-overflow.less +0 -7
  48. package/src/less/utilities/text-transform.less +0 -11
  49. package/src/less/utilities/visibility.less +0 -3
  50. package/src/less/utilities/white-space.less +0 -27
package/src/less/utilities/flex-direction.less DELETED
@@ -1,55 +0,0 @@
1
- .flex-row {
2
- flex-direction: row;
3
- }
4
-
5
- @media (--screen-sm) {
6
- .flex-row--sm {
7
- flex-direction: row;
8
- }
9
- }
10
-
11
- @media (--screen-md) {
12
- .flex-row--md {
13
- flex-direction: row;
14
- }
15
- }
16
-
17
- @media (--screen-lg) {
18
- .flex-row--lg {
19
- flex-direction: row;
20
- }
21
- }
22
-
23
- @media (--screen-xl) {
24
- .flex-row--xl {
25
- flex-direction: row;
26
- }
27
- }
28
-
29
- .flex-column {
30
- flex-direction: column;
31
- }
32
-
33
- @media (--screen-sm) {
34
- .flex-column--sm {
35
- flex-direction: column;
36
- }
37
- }
38
-
39
- @media (--screen-md) {
40
- .flex-column--md {
41
- flex-direction: column;
42
- }
43
- }
44
-
45
- @media (--screen-lg) {
46
- .flex-column--lg {
47
- flex-direction: column;
48
- }
49
- }
50
-
51
- @media (--screen-xl) {
52
- .flex-column--xl {
53
- flex-direction: column;
54
- }
55
- }
package/src/less/utilities/flex-grow.less DELETED
@@ -1,27 +0,0 @@
1
- .flex-grow-1 {
2
- flex-grow: 1;
3
- }
4
-
5
- @media (--screen-sm) {
6
- .flex-grow-1--sm {
7
- flex-grow: 1;
8
- }
9
- }
10
-
11
- @media (--screen-md) {
12
- .flex-grow-1--md {
13
- flex-grow: 1;
14
- }
15
- }
16
-
17
- @media (--screen-lg) {
18
- .flex-grow-1--lg {
19
- flex-grow: 1;
20
- }
21
- }
22
-
23
- @media (--screen-xl) {
24
- .flex-grow-1--xl {
25
- flex-grow: 1;
26
- }
27
- }
package/src/less/utilities/flex-wrap.less DELETED
@@ -1,55 +0,0 @@
1
- .flex-wrap {
2
- flex-wrap: wrap;
3
- }
4
-
5
- @media (--screen-sm) {
6
- .flex-wrap--sm {
7
- flex-wrap: wrap;
8
- }
9
- }
10
-
11
- @media (--screen-md) {
12
- .flex-wrap--md {
13
- flex-wrap: wrap;
14
- }
15
- }
16
-
17
- @media (--screen-lg) {
18
- .flex-wrap--lg {
19
- flex-wrap: wrap;
20
- }
21
- }
22
-
23
- @media (--screen-xl) {
24
- .flex-wrap--xl {
25
- flex-wrap: wrap;
26
- }
27
- }
28
-
29
- .flex-nowrap {
30
- flex-wrap: nowrap;
31
- }
32
-
33
- @media (--screen-sm) {
34
- .flex-nowrap--sm {
35
- flex-wrap: nowrap;
36
- }
37
- }
38
-
39
- @media (--screen-md) {
40
- .flex-nowrap--md {
41
- flex-wrap: nowrap;
42
- }
43
- }
44
-
45
- @media (--screen-lg) {
46
- .flex-nowrap--lg {
47
- flex-wrap: nowrap;
48
- }
49
- }
50
-
51
- @media (--screen-xl) {
52
- .flex-nowrap--xl {
53
- flex-wrap: nowrap;
54
- }
55
- }
package/src/less/utilities/float.less DELETED
@@ -1,93 +0,0 @@
1
- .pull-left,
2
- .pull-xs-left {
3
- float: inline-start !important;
4
- }
5
-
6
- @media (--screen-sm) {
7
- .pull-sm-left {
8
- float: inline-start !important;
9
- }
10
- }
11
-
12
- @media (--screen-md) {
13
- .pull-md-left {
14
- float: inline-start !important;
15
- }
16
- }
17
-
18
- @media (--screen-lg) {
19
- .pull-lg-left {
20
- float: inline-start !important;
21
- }
22
- }
23
-
24
- @media (--screen-xl) {
25
- .pull-xl-left {
26
- float: inline-start !important;
27
- }
28
- }
29
-
30
- .pull-right,
31
- .pull-xs-right {
32
- float: inline-end !important;
33
- }
34
-
35
- @media (--screen-sm) {
36
- .pull-sm-right {
37
- float: inline-end !important;
38
- }
39
- }
40
-
41
- @media (--screen-md) {
42
- .pull-md-right {
43
- float: inline-end !important;
44
- }
45
- }
46
-
47
- @media (--screen-lg) {
48
- .pull-lg-right {
49
- float: inline-end !important;
50
- }
51
- }
52
-
53
- @media (--screen-xl) {
54
- .pull-xl-right {
55
- float: inline-end !important;
56
- }
57
- }
58
-
59
- .pull-right-single-direction {
60
- float: right !important;
61
- }
62
-
63
- .pull-left-single-direction {
64
- float: left !important;
65
- }
66
-
67
- .pull-xs-none {
68
- float: none !important;
69
- }
70
-
71
- @media (--screen-sm) {
72
- .pull-sm-none {
73
- float: none !important;
74
- }
75
- }
76
-
77
- @media (--screen-md) {
78
- .pull-md-none {
79
- float: none !important;
80
- }
81
- }
82
-
83
- @media (--screen-lg) {
84
- .pull-lg-none {
85
- float: none !important;
86
- }
87
- }
88
-
89
- @media (--screen-xl) {
90
- .pull-xl-none {
91
- float: none !important;
92
- }
93
- }
package/src/less/utilities/font-style.less DELETED
@@ -1,3 +0,0 @@
1
- .font-italic {
2
- font-style: italic !important;
3
- }
package/src/less/utilities/font-weight.less DELETED
@@ -1,11 +0,0 @@
1
- .font-weight-normal {
2
- font-weight: var(--font-weight-regular) !important;
3
- }
4
-
5
- .font-weight-semi-bold {
6
- font-weight: var(--font-weight-semi-bold) !important;
7
- }
8
-
9
- .font-weight-bold {
10
- font-weight: var(--font-weight-bold) !important;
11
- }
package/src/less/utilities/gap.less DELETED
@@ -1,3 +0,0 @@
1
- .gap-y-1 {
2
- row-gap: var(--size-8);
3
- }
package/src/less/utilities/justify-content.less DELETED
@@ -1,139 +0,0 @@
1
- .justify-content-start {
2
- justify-content: flex-start;
3
- }
4
-
5
- @media (--screen-sm) {
6
- .justify-content-start--sm {
7
- justify-content: flex-start;
8
- }
9
- }
10
-
11
- @media (--screen-md) {
12
- .justify-content-start--md {
13
- justify-content: flex-start;
14
- }
15
- }
16
-
17
- @media (--screen-lg) {
18
- .justify-content-start--lg {
19
- justify-content: flex-start;
20
- }
21
- }
22
-
23
- @media (--screen-xl) {
24
- .justify-content-start--xl {
25
- justify-content: flex-start;
26
- }
27
- }
28
-
29
- .justify-content-end {
30
- justify-content: flex-end;
31
- }
32
-
33
- @media (--screen-sm) {
34
- .justify-content-end--sm {
35
- justify-content: flex-end;
36
- }
37
- }
38
-
39
- @media (--screen-md) {
40
- .justify-content-end--md {
41
- justify-content: flex-end;
42
- }
43
- }
44
-
45
- @media (--screen-lg) {
46
- .justify-content-end--lg {
47
- justify-content: flex-end;
48
- }
49
- }
50
-
51
- @media (--screen-xl) {
52
- .justify-content-end--xl {
53
- justify-content: flex-end;
54
- }
55
- }
56
-
57
- .justify-content-center {
58
- justify-content: center;
59
- }
60
-
61
- @media (--screen-sm) {
62
- .justify-content-center--sm {
63
- justify-content: center;
64
- }
65
- }
66
-
67
- @media (--screen-md) {
68
- .justify-content-center--md {
69
- justify-content: center;
70
- }
71
- }
72
-
73
- @media (--screen-lg) {
74
- .justify-content-center--lg {
75
- justify-content: center;
76
- }
77
- }
78
-
79
- @media (--screen-xl) {
80
- .justify-content-center--xl {
81
- justify-content: center;
82
- }
83
- }
84
-
85
- .justify-content-between {
86
- justify-content: space-between;
87
- }
88
-
89
- @media (--screen-sm) {
90
- .justify-content-between--sm {
91
- justify-content: space-between;
92
- }
93
- }
94
-
95
- @media (--screen-md) {
96
- .justify-content-between--md {
97
- justify-content: space-between;
98
- }
99
- }
100
-
101
- @media (--screen-lg) {
102
- .justify-content-between--lg {
103
- justify-content: space-between;
104
- }
105
- }
106
-
107
- @media (--screen-xl) {
108
- .justify-content-between--xl {
109
- justify-content: space-between;
110
- }
111
- }
112
-
113
- .justify-content-around {
114
- justify-content: space-around;
115
- }
116
-
117
- @media (--screen-sm) {
118
- .justify-content-around--sm {
119
- justify-content: space-around;
120
- }
121
- }
122
-
123
- @media (--screen-md) {
124
- .justify-content-around--md {
125
- justify-content: space-around;
126
- }
127
- }
128
-
129
- @media (--screen-lg) {
130
- .justify-content-around--lg {
131
- justify-content: space-around;
132
- }
133
- }
134
-
135
- @media (--screen-xl) {
136
- .justify-content-around--xl {
137
- justify-content: space-around;
138
- }
139
- }
package/src/less/utilities/margin.less DELETED
@@ -1,192 +0,0 @@
1
- .m-a-0 {
2
- margin: 0px !important;
3
- }
4
-
5
- .m-a-1 {
6
- margin: var(--size-8) !important;
7
- }
8
-
9
- .m-a-2 {
10
- margin: var(--size-16) !important;
11
- }
12
-
13
- .m-a-3 {
14
- margin: var(--size-24) !important;
15
- }
16
-
17
- .m-a-4 {
18
- margin: var(--size-32) !important;
19
- }
20
-
21
- .m-a-5 {
22
- margin: var(--size-40) !important;
23
- }
24
-
25
- .m-x-0 {
26
- margin-left: 0px !important;
27
- margin-right: 0px !important;
28
- }
29
-
30
- .m-x-1 {
31
- margin-left: var(--size-8) !important;
32
- margin-right: var(--size-8) !important;
33
- }
34
-
35
- .m-x-2 {
36
- margin-left: var(--size-16) !important;
37
- margin-right: var(--size-16) !important;
38
- }
39
-
40
- .m-x-3 {
41
- margin-left: var(--size-24) !important;
42
- margin-right: var(--size-24) !important;
43
- }
44
-
45
- .m-x-4 {
46
- margin-left: var(--size-32) !important;
47
- margin-right: var(--size-32) !important;
48
- }
49
-
50
- .m-x-5 {
51
- margin-left: var(--size-40) !important;
52
- margin-right: var(--size-40) !important;
53
- }
54
-
55
- .m-x-auto {
56
- margin-left: auto !important;
57
- margin-right: auto !important;
58
- }
59
-
60
- .m-y-0 {
61
- margin-top: 0px !important;
62
- margin-bottom: 0px !important;
63
- }
64
-
65
- .m-y-1 {
66
- margin-top: var(--size-8) !important;
67
- margin-bottom: var(--size-8) !important;
68
- }
69
-
70
- .m-y-2 {
71
- margin-top: var(--size-16) !important;
72
- margin-bottom: var(--size-16) !important;
73
- }
74
-
75
- .m-y-3 {
76
- margin-top: var(--size-24) !important;
77
- margin-bottom: var(--size-24) !important;
78
- }
79
-
80
- .m-y-4 {
81
- margin-top: var(--size-32) !important;
82
- margin-bottom: var(--size-32) !important;
83
- }
84
-
85
- .m-y-5 {
86
- margin-top: var(--size-40) !important;
87
- margin-bottom: var(--size-40) !important;
88
- }
89
-
90
- .m-l-0 {
91
- margin-inline-start: 0px !important;
92
- }
93
-
94
- .m-l-1 {
95
- margin-inline-start: var(--size-8) !important;
96
- }
97
-
98
- .m-l-2 {
99
- margin-inline-start: var(--size-16) !important;
100
- }
101
-
102
- .m-l-3 {
103
- margin-inline-start: var(--size-24) !important;
104
- }
105
-
106
- .m-l-4 {
107
- margin-inline-start: var(--size-32) !important;
108
- }
109
-
110
- .m-l-5 {
111
- margin-inline-start: var(--size-40) !important;
112
- }
113
-
114
- .m-l-auto {
115
- margin-inline-start: auto !important;
116
- }
117
-
118
- .m-r-0 {
119
- margin-inline-end: 0px !important;
120
- }
121
-
122
- .m-r-1 {
123
- margin-inline-end: var(--size-8) !important;
124
- }
125
-
126
- .m-r-2 {
127
- margin-inline-end: var(--size-16) !important;
128
- }
129
-
130
- .m-r-3 {
131
- margin-inline-end: var(--size-24) !important;
132
- }
133
-
134
- .m-r-4 {
135
- margin-inline-end: var(--size-32) !important;
136
- }
137
-
138
- .m-r-5 {
139
- margin-inline-end: var(--size-40) !important;
140
- }
141
-
142
- .m-r-auto {
143
- margin-inline-end: auto !important;
144
- }
145
-
146
- .m-t-0 {
147
- margin-top: 0px !important;
148
- }
149
-
150
- .m-t-1 {
151
- margin-top: var(--size-8) !important;
152
- }
153
-
154
- .m-t-2 {
155
- margin-top: var(--size-16) !important;
156
- }
157
-
158
- .m-t-3 {
159
- margin-top: var(--size-24) !important;
160
- }
161
-
162
- .m-t-4 {
163
- margin-top: var(--size-32) !important;
164
- }
165
-
166
- .m-t-5 {
167
- margin-top: var(--size-40) !important;
168
- }
169
-
170
- .m-b-0 {
171
- margin-bottom: 0px !important;
172
- }
173
-
174
- .m-b-1 {
175
- margin-bottom: var(--size-8) !important;
176
- }
177
-
178
- .m-b-2 {
179
- margin-bottom: var(--size-16) !important;
180
- }
181
-
182
- .m-b-3 {
183
- margin-bottom: var(--size-24) !important;
184
- }
185
-
186
- .m-b-4 {
187
- margin-bottom: var(--size-32) !important;
188
- }
189
-
190
- .m-b-5 {
191
- margin-bottom: var(--size-40) !important;
192
- }
package/src/less/utilities/max-width.less DELETED
@@ -1,3 +0,0 @@
1
- .text-max-width {
2
- max-width: 600px;
3
- }
package/src/less/utilities/order.less DELETED
@@ -1,111 +0,0 @@
1
- .order-1 {
2
- order: 1;
3
- }
4
-
5
- @media (--screen-sm) {
6
- .order-1--sm {
7
- order: 1;
8
- }
9
- }
10
-
11
- @media (--screen-md) {
12
- .order-1--md {
13
- order: 1;
14
- }
15
- }
16
-
17
- @media (--screen-lg) {
18
- .order-1--lg {
19
- order: 1;
20
- }
21
- }
22
-
23
- @media (--screen-xl) {
24
- .order-1--xl {
25
- order: 1;
26
- }
27
- }
28
-
29
- .order-2 {
30
- order: 2;
31
- }
32
-
33
- @media (--screen-sm) {
34
- .order-2--sm {
35
- order: 2;
36
- }
37
- }
38
-
39
- @media (--screen-md) {
40
- .order-2--md {
41
- order: 2;
42
- }
43
- }
44
-
45
- @media (--screen-lg) {
46
- .order-2--lg {
47
- order: 2;
48
- }
49
- }
50
-
51
- @media (--screen-xl) {
52
- .order-2--xl {
53
- order: 2;
54
- }
55
- }
56
-
57
- .order-3 {
58
- order: 3;
59
- }
60
-
61
- @media (--screen-sm) {
62
- .order-3--sm {
63
- order: 3;
64
- }
65
- }
66
-
67
- @media (--screen-md) {
68
- .order-3--md {
69
- order: 3;
70
- }
71
- }
72
-
73
- @media (--screen-lg) {
74
- .order-3--lg {
75
- order: 3;
76
- }
77
- }
78
-
79
- @media (--screen-xl) {
80
- .order-3--xl {
81
- order: 3;
82
- }
83
- }
84
-
85
- .order-0 {
86
- order: 0;
87
- }
88
-
89
- @media (--screen-sm) {
90
- .order-0--sm {
91
- order: 0;
92
- }
93
- }
94
-
95
- @media (--screen-md) {
96
- .order-0--md {
97
- order: 0;
98
- }
99
- }
100
-
101
- @media (--screen-lg) {
102
- .order-0--lg {
103
- order: 0;
104
- }
105
- }
106
-
107
- @media (--screen-xl) {
108
- .order-0--xl {
109
- order: 0;
110
- }
111
- }
package/src/less/utilities/outline-style.less DELETED
@@ -1,8 +0,0 @@
1
- .outline-none {
2
- outline: none;
3
- /*
4
- TODO: Support Windows High Contrast mode
5
- outline: 2px solid transparent;
6
- outline-offset: 2px;
7
- */
8
- }
package/src/less/utilities/overflow-wrap.less DELETED
@@ -1,3 +0,0 @@
1
- .text-word-break {
2
- overflow-wrap: break-word;
3
- }