wickes-css2 2.107.0-develop.3 → 2.107.0-develop.5

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 (11) hide show
  1. package/Readme.md +1 -0
  2. package/build/css/components/checkout-chip.css +1 -1
  3. package/build/css/components/checkout-payment-details-v2.css +1 -1
  4. package/build/css/main.css +1 -1
  5. package/build/js/page/checkout-payment-details.js +12 -1
  6. package/build/js/page/checkout.js +1 -1
  7. package/package.json +1 -1
  8. package/src/js/page/checkout-payment-details.js +12 -1
  9. package/src/js/page/checkout.js +1 -1
  10. package/src/scss/components/checkout-chip.scss +1 -0
  11. package/src/scss/components/checkout-payment-details-v2.scss +12 -0
package/build/js/page/checkout-payment-details.js CHANGED
@@ -13,6 +13,7 @@ Wick.CheckoutPaymentDetails = (function () {
13
13
  const elements = {
14
14
  $billieRepaymentTerms: $('.js-billie-repayment-terms'),
15
15
  $billieInfoBlock: $('.checkout-payment-details__billie'),
16
+ $billieInfo: $('.checkout-payment-details__billie .billie-info'),
16
17
  $wrapperPaymentInput: $('.checkout-payment-details__row'),
17
18
  paymentInputName: '[name=payment-method]',
18
19
  $cardDetails: $('.checkout-payment-details__card-details'),
@@ -103,7 +104,7 @@ Wick.CheckoutPaymentDetails = (function () {
103
104
 
104
105
  function setBillieStepVisibility(isReady) {
105
106
  setBillingDetailsRowVisibility(isReady);
106
- elements.$billieInfoBlock.toggle(isReady);
107
+ elements.$billieInfo.toggleClass(elements.hiddenClass, !isReady);
107
108
  }
108
109
 
109
110
  function resetBillieRepaymentSelection() {
@@ -239,6 +240,12 @@ Wick.CheckoutPaymentDetails = (function () {
239
240
  });
240
241
  }
241
242
 
243
+ function forceReflow($element) {
244
+ if (!$element.length) return;
245
+ void $element[0].offsetHeight;
246
+ $(window).trigger('resize');
247
+ }
248
+
242
249
  function init() {
243
250
  const paymentMethods = getPaymentMethods();
244
251
  initBillieBusinessTypeToggle();
@@ -248,6 +255,10 @@ Wick.CheckoutPaymentDetails = (function () {
248
255
  const currentMethod = $(elements.paymentInputName + ':checked').val();
249
256
  if (currentMethod !== 'billie') return;
250
257
 
258
+ requestAnimationFrame(() => {
259
+ forceReflow(elements.$billieInfoBlock);
260
+ });
261
+
251
262
  const hasSelection = $('input[name="repaymentTerms"]:checked').length > 0;
252
263
  setBillieStepVisibility(hasSelection);
253
264
 
package/build/js/page/checkout.js CHANGED
@@ -1,4 +1,4 @@
1
- import {checkVoucherCode, voucherRemove} from './components/voucher';
1
+ import { checkVoucherCode, voucherRemove } from './components/voucher';
2
2
 
3
3
  var Wick = window.Wick || {};
4
4
  Wick.Checkout = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "wickes-css2",
3
- "version": "2.107.0-develop.3",
3
+ "version": "2.107.0-develop.5",
4
4
  "description": "CSS and JS and page templates in use by Wickes",
5
5
  "main": "index.js",
6
6
  "scripts": {
package/src/js/page/checkout-payment-details.js CHANGED
@@ -13,6 +13,7 @@ Wick.CheckoutPaymentDetails = (function () {
13
13
  const elements = {
14
14
  $billieRepaymentTerms: $('.js-billie-repayment-terms'),
15
15
  $billieInfoBlock: $('.checkout-payment-details__billie'),
16
+ $billieInfo: $('.checkout-payment-details__billie .billie-info'),
16
17
  $wrapperPaymentInput: $('.checkout-payment-details__row'),
17
18
  paymentInputName: '[name=payment-method]',
18
19
  $cardDetails: $('.checkout-payment-details__card-details'),
@@ -103,7 +104,7 @@ Wick.CheckoutPaymentDetails = (function () {
103
104
 
104
105
  function setBillieStepVisibility(isReady) {
105
106
  setBillingDetailsRowVisibility(isReady);
106
- elements.$billieInfoBlock.toggle(isReady);
107
+ elements.$billieInfo.toggleClass(elements.hiddenClass, !isReady);
107
108
  }
108
109
 
109
110
  function resetBillieRepaymentSelection() {
@@ -239,6 +240,12 @@ Wick.CheckoutPaymentDetails = (function () {
239
240
  });
240
241
  }
241
242
 
243
+ function forceReflow($element) {
244
+ if (!$element.length) return;
245
+ void $element[0].offsetHeight;
246
+ $(window).trigger('resize');
247
+ }
248
+
242
249
  function init() {
243
250
  const paymentMethods = getPaymentMethods();
244
251
  initBillieBusinessTypeToggle();
@@ -248,6 +255,10 @@ Wick.CheckoutPaymentDetails = (function () {
248
255
  const currentMethod = $(elements.paymentInputName + ':checked').val();
249
256
  if (currentMethod !== 'billie') return;
250
257
 
258
+ requestAnimationFrame(() => {
259
+ forceReflow(elements.$billieInfoBlock);
260
+ });
261
+
251
262
  const hasSelection = $('input[name="repaymentTerms"]:checked').length > 0;
252
263
  setBillieStepVisibility(hasSelection);
253
264
 
package/src/js/page/checkout.js CHANGED
@@ -1,4 +1,4 @@
1
- import {checkVoucherCode, voucherRemove} from './components/voucher';
1
+ import { checkVoucherCode, voucherRemove } from './components/voucher';
2
2
 
3
3
  var Wick = window.Wick || {};
4
4
  Wick.Checkout = {
package/src/scss/components/checkout-chip.scss CHANGED
@@ -40,6 +40,7 @@
40
40
  user-select: none;
41
41
  transition: border-color 0.2s;
42
42
  width: 78px;
43
+ margin-bottom: 0;
43
44
  }
44
45
 
45
46
  &__label-top {
package/src/scss/components/checkout-payment-details-v2.scss CHANGED
@@ -405,6 +405,18 @@
405
405
  }
406
406
  }
407
407
  }
408
+
409
+ .js-billie-repayment-terms {
410
+ margin-bottom: 20px;
411
+
412
+ &--has-selection {
413
+ margin-bottom: 0;
414
+ }
415
+
416
+ .form-row__error {
417
+ margin-top: 16px;
418
+ }
419
+ }
408
420
  }
409
421
  }
410
422