mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-09-06 18:16:38 +08:00
Merge pull request #2367 from woocommerce/PCP-3237-fix-apple-pay-button-layout
Fix Apple Pay button layout (3237)
This commit is contained in:
commit
4897193669
3 changed files with 14 additions and 7 deletions
|
@ -4,23 +4,22 @@
|
|||
--apple-pay-button-min-height: 35px;
|
||||
--apple-pay-button-width: 100%;
|
||||
--apple-pay-button-max-width: 750px;
|
||||
--apple-pay-button-border-radius: 4px;
|
||||
--apple-pay-button-border-radius: var(--apm-button-border-radius);
|
||||
--apple-pay-button-overflow: hidden;
|
||||
--apple-pay-button-box-sizing: border-box;
|
||||
|
||||
.ppcp-width-min & {
|
||||
--apple-pay-button-height: 35px;
|
||||
}
|
||||
|
||||
.ppcp-width-300 & {
|
||||
--apple-pay-button-height: 45px;
|
||||
}
|
||||
|
||||
.ppcp-width-500 & {
|
||||
--apple-pay-button-height: 55px;
|
||||
}
|
||||
|
||||
&.ppcp-button-pill {
|
||||
--apple-pay-button-border-radius: 50px;
|
||||
}
|
||||
|
||||
&.ppcp-button-minicart {
|
||||
--apple-pay-button-display: block;
|
||||
}
|
||||
|
|
|
@ -1,17 +1,19 @@
|
|||
|
||||
@mixin button {
|
||||
--apm-button-border-radius: 4px;
|
||||
|
||||
overflow: hidden;
|
||||
min-width: 0;
|
||||
max-width: 750px;
|
||||
line-height: 0;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--apm-button-border-radius);
|
||||
|
||||
// Defaults
|
||||
height: 45px;
|
||||
margin-top: 14px;
|
||||
|
||||
&.ppcp-button-pill {
|
||||
border-radius: 50px;
|
||||
--apm-button-border-radius: 50px;
|
||||
}
|
||||
|
||||
&.ppcp-button-minicart {
|
||||
|
|
|
@ -1,5 +1,11 @@
|
|||
.ppcp-button-googlepay {
|
||||
min-height: 40px;
|
||||
|
||||
.gpay-card-info-container,
|
||||
.gpay-button {
|
||||
outline-offset: -1px;
|
||||
border-radius: var(--apm-button-border-radius);
|
||||
}
|
||||
}
|
||||
|
||||
.wp-block-woocommerce-checkout, .wp-block-woocommerce-cart {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue