woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-09-01 07:02:48 +08:00
Code Issues Projects Packages Wiki Activity Actions

Refactor GooglePay Styling options

Browse source
This commit is contained in:
Pedro Silva 2023-08-29 17:39:11 +01:00
parent c7f47293af
commit 2f6545aa57
No known key found for this signature in database
GPG key ID: E2EE20C0669D24B3
3 changed files with 24 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

20
modules/ppcp-googlepay/resources/css/styles.scss
View file

@ -1,16 +1,20 @@
#ppc-button-googlepay-container-minicart {
display: block;
}
#ppc-button-googlepay-container, #ppc-button-googlepay-container-minicart {
.ppcp-button-googlepay {
margin-top: 5px;
overflow: hidden;
border-radius: 50px;
height: 45px;
&.ppcp-button-pill {
border-radius: 50px;
}
&.ppcp-button-minicart {
display: block;
height: 40px;
}
}
.woocommerce-checkout {
#ppc-button-googlepay-container, #ppc-button-googlepay-container-minicart {
.ppcp-button-googlepay {
margin-top: 0;
border-radius: 18px;
height: 38px;
@ -18,7 +22,7 @@
}
.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout {
#ppc-button-googlepay-container, #ppc-button-googlepay-container-minicart {
.ppcp-button-googlepay {
margin-top: 0;
}
}

7
modules/ppcp-googlepay/resources/js/GooglepayButton.js
View file

@ -72,6 +72,13 @@ class GooglepayButton {
? this.buttonConfig.button.mini_cart_wrapper
: this.buttonConfig.button.wrapper;
const shape =
(this.context === 'mini-cart')
? this.ppcpConfig.button.mini_cart_style.shape
: this.ppcpConfig.button.style.shape;
jQuery(wrapper).addClass('ppcp-button-' + shape);
const button =
this.paymentsClient.createButton({
onClick: this.onButtonClick.bind(this),

11
modules/ppcp-googlepay/src/Assets/Button.php
View file

@ -210,7 +210,7 @@ class Button implements ButtonInterface {
add_action(
$render_placeholder,
function () {
echo '<span id="ppc-button-googlepay-container-minicart"></span>';
echo '<span id="ppc-button-googlepay-container-minicart" class="ppcp-button-googlepay ppcp-button-minicart"></span>';
},
21
);
@ -221,14 +221,11 @@ class Button implements ButtonInterface {
/**
* GooglePay button markup
*
* @param string $id The HTML id.
* @return void
*/
private function googlepay_button( string $id = 'ppc-button-googlepay-container' ): void {
private function googlepay_button(): void {
?>
<div class="ppc-button-wrapper">
<div id="<?php echo esc_attr( $id ); ?>">
<div id="ppc-button-googlepay-container" class="ppcp-button-googlepay">
<?php wp_nonce_field( 'woocommerce-process_checkout', 'woocommerce-process-checkout-nonce' ); ?>
</div>
</div>
@ -237,6 +234,8 @@ class Button implements ButtonInterface {
/**
* Whether any of the scripts should be loaded.
*
* @return bool
*/
public function should_load_script(): bool {
return true; // TODO.