@transferwise/neptune-css 0.0.0-experimental-833aa39 → 0.0.0-experimental-00df4a6

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 (4) hide show
  1. package/dist/css/droppable.css +7 -7
  2. package/dist/css/neptune.css +7 -9
  3. package/package.json +1 -1
  4. package/src/less/droppable.less +7 -6
package/dist/css/droppable.css CHANGED
@@ -12,7 +12,7 @@
12
12
  border: 1px solid #c9cbce;
13
13
  border: 1px solid var(--color-interactive-secondary);
14
14
  border-radius: 3px;
15
- overflow: hidden;
15
+ overflow: auto;
16
16
  transition: border-color 0.15s linear;
17
17
  }.droppable:hover {
18
18
  border-color: #b5b7ba;
@@ -53,6 +53,7 @@
53
53
  border: 2px solid var(--color-sentiment-negative) !important;
54
54
  background-color: #ffffff;
55
55
  background-color: var(--color-background-screen);
56
+ min-height: 315px;
56
57
  }.np-theme-personal .droppable-area.droppable-complete.droppable-dropping .droppable-card:first-child {
57
58
  opacity: 0;
58
59
  }.np-theme-personal .droppable-area.droppable-complete .thumbnail {
@@ -129,26 +130,23 @@
129
130
  }.droppable-dropping .droppable-dropping-card {
130
131
  display: flex;
131
132
  }.droppable-processing-card {
133
+ align-items: baseline;
132
134
  display: none;
133
135
  }.droppable-processing-card .droppable-card-content {
134
136
  opacity: 1;
135
137
  }.droppable-processing .droppable-processing-card {
136
138
  display: flex;
137
- transform: translateX(0);
139
+ align-items: baseline;
138
140
  }.droppable-processing .droppable-processing-card .droppable-card-content {
139
141
  opacity: 1;
140
142
  }.droppable-complete .droppable-processing-card {
141
143
  display: flex;
142
- transform: translateX(-100%);
143
144
  }.droppable-complete .droppable-processing-card .droppable-card-content {
144
145
  opacity: 0;
145
146
  }.droppable-complete-card {
146
147
  display: flex;
147
- transform: translateX(100%);
148
148
  }.droppable-complete-card .droppable-card-content {
149
149
  opacity: 0;
150
- }.droppable-complete .droppable-complete-card {
151
- transform: translateX(0);
152
150
  }.droppable-complete .droppable-complete-card .droppable-card-content {
153
151
  opacity: 1;
154
152
  }.droppable-processing .droppable-default-card .droppable-card-content,
@@ -163,7 +161,9 @@
163
161
  display: none;
164
162
  }
165
163
  .droppable-desktop {
166
- display: block;
164
+ display: flex;
165
+ flex-direction: column;
166
+ align-items: stretch;
167
167
  }
