From 8331d4672b2e28822beb2f903b4da1ddfd84ac68 Mon Sep 17 00:00:00 2001 From: Matt75 <5262628+Matt75@users.noreply.github.com> Date: Mon, 4 Mar 2024 16:00:21 +0100 Subject: [PATCH] Fix hummingbird selectors & Pay Later banner display --- .../pay-later-banner-ps1_6.component.js | 2 +- .../pay-later-banner-ps1_7.component.js | 2 +- .../pay-later-message-ps1_6.component.js | 1 + .../pay-later-message-ps1_7.component.js | 1 + .../default-selectors-ps1_7-hummingbird.js | 4 ++-- views/css/payments.css | 18 +++++++++++++++--- views/css/payments16.css | 8 ++++++++ 7 files changed, 29 insertions(+), 7 deletions(-) diff --git a/_dev/js/front/src/components/ps-checkout-pay-later-banner.component/pay-later-banner-ps1_6.component.js b/_dev/js/front/src/components/ps-checkout-pay-later-banner.component/pay-later-banner-ps1_6.component.js index 0eb312f0a..a0f9ce875 100644 --- a/_dev/js/front/src/components/ps-checkout-pay-later-banner.component/pay-later-banner-ps1_6.component.js +++ b/_dev/js/front/src/components/ps-checkout-pay-later-banner.component/pay-later-banner-ps1_6.component.js @@ -23,7 +23,7 @@ export class PayLaterBannerPs1_6Component extends BaseComponent { if (null === document.querySelector(containerIdentifier)) { let containerElement = document.createElement('div'); containerElement.id = containerIdentifier.slice(1); - containerElement.classList.add('container'); + containerElement.classList.add('container', 'paypal-pay-later-banner'); querySelector.append(containerElement); } } diff --git a/_dev/js/front/src/components/ps-checkout-pay-later-banner.component/pay-later-banner-ps1_7.component.js b/_dev/js/front/src/components/ps-checkout-pay-later-banner.component/pay-later-banner-ps1_7.component.js index f2cf543d6..addc39d32 100644 --- a/_dev/js/front/src/components/ps-checkout-pay-later-banner.component/pay-later-banner-ps1_7.component.js +++ b/_dev/js/front/src/components/ps-checkout-pay-later-banner.component/pay-later-banner-ps1_7.component.js @@ -23,7 +23,7 @@ export class PayLaterBannerPs1_7Component extends BaseComponent { if (null === document.querySelector(containerIdentifier)) { let containerElement = document.createElement('div'); containerElement.id = containerIdentifier.slice(1); - containerElement.classList.add('mb-2'); + containerElement.classList.add('paypal-pay-later-banner'); querySelector.append(containerElement); } } diff --git a/_dev/js/front/src/components/ps-checkout-pay-later-message.component/pay-later-message-ps1_6.component.js b/_dev/js/front/src/components/ps-checkout-pay-later-message.component/pay-later-message-ps1_6.component.js index c8d4a88ef..e4563d660 100644 --- a/_dev/js/front/src/components/ps-checkout-pay-later-message.component/pay-later-message-ps1_6.component.js +++ b/_dev/js/front/src/components/ps-checkout-pay-later-message.component/pay-later-message-ps1_6.component.js @@ -23,6 +23,7 @@ export class PayLaterMessagePs1_6Component extends BaseComponent { if (null === document.querySelector(containerIdentifier)) { let containerElement = document.createElement('div'); containerElement.id = containerIdentifier.slice(1); + containerElement.classList.add('paypal-pay-later-message'); querySelector.append(containerElement); } } diff --git a/_dev/js/front/src/components/ps-checkout-pay-later-message.component/pay-later-message-ps1_7.component.js b/_dev/js/front/src/components/ps-checkout-pay-later-message.component/pay-later-message-ps1_7.component.js index fd37d8036..983313bdc 100644 --- a/_dev/js/front/src/components/ps-checkout-pay-later-message.component/pay-later-message-ps1_7.component.js +++ b/_dev/js/front/src/components/ps-checkout-pay-later-message.component/pay-later-message-ps1_7.component.js @@ -23,6 +23,7 @@ export class PayLaterMessagePs1_7Component extends BaseComponent { if (null === document.querySelector(containerIdentifier)) { let containerElement = document.createElement('div'); containerElement.id = containerIdentifier.slice(1); + containerElement.classList.add('paypal-pay-later-message'); querySelector.append(containerElement); } } diff --git a/_dev/js/front/src/service/query-selector.service/default-selectors/default-selectors-ps1_7-hummingbird.js b/_dev/js/front/src/service/query-selector.service/default-selectors/default-selectors-ps1_7-hummingbird.js index 22dc2e21e..7547c47aa 100644 --- a/_dev/js/front/src/service/query-selector.service/default-selectors/default-selectors-ps1_7-hummingbird.js +++ b/_dev/js/front/src/service/query-selector.service/default-selectors/default-selectors-ps1_7-hummingbird.js @@ -58,6 +58,6 @@ export const DefaultSelectors1_7Hummingbird = { CVV_ERROR: '#ps_checkout-card-fields-cvv-error', }, - PAYMENT_METHOD_LOGO_PRODUCT_CONTAINER: '#product .product-add-to-cart', - PAYMENT_METHOD_LOGO_CART_CONTAINER: '#cart .cart-summary .cart-detailed-actions' + PAYMENT_METHOD_LOGO_PRODUCT_CONTAINER: '#product .product__add-to-cart', + PAYMENT_METHOD_LOGO_CART_CONTAINER: '#cart .cart-summary .cart-detailed__actions' }; diff --git a/views/css/payments.css b/views/css/payments.css index 97db35383..ce6acaba6 100755 --- a/views/css/payments.css +++ b/views/css/payments.css @@ -16,6 +16,11 @@ * @copyright Since 2007 PrestaShop SA and Contributors * @license https://opensource.org/licenses/AFL-3.0 Academic Free License version 3.0 */ + +.payment__option.ps_checkout-payment-option input[type="radio"] { + margin-top: .7rem; +} + .payment-options > div.payment-option[id$="card-container"] > span.custom-radio { margin-top: .25rem; } @@ -24,9 +29,8 @@ } .product-add-to-cart #ps-checkout-express-button div.paypal-buttons-context-iframe { - margin-top: 1.25rem; - width: 45%; - margin-left: 78px; + margin-top: .5rem; + width: 60%; } #checkout-personal-information-step #ps-checkout-express-button { display: flex; @@ -511,3 +515,11 @@ label[for="ps_checkout-hosted-fields-card-cvv"] { #ps_checkout-card-fields-form .ps_checkout-card-fields-cvv-label-wrapper>label { display: table-cell; } + +.paypal-pay-later-banner { + margin: 0.5em auto; +} + +.paypal-pay-later-banner > span { + margin: auto; +} diff --git a/views/css/payments16.css b/views/css/payments16.css index e306f4037..2ccdfb536 100644 --- a/views/css/payments16.css +++ b/views/css/payments16.css @@ -481,3 +481,11 @@ #ps_checkout-card-fields-form .ps_checkout-card-fields-cvv-label-wrapper>label { display: table-cell; } + +.paypal-pay-later-banner { + margin: 0.5em auto; +} + +.paypal-pay-later-banner > span { + margin: auto; +}