168
168
  }.droppable-active {
169
169
  border-style: solid;
package/dist/css/neptune.css CHANGED
@@ -13573,7 +13573,7 @@ li > a > .currency-flag:first-child {
13573
13573
  border: 1px solid #c9cbce;
13574
13574
  border: 1px solid var(--color-interactive-secondary);
13575
13575
  border-radius: 3px;
13576
- overflow: hidden;
13576
+ overflow: auto;
13577
13577
  transition: border-color 0.15s linear;
13578
13578
  }
13579
13579
 
@@ -13636,6 +13636,7 @@ li > a > .currency-flag:first-child {
13636
13636
  border: 2px solid var(--color-sentiment-negative) !important;
13637
13637
  background-color: #ffffff;
13638
13638
  background-color: var(--color-background-screen);
13639
+ min-height: 315px;
13639
13640
  }
13640
13641
 
13641
13642
  .np-theme-personal .droppable-area.droppable-complete.droppable-dropping .droppable-card:first-child {
@@ -13754,6 +13755,7 @@ li > a > .currency-flag:first-child {
13754
13755
  }
13755
13756
 
13756
13757
  .droppable-processing-card {
13758
+ align-items: baseline;
13757
13759
  display: none;
13758
13760
  }
13759
13761
 
@@ -13763,7 +13765,7 @@ li > a > .currency-flag:first-child {
13763
13765
 
13764
13766
  .droppable-processing .droppable-processing-card {
13765
13767
  display: flex;
13766
- transform: translateX(0);
13768
+ align-items: baseline;
13767
13769
  }
13768
13770
 
13769
13771
  .droppable-processing .droppable-processing-card .droppable-card-content {
@@ -13772,7 +13774,6 @@ li > a > .currency-flag:first-child {
13772
13774
 
13773
13775
  .droppable-complete .droppable-processing-card {
13774
13776
  display: flex;
13775
- transform: translateX(-100%);
13776
13777
  }
13777
13778
 
13778
13779
  .droppable-complete .droppable-processing-card .droppable-card-content {
@@ -13781,17 +13782,12 @@ li > a > .currency-flag:first-child {
13781
13782
 
13782
13783
  .droppable-complete-card {
13783
13784
  display: flex;
13784
- transform: translateX(100%);
13785
13785
  }
13786
13786
 
13787
13787
  .droppable-complete-card .droppable-card-content {
13788
13788
  opacity: 0;
13789
13789
  }
13790
13790
 
13791
- .droppable-complete .droppable-complete-card {
13792
- transform: translateX(0);
13793
- }
13794
-
13795
13791
  .droppable-complete .droppable-complete-card .droppable-card-content {
13796
13792
  opacity: 1;
13797
13793
  }
@@ -13816,7 +13812,9 @@ li > a > .currency-flag:first-child {
13816
13812
  display: none;
13817
13813
  }
13818
13814
  .droppable-desktop {
13819
- display: block;
13815
+ display: flex;
13816
+ flex-direction: column;
13817
+ align-items: stretch;
13820
13818
  }
13821
13819
  }
13822
13820
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@transferwise/neptune-css",
3
3
  "description": "Neptune CSS library",
4
- "version": "0.0.0-experimental-833aa39",
4
+ "version": "0.0.0-experimental-00df4a6",
5
5
  "license": "MIT",
6
6
  "repository": {
7
7
  "type": "git",
package/src/less/droppable.less CHANGED
@@ -9,7 +9,7 @@
9
9
  text-align: center;
10
10
  border: 1px solid var(--color-interactive-secondary);
11
11
  border-radius: @border-radius-base;
12
- overflow: hidden;
12
+ overflow: auto;
13
13
  transition: border-color 0.15s linear;
14
14
 
15
15
  &:hover {
@@ -54,6 +54,7 @@
54
54
  &.droppable-negative {
55
55
  border: 2px solid var(--color-sentiment-negative) !important;
56
56
  background-color: var(--color-background-screen);
57
+ min-height: 315px;
57
58
  }
58
59
  &.droppable-complete {
59
60
  &.droppable-dropping .droppable-card:first-child {
@@ -161,6 +162,7 @@
161
162
 
162
163
  // Processing hidden by default
163
164
  .droppable-processing-card {
165
+ align-items: baseline;
164
166
  display: none;
165
167
 
166
168
  .droppable-card-content {
@@ -172,7 +174,7 @@
172
174
 
173
175
  .droppable-processing .droppable-processing-card {
174
176
  display: flex;
175
- transform: translateX(0);
177
+ align-items: baseline;
176
178
 
177
179
  .droppable-card-content {
178
180
  opacity: 1;
@@ -182,7 +184,6 @@
182
184
  .droppable-complete {
183
185
  .droppable-processing-card {
184
186
  display: flex;
185
- transform: translateX(-100%);
186
187
 
187
188
  .droppable-card-content {
188
189
  opacity: 0;
@@ -193,7 +194,6 @@
193
194
  // Completed card translated out and hidden by default
194
195
  .droppable-complete-card {
195
196
  display: flex;
196
- transform: translateX(100%);
197
197
 
198
198
  .droppable-card-content {
199
199
  opacity: 0;
@@ -203,7 +203,6 @@
203
203
  // stylelint-disable-next-line no-duplicate-selectors
204
204
  .droppable-complete {
205
205
  .droppable-complete-card {
206
- transform: translateX(0);
207
206
 
208
207
  .droppable-card-content {
209
208
  opacity: 1;
@@ -236,7 +235,9 @@
236
235
  }
237
236
 
238
237
  .droppable-desktop {
239
- display: block;
238
+ display: flex;
239
+ flex-direction: column;
240
+ align-items: stretch;
240
241
  }
241
242
  }
242
243